ai generated solutions to our ai generated problems

This commit is contained in:
2026-06-20 01:15:50 +01:00
parent 6f8c8800ec
commit 0955528df0
2 changed files with 33 additions and 116 deletions
+11 -114
View File
@@ -204,6 +204,7 @@ h3 {
position: absolute;
display: block;
image-rendering: pixelated;
image-rendering: crisp-edges;
transform: translate(-50%, -50%);
will-change: left, opacity, top, transform;
}
@@ -211,134 +212,30 @@ h3 {
.pixel-sun {
left: 78%;
top: 18%;
width: 96px;
height: 96px;
background: var(--color-fury-glow);
clip-path: polygon(
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 -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: 24px;
top: 20px;
width: 24px;
height: 24px;
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: "";
width: 128px;
height: 128px;
}
.pixel-moon {
left: 78%;
top: 18%;
width: 88px;
height: 88px;
background: var(--color-soft-apricot-50);
clip-path: polygon(
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);
width: 136px;
height: 136px;
}
.pixel-moon::after {
.pixel-stars {
position: absolute;
left: 34px;
top: -10px;
width: 82px;
height: 82px;
background: var(--color-bg);
clip-path: polygon(
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: "";
left: 78%;
top: 18%;
}
.pixel-star {
position: absolute;
display: block;
width: 6px;
height: 6px;
width: 8px;
height: 8px;
background: var(--color-soft-apricot-100);
box-shadow: 8px 0 0 -2px var(--color-fury-glow), 0 8px 0 -2px var(--color-fury-glow);
box-shadow: 12px 0 0 -4px var(--color-fury-glow), 0 12px 0 -4px var(--color-fury-glow);
}
.pixel-star-a {