Add new CSS variables --color-accent and --color-small-accent

At the moment, this is only used to replace the color of the "viewed"
checkbox.
Previously, the used variable accentuated always either darker or lighter,
which meant that one theme looked good while the other didn't.

Author: delvh

web_src/less/_base.less

@@ -159,6 +159,9 @@
   --color-tooltip-text: #ffffff;
   --color-header-bar: #ffffff;
   --color-label-active-bg: #d0d0d0;
+  /* accent */
+  --color-small-accent: var(--color-primary-light-6);
+  --color-accent: var(--color-primary-light-4);
   /* 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>');

web_src/less/_review.less

@@ -286,8 +286,8 @@ a.blob-excerpt:hover {
 }
 
 .viewed-file-checked-form {
-  background-color: var(--color-primary-light-6);
-  border: 1px solid var(--color-primary-light-4);
+  background-color: var(--color-small-accent);
+  border: 1px solid var(--color-accent);
 }
 
 #viewed-files-summary {

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

@@ -134,6 +134,7 @@
   --color-reaction-active-bg: var(--color-primary-alpha-40);
   --color-header-bar: #2e323e;
   --color-label-active-bg: #4c525e;
+  --color-small-accent: #8eff8e25;
 }
 
 ::-webkit-calendar-picker-indicator {