zzstoatzz.io
slack status without the slack
status.zzstoatzz.io/
quickslice
fix: refine aesthetic details for better UX
- Remove bounding rectangle glow on handle hover, keep text-only glow
- Make set button hover use dynamic accent color instead of hardcoded blue
- Reduce pulsating glow intensity on status emoji by ~10%
+5
-5
+5
-5
templates/status.html
+5
-5
templates/status.html
···
292
292
--text-tertiary: #adb5bd;
293
293
--border-color: #e9ecef;
294
294
--accent: #4a9eff;
295
-
--accent-hover: #3a8eee;
295
+
--accent-hover: color-mix(in srgb, var(--accent) 85%, black);
296
296
--danger: #dc3545;
297
297
--shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
298
298
--shadow-md: 0 4px 6px rgba(0,0,0,0.07);
···
394
394
395
395
.handle-link:hover {
396
396
color: var(--accent);
397
-
text-shadow: 0 0 20px rgba(74, 158, 255, 0.3);
397
+
text-shadow: 0 0 12px var(--accent);
398
398
}
399
399
400
400
.handle-link:hover::before {
401
-
opacity: 0.3;
401
+
opacity: 0;
402
402
}
403
403
404
404
.nav-button {
···
636
636
filter: drop-shadow(0 0 0 transparent);
637
637
}
638
638
50% {
639
-
transform: scale(1.02);
640
-
filter: drop-shadow(0 0 12px var(--accent));
639
+
transform: scale(1.018);
640
+
filter: drop-shadow(0 0 10px var(--accent));
641
641
}
642
642
}
643
643