Merge pull request #1238 from matthijsgroen/patch-1

Improve readability of sticky header in appendix

Author: mlinksva

appendix.md

@@ -11,7 +11,7 @@ If you're here to choose a license, **[start from the home page](/)** to see a f
 
 <table border style="font-size: xx-small; position: relative">
 {% assign types = "permissions|conditions|limitations" | split: "|" %}
-<tr style="position: sticky; top: 0">
+<tr style="position: sticky; top: 0; z-index: 1000001; background: color-mix(in srgb, var(--backgroundColor) 70%, transparent);">
   <th scope="col" style="text-align: center">License</th>
   {% assign seen_tags = '' %}
   {% for type in types %}

assets/css/application.scss

@@ -6,13 +6,15 @@
 
 body {
   background: #fafafa;
+  --backgroundColor: #fafafa;
   color: #5c5855;
   font: 0.875rem/1.4 "Helvetica Neue", Helvetica, Arial, sans-serif;
 }
 
 @media (prefers-color-scheme: dark) {
   body {
     background: #212121;
+    --backgroundColor: #212121;
     color: #d0c8c1;
   }