feat: illustrate empty states

This commit is contained in:
ik
2026-09-07 17:09:22 +07:00
parent 6d88ba030f
commit dbe01359de
4 changed files with 5 additions and 2 deletions
+1
View File
@@ -7,6 +7,7 @@ import "../styles/data-legend.css";
import "../styles/coordinate-radar.css";
import "../styles/activity-timeline.css";
import "../styles/fish-silhouette.css";
import "../styles/empty-states.css";
import FishingIcon from "../components/FishingIcon.astro";
const {
title = "RF4 Spotter — свежие точки клёва Russian Fishing 4",
+2
View File
@@ -0,0 +1,2 @@
.state{position:relative;overflow:hidden;padding:34px}.state:before{content:"";width:22px;height:52px;margin-bottom:18px;border:1px solid #56726d;border-radius:50% 50% 42% 42%;background:linear-gradient(180deg,#ff785a 0 30%,#fff 31% 55%,var(--lime) 56%);box-shadow:inset -5px 0 #173c3f18;transform:rotate(3deg)}.state:after{content:"";position:absolute;width:88px;height:18px;left:50%;top:89px;translate:-50% 0;border:1px solid #648784;border-width:1px 0 0;border-radius:50%;box-shadow:0 -7px 0 -6px #648784,0 7px 0 -6px #648784;opacity:.55}.state.compact-state:before{width:17px;height:40px;margin-bottom:11px}.state.compact-state:after{top:60px;width:68px}.state.error-state:before{filter:grayscale(.35);opacity:.7}
@media(prefers-reduced-motion:no-preference){.state:before{animation:empty-bob 3s ease-in-out infinite}.state:after{animation:empty-ripple 3s ease-out infinite}}@keyframes empty-bob{50%{translate:0 -4px;rotate:-4deg}}@keyframes empty-ripple{50%{scale:1.12 .9;opacity:.25}}