this repo has no description
atmosphereconf-vods.wisp.place/
add logo
+90
-25
+90
-25
src/routes/index.tsx
+90
-25
src/routes/index.tsx
···
15
15
import { getSessionsForTrack, getTracks } from "#/lib/conference";
16
16
import { Blockquote } from "#/components/typography";
17
17
import { Badge } from "#/components/badge";
18
+
import { breakpoints } from "../components/theme/media-queries.stylex";
18
19
19
20
export const Route = createFileRoute("/")({ component: App });
20
21
21
22
const styles = stylex.create({
23
+
introContainer: {
24
+
flexDirection: {
25
+
default: "column",
26
+
[breakpoints.sm]: "row",
27
+
},
28
+
alignItems: "center",
29
+
},
22
30
root: {
23
31
paddingBottom: verticalSpace["10xl"],
24
32
},
···
118
126
sectionSpacing: {
119
127
marginTop: verticalSpace["6xl"],
120
128
},
129
+
sectionHeader: {
130
+
display: "flex",
131
+
flexDirection: {
132
+
default: "column",
133
+
"@media (min-width: 48rem)": "row",
134
+
},
135
+
alignItems: {
136
+
default: "flex-start",
137
+
"@media (min-width: 48rem)": "center",
138
+
},
139
+
justifyContent: "space-between",
140
+
gap: gap["xl"],
141
+
},
142
+
sectionTitleGroup: {
143
+
display: "flex",
144
+
flexDirection: "column",
145
+
gap: gap["sm"],
146
+
},
147
+
gooseBadge: {
148
+
display: "flex",
149
+
alignItems: "center",
150
+
gap: gap["md"],
151
+
borderRadius: "999px",
152
+
backgroundColor: uiColor.bgSubtle,
153
+
paddingLeft: horizontalSpace["lg"],
154
+
paddingRight: horizontalSpace["lg"],
155
+
paddingTop: verticalSpace["sm"],
156
+
paddingBottom: verticalSpace["sm"],
157
+
},
158
+
gooseImage: {
159
+
width: {
160
+
default: "8rem",
161
+
[breakpoints.sm]: "16rem",
162
+
},
163
+
height: {
164
+
default: "8rem",
165
+
[breakpoints.sm]: "16rem",
166
+
},
167
+
objectFit: "contain",
168
+
flexShrink: 0,
169
+
marginBottom: {
170
+
default: verticalSpace["4xl"],
171
+
[breakpoints.sm]: 0,
172
+
},
173
+
},
121
174
logoTextAtmosphere: {
122
175
color: primaryColor.solid1,
123
176
},
···
128
181
129
182
return (
130
183
<Page.Root style={styles.root}>
131
-
<Page.Header>
132
-
<Flex direction="column" gap="2xl">
133
-
<Badge>Live + Remote</Badge>
134
-
<Page.Title>
135
-
<span {...stylex.props(styles.logoTextAtmosphere)}>AT</span>
136
-
mosphereConf VODs
137
-
</Page.Title>
138
-
<Page.Description>
139
-
the global AT Protocol community conference
140
-
</Page.Description>
141
-
<Text size="sm" variant="secondary">
142
-
March 26-29, 2026
143
-
</Text>
184
+
<Flex gap="5xl" align="center" style={styles.introContainer}>
185
+
<Flex direction="column">
186
+
<Page.Header>
187
+
<Flex direction="column" gap="2xl">
188
+
<Badge>Live + Remote</Badge>
189
+
<Page.Title>
190
+
<span {...stylex.props(styles.logoTextAtmosphere)}>AT</span>
191
+
mosphereConf VODs
192
+
</Page.Title>
193
+
<Page.Description>
194
+
the global AT Protocol community conference
195
+
</Page.Description>
196
+
<Text size="sm" variant="secondary">
197
+
March 26-29, 2026
198
+
</Text>
199
+
</Flex>
200
+
</Page.Header>
201
+
202
+
<Flex direction="column" gap="5xl" style={styles.intro}>
203
+
<Text size="lg" leading="base">
204
+
Enter each room to browse talks in schedule order. Top of each
205
+
page is the start of the day, and the bottom is where final
206
+
sessions land.
207
+
</Text>
208
+
<Blockquote>
209
+
This app is focused on recorded talks and workshops. Some sessions
210
+
are still being mapped while Streamplace VOD beta metadata
211
+
settles.
212
+
</Blockquote>
213
+
</Flex>
144
214
</Flex>
145
-
</Page.Header>
146
-
147
-
<Flex direction="column" gap="5xl" style={styles.intro}>
148
-
<Text size="lg" leading="base">
149
-
Enter each room to browse talks in schedule order. Top of each page is
150
-
the start of the day, and the bottom is where final sessions land.
151
-
</Text>
152
-
<Blockquote>
153
-
This app is focused on recorded talks and workshops. Some sessions are
154
-
still being mapped while Streamplace VOD beta metadata settles.
155
-
</Blockquote>
215
+
<img
216
+
src="https://atmosphereconf.org/_image?href=%2F_astro%2Fgoodstuff-goose.DKPXDrcQ.png&w=792&h=990&f=webp"
217
+
alt="Goodstuff goose logo"
218
+
width="792"
219
+
height="990"
220
+
{...stylex.props(styles.gooseImage)}
221
+
/>
156
222
</Flex>
157
-
158
223
<Flex direction="column" gap="xl" style={styles.sectionSpacing}>
159
224
<div {...stylex.props(styles.roomGrid)}>
160
225
{tracks.map((track, index) => {