Add caret styling CSS (go-gitea#15651)

* Add caret styling CSS

Fixes: go-gitea#15644

* add rule in arc-green as well

* grammar

* Update web_src/less/themes/theme-arc-green.less

Co-authored-by: Wim <[email protected]>

* remove extra rule

* add comment

Co-authored-by: zeripath <[email protected]>
Co-authored-by: Wim <[email protected]>
Co-authored-by: techknowlogick <[email protected]>

Author: 4 people

web_src/less/_base.less

@@ -112,6 +112,7 @@
   --color-placeholder-text: #aaa;
   --color-editor-line-highlight: var(--color-primary-light-6);
   --color-project-board-bg: var(--color-secondary-light-4);
+  --color-caret: var(--color-text-dark);
   /* backgrounds */
   --checkbox-mask-checked: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="-1 -1 18 18" width="16" height="16"><path fill-rule="evenodd" d="M13.78 4.22a.75.75 0 010 1.06l-7.25 7.25a.75.75 0 01-1.06 0L2.22 9.28a.75.75 0 011.06-1.06L6 10.94l6.72-6.72a.75.75 0 011.06 0z"></path></svg>');
   --checkbox-mask-indeterminate: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M2 7.75A.75.75 0 012.75 7h10a.75.75 0 010 1.5h-10A.75.75 0 012 7.75z"></path></svg>');
@@ -161,15 +162,12 @@ table {
   border-collapse: collapse;
 }
 
-/* firefox scroll bars */
-
 * {
   scrollbar-width: thin;
   scrollbar-color: var(--color-primary) transparent;
+  caret-color: var(--color-caret);
 }
 
-/* webkit scrollbars */
-
 ::-webkit-scrollbar {
   width: 10px;
 }
@@ -188,6 +186,10 @@ table {
   background: transparent;
 }
 
+.CodeMirror-cursor {
+  border-color: var(--color-caret) !important;
+}
+
 ::selection,
 .CodeMirror-selected {
   background: var(--color-primary-light-1) !important;

web_src/less/_editor.less

@@ -4,10 +4,6 @@
   border-color: var(--color-secondary);
   font: 14px var(--fonts-monospace);
 
-  .CodeMirror-cursor {
-    border-left: 1px solid var(--color-input-text);
-  }
-
   &.cm-s-default {
     border-radius: 3px;
     padding: 0 !important;

web_src/less/themes/theme-arc-green.less

@@ -108,6 +108,7 @@
   --color-placeholder-text: #6a737d;
   --color-editor-line-highlight: var(--color-primary-light-5);
   --color-project-board-bg: var(--color-secondary-light-2);
+  --color-caret: var(--color-text); /* should ideally be --color-text-dark, see #15651 */
 }
 
 ::-webkit-calendar-picker-indicator {