vielle.dev
forked from
pds.ls/pdsls
atproto explorer
fix stream view input size
handle.invalid
+9
-9
src/views/stream.tsx
+9
-9
src/views/stream.tsx
···
171
171
ref={formRef}
172
172
class="dark:bg-dark-500/70 sticky top-0 z-5 flex w-screen flex-col items-center bg-neutral-100/70 px-4 text-sm backdrop-blur-xs"
173
173
>
174
-
<div class="flex flex-col gap-2 py-3">
174
+
<div class="flex w-[22rem] flex-col gap-2 py-3 sm:w-[24rem]">
175
175
<Show when={!connected()}>
176
176
<label class="flex items-center justify-end gap-x-2">
177
-
<span>Instance</span>
177
+
<span class="min-w-[5rem]">Instance</span>
178
178
<TextInput
179
179
name="instance"
180
180
value={
···
183
183
"wss://jetstream1.us-east.bsky.network/subscribe"
184
184
: "wss://bsky.network")
185
185
}
186
-
class="w-[16rem]"
186
+
class="grow"
187
187
/>
188
188
</label>
189
189
<Show when={streamType === StreamType.JETSTREAM}>
190
190
<label class="flex items-center justify-end gap-x-2">
191
-
<span>Collections</span>
191
+
<span class="min-w-[5rem]">Collections</span>
192
192
<textarea
193
193
name="collections"
194
194
spellcheck={false}
195
195
placeholder="Comma-separated list of collections"
196
196
value={searchParams.collections ?? ""}
197
-
class="dark:bg-dark-100 dark:shadow-dark-800 w-[16rem] rounded-lg bg-white px-2 py-1 shadow-sm focus:outline-[1.5px] focus:outline-neutral-900 dark:focus:outline-neutral-200"
197
+
class="dark:bg-dark-100 dark:shadow-dark-800 grow rounded-lg bg-white px-2 py-1 shadow-sm focus:outline-[1.5px] focus:outline-neutral-900 dark:focus:outline-neutral-200"
198
198
/>
199
199
</label>
200
200
</Show>
201
201
<Show when={streamType === StreamType.JETSTREAM}>
202
202
<label class="flex items-center justify-end gap-x-2">
203
-
<span>DIDs</span>
203
+
<span class="min-w-[5rem]">DIDs</span>
204
204
<textarea
205
205
name="dids"
206
206
spellcheck={false}
207
207
placeholder="Comma-separated list of DIDs"
208
208
value={searchParams.dids ?? ""}
209
-
class="dark:bg-dark-100 dark:shadow-dark-800 w-[16rem] rounded-lg bg-white px-2 py-1 shadow-sm focus:outline-[1.5px] focus:outline-neutral-900 dark:focus:outline-neutral-200"
209
+
class="dark:bg-dark-100 dark:shadow-dark-800 grow rounded-lg bg-white px-2 py-1 shadow-sm focus:outline-[1.5px] focus:outline-neutral-900 dark:focus:outline-neutral-200"
210
210
/>
211
211
</label>
212
212
</Show>
213
213
<label class="flex items-center justify-end gap-x-2">
214
-
<span>Cursor</span>
214
+
<span class="min-w-[5rem]">Cursor</span>
215
215
<TextInput
216
216
name="cursor"
217
217
placeholder="Leave empty for live-tail"
218
218
value={searchParams.cursor ?? ""}
219
-
class="w-[16rem]"
219
+
class="grow"
220
220
/>
221
221
</label>
222
222
<Show when={streamType === StreamType.JETSTREAM}>