This commit is contained in:
Heidi
2026-05-16 16:54:48 +01:00
parent ec64c1c89e
commit 382177fd2e
2 changed files with 107 additions and 84 deletions
+1 -1
View File
@@ -3334,7 +3334,7 @@ function LocationSignalMap({ countries, locations }) {
return (
<div className="p-5">
<div className="relative h-[340px] overflow-hidden rounded-md border border-border bg-surface">
<div className="location-signal-map relative z-0 h-[340px] overflow-hidden rounded-md border border-border bg-surface">
<div ref={mapRef} className="h-full w-full" />
</div>
+106 -83
View File
@@ -254,111 +254,123 @@ h3 {
.pixel-sun {
left: 78%;
top: 18%;
width: 88px;
height: 88px;
background: #fdb068;
width: 96px;
height: 96px;
background: var(--color-fury-glow);
clip-path: polygon(
36% 0,
64% 0,
64% 12%,
84% 12%,
84% 36%,
100% 36%,
100% 64%,
84% 64%,
84% 84%,
64% 84%,
64% 100%,
36% 100%,
36% 84%,
12% 84%,
12% 64%,
0 64%,
0 36%,
12% 36%,
12% 12%,
36% 12%
33.333% 0,
66.666% 0,
66.666% 8.333%,
83.333% 8.333%,
83.333% 16.666%,
91.666% 16.666%,
91.666% 33.333%,
100% 33.333%,
100% 66.666%,
91.666% 66.666%,
91.666% 83.333%,
83.333% 83.333%,
83.333% 91.666%,
66.666% 91.666%,
66.666% 100%,
33.333% 100%,
33.333% 91.666%,
16.666% 91.666%,
16.666% 83.333%,
8.333% 83.333%,
8.333% 66.666%,
0 66.666%,
0 33.333%,
8.333% 33.333%,
8.333% 16.666%,
16.666% 16.666%,
16.666% 8.333%,
33.333% 8.333%
);
box-shadow:
0 -36px 0 -28px #fdb068,
0 36px 0 -28px #fdb068,
-36px 0 0 -28px #fdb068,
36px 0 0 -28px #fdb068,
28px 28px 0 -30px #fdb068,
-28px 28px 0 -30px #fdb068,
28px -28px 0 -30px #fdb068,
-28px -28px 0 -30px #fdb068;
0 -40px 0 -32px var(--color-fury-glow),
0 40px 0 -32px var(--color-fury-glow),
-40px 0 0 -32px var(--color-fury-glow),
40px 0 0 -32px var(--color-fury-glow),
32px 32px 0 -34px var(--color-fury-violet),
-32px 32px 0 -34px var(--color-fury-violet),
32px -32px 0 -34px var(--color-fury-violet),
-32px -32px 0 -34px var(--color-fury-violet),
inset -12px -12px 0 0 var(--color-soft-apricot-300);
}
.pixel-sun::after {
position: absolute;
left: 18px;
top: 18px;
left: 24px;
top: 20px;
width: 24px;
height: 24px;
background: #fff2e6;
clip-path: polygon(25% 0, 75% 0, 75% 25%, 100% 25%, 100% 75%, 75% 75%, 75% 100%, 25% 100%, 25% 75%, 0 75%, 0 25%, 25% 25%);
background: var(--color-soft-apricot-50);
clip-path: polygon(0 0, 100% 0, 100% 66.666%, 66.666% 66.666%, 66.666% 100%, 0 100%);
content: "";
}
.pixel-moon {
left: 78%;
top: 18%;
width: 80px;
height: 80px;
background: #fff2e6;
width: 88px;
height: 88px;
background: var(--color-soft-apricot-50);
clip-path: polygon(
35% 0,
72% 0,
72% 12%,
88% 12%,
88% 28%,
100% 28%,
100% 72%,
88% 72%,
88% 88%,
72% 88%,
72% 100%,
35% 100%,
35% 88%,
18% 88%,
18% 72%,
0 72%,
0 28%,
18% 28%,
18% 12%,
35% 12%
36.363% 0,
72.727% 0,
72.727% 9.09%,
90.909% 9.09%,
90.909% 27.272%,
100% 27.272%,
100% 72.727%,
90.909% 72.727%,
90.909% 90.909%,
72.727% 90.909%,
72.727% 100%,
36.363% 100%,
36.363% 90.909%,
18.181% 90.909%,
18.181% 72.727%,
0 72.727%,
0 27.272%,
18.181% 27.272%,
18.181% 9.09%,
36.363% 9.09%
);
box-shadow:
inset -8px -8px 0 0 var(--color-soft-apricot-100),
24px 20px 0 -18px var(--color-soft-apricot-100);
}
.pixel-moon::after {
position: absolute;
left: 30px;
top: -8px;
width: 74px;
height: 74px;
left: 34px;
top: -10px;
width: 82px;
height: 82px;
background: var(--color-bg);
clip-path: polygon(
35% 0,
72% 0,
72% 12%,
88% 12%,
88% 28%,
100% 28%,
100% 72%,
88% 72%,
88% 88%,
72% 88%,
72% 100%,
35% 100%,
35% 88%,
18% 88%,
18% 72%,
0 72%,
0 28%,
18% 28%,
18% 12%,
35% 12%
36.363% 0,
72.727% 0,
72.727% 9.09%,
90.909% 9.09%,
90.909% 27.272%,
100% 27.272%,
100% 72.727%,
90.909% 72.727%,
90.909% 90.909%,
72.727% 90.909%,
72.727% 100%,
36.363% 100%,
36.363% 90.909%,
18.181% 90.909%,
18.181% 72.727%,
0 72.727%,
0 27.272%,
18.181% 27.272%,
18.181% 9.09%,
36.363% 9.09%
);
content: "";
}
@@ -368,7 +380,8 @@ h3 {
display: block;
width: 6px;
height: 6px;
background: #fee5cd;
background: var(--color-soft-apricot-100);
box-shadow: 8px 0 0 -2px var(--color-fury-glow), 0 8px 0 -2px var(--color-fury-glow);
}
.pixel-star-a {
@@ -486,6 +499,16 @@ h3 {
z-index: 2;
}
.location-signal-map .leaflet-pane,
.location-signal-map .leaflet-top,
.location-signal-map .leaflet-bottom {
z-index: 0;
}
.location-signal-map .leaflet-control {
z-index: 1;
}
@keyframes scrollPulse {
0% {
transform: translateY(-100%);