atproto pds in zig
pds.zat.dev
pds
atproto
Revert "landing: add liminal glass treatment"
This reverts commit 4ede6cf80ebc7dcf003b8fb31be2cc60e1bba015.
+12
-54
+12
-54
src/http/landing/assets.zig
+12
-54
src/http/landing/assets.zig
···
34
34
\\ color-scheme: light;
35
35
\\}
36
36
\\* { box-sizing: border-box; }
37
-
\\html { min-height: 100%; background: var(--bg); overflow-x: hidden; }
37
+
\\html { min-height: 100%; background: var(--bg); }
38
38
\\body {
39
-
\\ position: relative; margin: 0; min-height: 100vh; overflow-x: hidden; background:
40
-
\\ radial-gradient(ellipse at 8% 16%, color-mix(in srgb, var(--signal-c, var(--pink)) 18%, transparent), transparent 34%),
41
-
\\ radial-gradient(ellipse at 88% 6%, color-mix(in srgb, var(--signal-b, var(--accent)) 16%, transparent), transparent 31%),
42
-
\\ linear-gradient(105deg, color-mix(in srgb, var(--signal-a, var(--green)) 10%, transparent), transparent 28%, color-mix(in srgb, var(--signal-c, var(--pink)) 8%, transparent) 72%, transparent),
39
+
\\ margin: 0; min-height: 100vh; background:
40
+
\\ radial-gradient(circle at 20% 0%, color-mix(in srgb, var(--signal-a, var(--green)) 15%, transparent), transparent 35%),
41
+
\\ radial-gradient(circle at 94% 18%, color-mix(in srgb, var(--signal-b, var(--accent)) 13%, transparent), transparent 32%),
43
42
\\ var(--bg); color: var(--text);
44
43
\\ font: 15px/1.55 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
45
44
\\}
46
-
\\body::before, body::after {
47
-
\\ content: ""; position: fixed; inset: auto; pointer-events: none; z-index: 0;
48
-
\\}
49
-
\\body::before {
50
-
\\ width: min(88vw, 760px); height: min(58vh, 520px); left: max(-180px, -12vw); top: -82px;
51
-
\\ border-radius: 46% 54% 54% 46% / 31% 35% 65% 69%;
52
-
\\ background:
53
-
\\ linear-gradient(108deg, rgba(255,255,255,.14), rgba(255,255,255,.02) 19%, transparent 31%),
54
-
\\ radial-gradient(ellipse at 34% 42%, color-mix(in srgb, var(--signal-b, var(--accent)) 22%, transparent), transparent 58%),
55
-
\\ color-mix(in srgb, var(--panel) 40%, transparent);
56
-
\\ filter: blur(.2px) saturate(1.18); opacity: .72;
57
-
\\ transform: rotate(-8deg) skewX(-13deg);
58
-
\\ box-shadow: inset -48px 0 80px rgba(255,255,255,.035), inset 42px 8px 110px color-mix(in srgb, var(--signal-c, var(--pink)) 11%, transparent);
59
-
\\}
60
-
\\body::after {
61
-
\\ width: 48vw; height: 150vh; right: -29vw; top: -24vh; transform: rotate(15deg);
62
-
\\ background:
63
-
\\ linear-gradient(90deg, transparent, rgba(255,255,255,.05), transparent 18%),
64
-
\\ linear-gradient(90deg, transparent 44%, color-mix(in srgb, var(--signal-a, var(--green)) 14%, transparent), transparent 62%);
65
-
\\ filter: blur(18px); opacity: .82;
66
-
\\}
67
45
\\a { color: inherit; }
68
46
\\a:focus-visible, button:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
69
-
\\.shell { position: relative; z-index: 1; width: min(100%, 780px); margin: 0 auto; padding: 18px 16px 34px; }
70
-
\\.shell::before {
71
-
\\ content: ""; position: absolute; z-index: -1; left: -16px; right: -16px; top: 78px; height: 340px; pointer-events: none;
72
-
\\ border-radius: 36px 58px 42px 68px;
73
-
\\ background:
74
-
\\ linear-gradient(115deg, transparent 0 18%, rgba(255,255,255,.055) 19%, transparent 25% 42%, rgba(255,255,255,.035) 43%, transparent 48%),
75
-
\\ radial-gradient(ellipse at 8% 60%, color-mix(in srgb, var(--signal-c, var(--pink)) 13%, transparent), transparent 54%);
76
-
\\ filter: blur(.35px); opacity: .75; transform: perspective(780px) rotateX(3deg) skewY(-1.5deg);
77
-
\\}
47
+
\\.shell { width: min(100%, 780px); margin: 0 auto; padding: 18px 16px 34px; }
78
48
\\header {
79
49
\\ position: relative; z-index: 10; display: flex; justify-content: space-between; align-items: center; gap: 12px;
80
50
\\ min-height: 50px; margin: 0 0 26px; padding: 8px 0;
···
84
54
\\.brand { flex: 0 0 auto; display: inline-flex; align-items: center; color: var(--text); text-decoration: none; font-weight: 700; font-size: 14px; letter-spacing: 0; }
85
55
\\.brand:hover { opacity: 0.82; }
86
56
\\nav { min-width: 0; display: flex; align-items: center; justify-content: flex-end; gap: 7px; padding: 4px; border: 1px solid color-mix(in srgb, var(--line) 66%, transparent); border-radius: 18px; background:
87
-
\\ linear-gradient(102deg, rgba(255,255,255,.11), transparent 18% 62%, rgba(255,255,255,.055)),
88
57
\\ radial-gradient(circle at 20% 0%, color-mix(in srgb, var(--signal-a, var(--green)) 12%, transparent), transparent 46%),
89
58
\\ color-mix(in srgb, var(--glass) 38%, transparent);
90
-
\\ box-shadow: inset 0 1px 0 rgba(255,255,255,.16), inset 16px 0 34px rgba(255,255,255,.035), 0 8px 28px rgba(0,0,0,.12);
91
-
\\ backdrop-filter: blur(22px) saturate(1.25); -webkit-backdrop-filter: blur(22px) saturate(1.25); }
59
+
\\ box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 8px 28px rgba(0,0,0,.12); }
92
60
\\nav a, .settings { color: var(--muted); text-decoration: none; background: none; border: 0; padding: 0; font: inherit; cursor: pointer; }
93
61
\\nav a:hover, .settings:hover { color: var(--text); }
94
62
\\.icon-link, .settings {
···
110
78
\\.icon-link:hover, .settings:hover { border-color: color-mix(in srgb, var(--signal-a, var(--green)) 55%, var(--line)); background: color-mix(in srgb, var(--panel-2) 86%, transparent); transform: translateY(-1px); }
111
79
\\.settings { flex: 0 0 auto; margin-left: 2px; }
112
80
\\.hero { margin: 52px 0 24px; }
113
-
\\h1 { margin: 0; color: var(--text); font-size: clamp(36px, 11vw, 74px); line-height: 0.95; letter-spacing: 0; text-shadow: 0 1px 0 rgba(255,255,255,.05), 0 28px 72px color-mix(in srgb, var(--signal-b, var(--accent)) 17%, transparent); }
81
+
\\h1 { margin: 0; color: var(--text); font-size: clamp(36px, 11vw, 74px); line-height: 0.95; letter-spacing: 0; }
114
82
\\.lede { margin: 14px 0 0; max-width: 47ch; color: var(--muted); font-size: 15px; }
115
83
\\.lede a, .lede code { color: var(--green); }
116
84
\\.entropy { width: min(100%, 330px); min-height: 76px; margin-top: 19px; display: grid; gap: 6px; }
···
145
113
\\@media (prefers-reduced-motion: reduce) { .entropy-label, .entropy-bars i { transition: none; } }
146
114
\\.pulse {
147
115
\\ margin: 0 0 30px; padding: 14px;
148
-
\\ position: relative; border: 1px solid color-mix(in srgb, var(--line) 78%, white 7%); border-radius: 12px; background:
149
-
\\ linear-gradient(103deg, rgba(255,255,255,.095), transparent 12% 58%, rgba(255,255,255,.045)),
150
-
\\ linear-gradient(135deg, color-mix(in srgb, var(--signal-a, var(--green)) 16%, transparent), transparent 48%),
151
-
\\ linear-gradient(315deg, color-mix(in srgb, var(--signal-c, var(--pink)) 13%, transparent), transparent 44%),
152
-
\\ color-mix(in srgb, var(--panel) 82%, transparent);
153
-
\\ overflow: hidden; max-width: 100%; backdrop-filter: blur(18px) saturate(1.16); -webkit-backdrop-filter: blur(18px) saturate(1.16);
154
-
\\ box-shadow: inset 0 1px 0 rgba(255,255,255,.13), inset -22px 0 60px rgba(255,255,255,.035), 0 20px 48px rgba(0,0,0,.13);
155
-
\\}
156
-
\\.pulse::after {
157
-
\\ content: ""; position: absolute; inset: -36px -28px auto auto; width: 48%; height: 84px; pointer-events: none;
158
-
\\ background: linear-gradient(101deg, transparent, rgba(255,255,255,.13), transparent 34%);
159
-
\\ transform: rotate(-9deg); filter: blur(8px); opacity: .5;
116
+
\\ border: 1px solid var(--line); border-radius: 8px; background:
117
+
\\ linear-gradient(135deg, color-mix(in srgb, var(--signal-a, var(--green)) 12%, transparent), transparent 46%),
118
+
\\ linear-gradient(315deg, color-mix(in srgb, var(--signal-c, var(--pink)) 10%, transparent), transparent 44%),
119
+
\\ var(--panel);
120
+
\\ overflow: hidden; max-width: 100%;
160
121
\\}
161
122
\\.pulse > div { min-width: 0; }
162
123
\\.pulse-kicker { color: var(--dim); font-size: 11px; text-transform: lowercase; }
···
259
220
\\ .entropy { width: min(100%, 250px); min-height: 68px; }
260
221
\\ .entropy-bars { gap: 3px; min-height: 36px; }
261
222
\\ .entropy-bars i:hover::after { display: none; }
262
-
\\ body::before { width: 105vw; height: 430px; left: -42vw; top: -92px; opacity: .56; }
263
-
\\ body::after { right: -52vw; opacity: .55; }
264
-
\\ .shell::before { left: -22px; right: -22px; top: 96px; height: 270px; opacity: .52; }
265
223
\\}
266
224
;
267
225