leaflet.pub
a tool for shared writing and social publishing
lil things
cozylittle.house
+10
-7
app/lish/[did]/[publication]/[rkey]/PostContent.tsx
+10
-7
app/lish/[did]/[publication]/[rkey]/PostContent.tsx
···
293
293
}
294
294
case PubLeafletBlocksImage.isMain(b.block): {
295
295
return (
296
-
<div className={`relative flex ${alignment}`} {...blockProps}>
296
+
<div
297
+
className={`imageBlock relative flex ${alignment}`}
298
+
{...blockProps}
299
+
>
297
300
<img
298
301
alt={b.block.alt}
299
302
height={b.block.aspectRatio?.height}
···
321
324
return (
322
325
// all this margin stuff is a highly unfortunate hack so that the border-l on blockquote is the height of just the text rather than the height of the block, which includes padding.
323
326
<blockquote
324
-
className={` blockquote py-0! mb-2! ${className} ${PubLeafletBlocksBlockquote.isMain(previousBlock?.block) ? "-mt-2! pt-3!" : "mt-1!"}`}
327
+
className={`blockquoteBlock py-0! mb-2! ${className} ${PubLeafletBlocksBlockquote.isMain(previousBlock?.block) ? "-mt-2! pt-3!" : "mt-1!"}`}
325
328
{...blockProps}
326
329
>
327
330
<TextBlock
···
336
339
}
337
340
case PubLeafletBlocksText.isMain(b.block):
338
341
return (
339
-
<p className={` ${className}`} {...blockProps}>
342
+
<p className={`textBlock ${className}`} {...blockProps}>
340
343
<TextBlock
341
344
facets={b.block.facets}
342
345
plaintext={b.block.plaintext}
···
349
352
case PubLeafletBlocksHeader.isMain(b.block): {
350
353
if (b.block.level === 1)
351
354
return (
352
-
<h2 className={`${className}`} {...blockProps}>
355
+
<h2 className={`h1Block ${className}`} {...blockProps}>
353
356
<TextBlock
354
357
{...b.block}
355
358
index={index}
···
360
363
);
361
364
if (b.block.level === 2)
362
365
return (
363
-
<h3 className={`${className}`} {...blockProps}>
366
+
<h3 className={`h2Block ${className}`} {...blockProps}>
364
367
<TextBlock
365
368
{...b.block}
366
369
index={index}
···
371
374
);
372
375
if (b.block.level === 3)
373
376
return (
374
-
<h4 className={`${className}`} {...blockProps}>
377
+
<h4 className={`h3Block ${className}`} {...blockProps}>
375
378
<TextBlock
376
379
{...b.block}
377
380
index={index}
···
383
386
// if (b.block.level === 4) return <h4>{b.block.plaintext}</h4>;
384
387
// if (b.block.level === 5) return <h5>{b.block.plaintext}</h5>;
385
388
return (
386
-
<h6 className={`${className}`} {...blockProps}>
389
+
<h6 className={`h6Block ${className}`} {...blockProps}>
387
390
<TextBlock
388
391
{...b.block}
389
392
index={index}
+5
-3
components/Mention.tsx
+5
-3
components/Mention.tsx
···
185
185
onOpenAutoFocus={(e) => e.preventDefault()}
186
186
className={`dropdownMenu group/mention-menu z-20 bg-bg-page
187
187
flex data-[side=top]:flex-col-reverse flex-col
188
-
p-1 gap-1
188
+
p-1 gap-1 text-primary
189
189
border border-border rounded-md shadow-md
190
190
sm:max-w-xs w-[1000px] max-w-(--radix-popover-content-available-width)
191
191
max-h-(--radix-popover-content-available-height)
···
193
193
>
194
194
{/* Dropdown Header */}
195
195
<div className="flex flex-col items-center gap-2 px-2 py-1 border-b group-data-[side=top]/mention-menu:border-b-0 group-data-[side=top]/mention-menu:border-t border-border-light">
196
-
<div className="flex items-center gap-1 flex-1 min-w-0">
197
-
<SearchTiny className="w-4 h-4 text-tertiary shrink-0" />
196
+
<div className="flex items-center gap-1 flex-1 min-w-0 text-primary">
197
+
<div className="text-tertiary">
198
+
<SearchTiny className="w-4 h-4 shrink-0" />
199
+
</div>
198
200
<input
199
201
ref={inputRef}
200
202
size={100}