chore: improve light mode CSS and document size rationale #152
+53
-2
@@ -1,4 +1,12 @@
|
||||
/* Gitea Mobile — Mobile-first CSS (~5KB target) */
|
||||
/* Gitea Mobile — Mobile-first CSS
|
||||
* Dark-mode-first: dark colors are the :root defaults.
|
||||
* Light mode is applied via @media (prefers-color-scheme: light).
|
||||
*
|
||||
* Size note: The original ~5KB target was based on the initial Phase 1 scope.
|
||||
* The CSS has grown to ~12KB as the app added error pages, forms, comments,
|
||||
* review UI, triage queue, and filter components. All rules are in active use.
|
||||
* Minification in the Dockerfile build step can reduce transfer size by ~40%.
|
||||
*/
|
||||
|
||||
/* Reset */
|
||||
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
|
||||
@@ -533,7 +541,7 @@ a:active {
|
||||
}
|
||||
}
|
||||
|
||||
/* Dark mode is default; light mode override if needed */
|
||||
/* Dark mode is default; light mode override for prefers-color-scheme: light */
|
||||
@media (prefers-color-scheme: light) {
|
||||
:root {
|
||||
--bg-primary: #ffffff;
|
||||
@@ -543,6 +551,49 @@ a:active {
|
||||
--text-primary: #1f2328;
|
||||
--text-secondary: #656d76;
|
||||
--text-link: #0969da;
|
||||
--accent-green: #1a7f37;
|
||||
--accent-red: #cf222e;
|
||||
--accent-yellow: #9a6700;
|
||||
--accent-blue: #0969da;
|
||||
--accent-purple: #8250df;
|
||||
}
|
||||
|
||||
.message.success {
|
||||
background: #dafbe1;
|
||||
border-color: #1a7f37;
|
||||
}
|
||||
|
||||
.message.error {
|
||||
background: #ffebe9;
|
||||
border-color: #cf222e;
|
||||
}
|
||||
|
||||
.message.info {
|
||||
background: #ddf4ff;
|
||||
border-color: #0969da;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: #1a7f37;
|
||||
}
|
||||
|
||||
.btn-primary:active {
|
||||
background: #116329;
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
background: #ffebe9;
|
||||
border-color: #cf222e;
|
||||
}
|
||||
|
||||
.type-issue {
|
||||
background: rgba(9, 105, 218, 0.1);
|
||||
border-color: rgba(9, 105, 218, 0.3);
|
||||
}
|
||||
|
||||
.type-pull {
|
||||
background: rgba(26, 127, 55, 0.1);
|
||||
border-color: rgba(26, 127, 55, 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user