godotengine/doc-status
1
0
Fork 0
mirror of https://github.com/godotengine/doc-status.git synced 2026-01-04 10:09:48 +03:00
Code Issues Packages Projects Releases Wiki Activity

Style the table at build time to speed up page loading (#4)

Browse Source 
This makes the page load in ~500 ms instead of 3 seconds on
Chromium 81 on Linux.
This commit is contained in:
Hugo Locurcio
2020-06-27 00:42:30 +02:00
committed by GitHub
parent 7f457624e3
commit 516670446a
3 changed files with 30 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
static/main.css
View File

@@ -2,6 +2,7 @@
--body-background-color: hsl(0, 0%, 100%);
--body-color: hsl(0, 0%, 25%);
--link-color: hsl(210, 90%, 50%);
--completion-complete-color: hsl(125, 60%, 35%);
}
@media (prefers-color-scheme: dark) {
@@ -9,6 +10,7 @@
--body-background-color: hsl(0, 0%, 20%);
--body-color: hsl(0, 0%, 85%);
--link-color: hsl(210, 100%, 80%);
--completion-complete-color: hsl(125, 50%, 65%);
}
}
@@ -62,3 +64,21 @@ td:first-child {
font-weight: bold;
text-align: right;
}
.completion-complete {
color: var(--completion-complete-color);
}
/* Dynamic coloring depending on the completion percentage. */
/* Will be fully red at (roughly) 50% completion, and black/white (depending on the theme) at 99%. */
.completion-incomplete {
font-weight: bold;
color: rgb(calc(320 - calc(var(--percentage) * 3.2)), 64, 64);
}
@media (prefers-color-scheme: dark) {
.completion-incomplete {
--green-blue: calc(80 + calc(var(--percentage) * 2));
color: rgb(255, var(--green-blue), var(--green-blue));
}
}