Small CSS fixups

* Solarized actually names its colors 03, 02, 01, 00, 0, 1, 2, 3
  so those leading digits are actually relevant.
* It turns out .kint-trace hasn't been a thing since kint 1 back
  in 2016 (Wow)
* I'm very glad that highlight color has been broken all this
  time, it's horrible. Scrapped
* The problem with the color preview box is that you can change
  the width and height, so setting a max doesn't actually solve
  the underlying issue. It's just hard to get the checker pattern
  to line up with the box it's in even if you know the dimensions.

resources/sass/_base.scss

@@ -199,7 +199,7 @@
     margin-left: 5px;
     font-weight: bold;
     text-align: center;
-    line-height: var(--color-size);
+    line-height: 1;
     float: right !important;
     cursor: pointer;
     color: var(--main-background);
@@ -231,7 +231,7 @@
     margin: calc(var(--spacing) * -1) 0;
     color: var(--variable-name-color);
     background: var(--secondary-background);
-    height: calc(var(--color-size) * 1 + var(--spacing) * 2);
+    height: calc(var(--color-size) + var(--spacing) * 2);
     width: calc(var(--color-size) * 10);
     position: relative;
     z-index: 100;
@@ -389,12 +389,10 @@
     vertical-align: middle;
     margin-left: 10px;
     border: var(--border);
-    max-width: 30px;
-    max-height: 30px;
     background: {
       color: #ccc;
       image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2 2"><path fill="%23FFF" d="M0 0h1v2h1V1H0z"/></svg>');
-      size: 100%;
+      size: min(20px, 100%);
     }
 
     &:hover {

resources/sass/original.scss

@@ -5,24 +5,17 @@
   --gradient-end: #c0d4df;
   --tabs-gradient-start: #9dbed0;
   --tabs-gradient-end: #b2ccda;
-  --highlight-color: #f0eb96;
 
   > dl > dt {
     background: linear-gradient(to bottom, var(--gradient-start) 0%, var(--gradient-end) 100%);
   }
-  ul.kint-tabs {
-    background: linear-gradient(to bottom, var(--tabs-gradient-start) 0%, var(--tabs-gradient-end) 100%);
-  }
-  & > dl:not(.kint-trace) > dd > ul.kint-tabs li {
+  > dl > dd > ul.kint-tabs li {
     background: var(--main-background);
     &.kint-active-tab {
       background: var(--secondary-background);
     }
   }
-  & > dl.kint-trace > dt {
-    background: linear-gradient(to bottom, var(--gradient-end) 0%, var(--gradient-start) 100%);
-  }
-  .kint-source .kint-highlight {
-    background: var(--highlight-color);
+  ul.kint-tabs {
+    background: linear-gradient(to bottom, var(--tabs-gradient-start) 0%, var(--tabs-gradient-end) 100%);
   }
 }

resources/sass/solarized-dark.scss

@@ -3,10 +3,10 @@
 .kint-rich {
   --spacing: 5px;
 
-  // base 3
+  // base 03
   --main-background: #002b36;
 
-  // base 2
+  // base 02
   --secondary-background: #073642;
 
   --backdrop-color: var(--secondary-background);
@@ -23,7 +23,7 @@
   // cyan
   --variable-type-color-hover: #2aa198;
 
-  // base 1
+  // base 01
   --border-color: #586e75;
 
   // blue

resources/sass/solarized.scss

@@ -9,10 +9,10 @@
   // base 2
   --secondary-background: #eee8d5;
 
-  // base 0
+  // base 00
   --text-color: #657b83;
 
-  // base 1
+  // base 01
   --variable-name-color: #586e75;
 
   // blue