commit a881d5b4f7cde2bef0b2a809c8156f5852c03ef4
parent ada84ba3d4b2046a13729afc8f90e266b49d0a0b
Author: JayVii <jayvii[AT]posteo[DOT]de>
Date: Thu, 25 Dec 2025 15:02:04 +0100
fix: mobile optimizations
Diffstat:
3 files changed, 38 insertions(+), 5 deletions(-)
diff --git a/css/simple.css b/css/simple.css
@@ -6,6 +6,7 @@
--primary-highlight-shadow: #1266e250;
--text-color: #212121;
--background-color: #ffffff;
+ --header-color: #f5f7ff;
}
@media (prefers-color-scheme: dark) {
:root {
@@ -15,6 +16,7 @@
--primary-highlight-shadow: #ffe09950;
--text-color: #dcdcdc;
--background-color: #212121;
+ --header-color: #2b2b2b;
}
}
@@ -74,8 +76,8 @@ html, body, #content > .entry.expanded.selected {
div.entry, .source {
background: var(--background-color);
}
-.entry-title {
- color: var(--text-color);
+.entry-title, .entry.unread {
+ color: var(--text-color) !important;
}
.entry.selected {
@@ -104,3 +106,34 @@ div.entry, .source {
#search-term:focus {
color: var(--text-color);
}
+
+/* Mobile specific colour changes */
+
+#nav-mobile {
+ background-color: var(--header-color);
+}
+
+@media screen and (max-width: 1024px) {
+ .entry.selected.unread, .entry.unread {
+ border-left: 0;
+ border-right: 5px solid var(--primary);
+ }
+}
+
+@media screen and (max-width: 1024px) {
+ .entry.selected {
+ background-color: initial;
+ }
+}
+
+@media (prefers-color-scheme: light) {
+ #nav-mobile-logo, #nav-mobile-settings {
+ filter: invert(100%);
+ }
+}
+
+@media screen and (max-width: 1024px) {
+ #search-button {
+ background-color: var(--primary-highlight);
+ }
+}
diff --git a/css/simple.min.css b/css/simple.min.css
@@ -1 +1 @@
-:root{--primary:#0d47a1;--primary-contrast:#dcdcdc;--primary-highlight:#1266e2;--primary-highlight-shadow:#1266e250;--text-color:#212121;--background-color:#ffffff;}@media (prefers-color-scheme:dark){:root{--primary:#ffb300;--primary-contrast:#2d291f;--primary-highlight:#ffe099;--primary-highlight-shadow:#ffe09950;--text-color:#dcdcdc;--background-color:#212121;}}html,body,#content>.entry.expanded.selected{color:var(--primary) !important;background-color:var(--background-color) !important;background-image:none !important;}#nav-mark,#nav-mark:hover{color:var(--primary-contrast);}#nav-mark:hover{background:var(--primary-highlight);}#nav{background-color:var(--background-color);}#nav-tags li a,#nav-sources li a{color:var(--text-color);}#nav-filter li a.active,#nav-tags li a.active,#nav-sources li a.active{background:var(--primary);color:var(--primary-contrast) !important;}#nav-filter li a:hover,#nav-tags li a:hover,#nav-sources li a:hover{background:var(--primary-highlight);color:var(--primary-contrast) !important;}#nav-filter>.active>span.offline-count,#nav-filter .active span{color:var(--primary-contrast) !important;}.nav-toolbar>button,.nav-toolbar>a{background:transparent !important;}div.entry,.source{background:var(--background-color);}.entry-title{color:var(--text-color);}.entry.selected{border-color:var(--primary);}#content>.entry.expanded.selected{color:var(--text-color) !important;}.entry-toolbar{background-color:var(--background-color);border-top:1p solid var(--text-color);}#search{background-color:var(--primary);}#search>button>svg{filter:invert(100%)}#search-term:focus{color:var(--text-color);}
-\ No newline at end of file
+:root{--primary:#0d47a1;--primary-contrast:#dcdcdc;--primary-highlight:#1266e2;--primary-highlight-shadow:#1266e250;--text-color:#212121;--background-color:#ffffff;--header-color:#f5f7ff;}@media (prefers-color-scheme:dark){:root{--primary:#ffb300;--primary-contrast:#2d291f;--primary-highlight:#ffe099;--primary-highlight-shadow:#ffe09950;--text-color:#dcdcdc;--background-color:#212121;--header-color:#2b2b2b;}}html,body,#content>.entry.expanded.selected{color:var(--primary) !important;background-color:var(--background-color) !important;background-image:none !important;}#nav-mark,#nav-mark:hover{color:var(--primary-contrast);}#nav-mark:hover{background:var(--primary-highlight);}#nav{background-color:var(--background-color);}#nav-tags li a,#nav-sources li a{color:var(--text-color);}#nav-filter li a.active,#nav-tags li a.active,#nav-sources li a.active{background:var(--primary);color:var(--primary-contrast) !important;}#nav-filter li a:hover,#nav-tags li a:hover,#nav-sources li a:hover{background:var(--primary-highlight);color:var(--primary-contrast) !important;}#nav-filter>.active>span.offline-count,#nav-filter .active span{color:var(--primary-contrast) !important;}.nav-toolbar>button,.nav-toolbar>a{background:transparent !important;}div.entry,.source{background:var(--background-color);}.entry-title,.entry.unread{color:var(--text-color) !important;}.entry.selected{border-color:var(--primary);}#content>.entry.expanded.selected{color:var(--text-color) !important;}.entry-toolbar{background-color:var(--background-color);border-top:1p solid var(--text-color);}#search{background-color:var(--primary);}#search>button>svg{filter:invert(100%)}#search-term:focus{color:var(--text-color);}#nav-mobile{background-color:var(--header-color);}@media screen and (max-width:1024px){.entry.selected.unread,.entry.unread{border-left:0;border-right:5px solid var(--primary);}}@media screen and (max-width:1024px){.entry.selected{background-color:initial;}}@media (prefers-color-scheme:light){#nav-mobile-logo,#nav-mobile-settings{filter:invert(100%);}}@media screen and (max-width:1024px){#search-button{background-color:var(--primary-highlight);}}
+\ No newline at end of file
diff --git a/css/user.css b/css/user.css
@@ -5,4 +5,4 @@
/* Desktop Rules */
@media screen and (min-width:641px){.entry:not(.expanded) .entry-toolbar{display:block;padding:0px;background:inherit;border:0;margin-top:-2px;opacity:0.0;}.entry:not(.expanded):hover .entry-toolbar{opacity:1.0;}.entry-content{column-count:1;}}
/* Simple CSS Rules */
-:root{--primary:#0d47a1;--primary-contrast:#dcdcdc;--primary-highlight:#1266e2;--primary-highlight-shadow:#1266e250;--text-color:#212121;--background-color:#ffffff;}@media (prefers-color-scheme:dark){:root{--primary:#ffb300;--primary-contrast:#2d291f;--primary-highlight:#ffe099;--primary-highlight-shadow:#ffe09950;--text-color:#dcdcdc;--background-color:#212121;}}html,body,#content>.entry.expanded.selected{color:var(--primary) !important;background-color:var(--background-color) !important;background-image:none !important;}#nav-mark,#nav-mark:hover{color:var(--primary-contrast);}#nav-mark:hover{background:var(--primary-highlight);}#nav{background-color:var(--background-color);}#nav-tags li a,#nav-sources li a{color:var(--text-color);}#nav-filter li a.active,#nav-tags li a.active,#nav-sources li a.active{background:var(--primary);color:var(--primary-contrast) !important;}#nav-filter li a:hover,#nav-tags li a:hover,#nav-sources li a:hover{background:var(--primary-highlight);color:var(--primary-contrast) !important;}#nav-filter>.active>span.offline-count,#nav-filter .active span{color:var(--primary-contrast) !important;}.nav-toolbar>button,.nav-toolbar>a{background:transparent !important;}div.entry,.source{background:var(--background-color);}.entry-title{color:var(--text-color);}.entry.selected{border-color:var(--primary);}#content>.entry.expanded.selected{color:var(--text-color) !important;}.entry-toolbar{background-color:var(--background-color);border-top:1p solid var(--text-color);}#search{background-color:var(--primary);}#search>button>svg{filter:invert(100%)}#search-term:focus{color:var(--text-color);}
+:root{--primary:#0d47a1;--primary-contrast:#dcdcdc;--primary-highlight:#1266e2;--primary-highlight-shadow:#1266e250;--text-color:#212121;--background-color:#ffffff;--header-color:#f5f7ff;}@media (prefers-color-scheme:dark){:root{--primary:#ffb300;--primary-contrast:#2d291f;--primary-highlight:#ffe099;--primary-highlight-shadow:#ffe09950;--text-color:#dcdcdc;--background-color:#212121;--header-color:#2b2b2b;}}html,body,#content>.entry.expanded.selected{color:var(--primary) !important;background-color:var(--background-color) !important;background-image:none !important;}#nav-mark,#nav-mark:hover{color:var(--primary-contrast);}#nav-mark:hover{background:var(--primary-highlight);}#nav{background-color:var(--background-color);}#nav-tags li a,#nav-sources li a{color:var(--text-color);}#nav-filter li a.active,#nav-tags li a.active,#nav-sources li a.active{background:var(--primary);color:var(--primary-contrast) !important;}#nav-filter li a:hover,#nav-tags li a:hover,#nav-sources li a:hover{background:var(--primary-highlight);color:var(--primary-contrast) !important;}#nav-filter>.active>span.offline-count,#nav-filter .active span{color:var(--primary-contrast) !important;}.nav-toolbar>button,.nav-toolbar>a{background:transparent !important;}div.entry,.source{background:var(--background-color);}.entry-title,.entry.unread{color:var(--text-color) !important;}.entry.selected{border-color:var(--primary);}#content>.entry.expanded.selected{color:var(--text-color) !important;}.entry-toolbar{background-color:var(--background-color);border-top:1p solid var(--text-color);}#search{background-color:var(--primary);}#search>button>svg{filter:invert(100%)}#search-term:focus{color:var(--text-color);}#nav-mobile{background-color:var(--header-color);}@media screen and (max-width:1024px){.entry.selected.unread,.entry.unread{border-left:0;border-right:5px solid var(--primary);}}@media screen and (max-width:1024px){.entry.selected{background-color:initial;}}@media (prefers-color-scheme:light){#nav-mobile-logo,#nav-mobile-settings{filter:invert(100%);}}@media screen and (max-width:1024px){#search-button{background-color:var(--primary-highlight);}}
