slack status without the slack
status.zzstoatzz.io
hatk
statusphere
Merge pull request #58 from zzstoatzz/fix/hover-accent-colors
Fix link hover colors to respect accent color preference
authored by
nate nowack
and committed by
GitHub
cfd09b95
88d7660c
+17
-5
+1
-1
templates/error.html
+1
-1
templates/error.html
···
53
53
--text-tertiary: #adb5bd;
54
54
--border-color: #e9ecef;
55
55
--accent: #4a9eff;
56
-
--accent-hover: #3a8eee;
56
+
--accent-hover: color-mix(in srgb, var(--accent) 85%, black);
57
57
--danger: #dc3545;
58
58
--shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
59
59
--shadow-md: 0 4px 6px rgba(0,0,0,0.07);
+8
-2
templates/feed.html
+8
-2
templates/feed.html
···
197
197
--text-tertiary: #adb5bd;
198
198
--border-color: #e9ecef;
199
199
--accent: #4a9eff;
200
-
--accent-hover: #3a8eee;
200
+
--accent-hover: color-mix(in srgb, var(--accent) 85%, black);
201
201
--danger: #dc3545;
202
202
--shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
203
203
--shadow-md: 0 4px 6px rgba(0,0,0,0.07);
···
662
662
transition: color 0.2s;
663
663
}
664
664
665
-
.status-author:hover {
665
+
.status-author:link,
666
+
.status-author:visited {
667
+
color: var(--text-secondary);
668
+
}
669
+
670
+
.status-author:hover,
671
+
.status-author:active {
666
672
color: var(--accent);
667
673
}
668
674
+1
-1
templates/login.html
+1
-1
templates/login.html
···
86
86
--text-tertiary: #adb5bd;
87
87
--border-color: #e9ecef;
88
88
--accent: #4a9eff;
89
-
--accent-hover: #3a8eee;
89
+
--accent-hover: color-mix(in srgb, var(--accent) 85%, black);
90
90
--danger: #dc3545;
91
91
--shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
92
92
--shadow-md: 0 4px 6px rgba(0,0,0,0.07);
+7
-1
templates/status.html
+7
-1
templates/status.html
···
599
599
border-radius: var(--radius-sm);
600
600
}
601
601
602
+
.handle-link:link,
603
+
.handle-link:visited {
604
+
color: var(--text-secondary);
605
+
}
606
+
602
607
.handle-link::before {
603
608
content: '';
604
609
position: absolute;
···
611
616
filter: blur(8px);
612
617
}
613
618
614
-
.handle-link:hover {
619
+
.handle-link:hover,
620
+
.handle-link:active {
615
621
color: var(--accent);
616
622
text-shadow: 0 0 12px var(--accent);
617
623
}