leaflet.pub
a tool for shared writing and social publishing
little tweaks to the embed block
cozylittle.house
+9
-6
+9
-6
components/Blocks/BlueskyPostBlock/BlueskyEmbed.tsx
+9
-6
components/Blocks/BlueskyPostBlock/BlueskyEmbed.tsx
···
84
84
<a
85
85
href={externalEmbed.external.uri}
86
86
target="_blank"
87
-
className={`externalLinkEmbed group border border-border-light rounded-md overflow-hidden hover:no-underline sm:hover:border-accent-contrast selected-border w-full ${props.compact ? "flex" : "flex flex-col"}
87
+
className={`externalLinkEmbed group border border-border-light rounded-md overflow-hidden hover:no-underline sm:hover:border-accent-contrast selected-border w-full ${props.compact ? "flex items-stretch" : "flex flex-col"}
88
88
${props.className}`}
89
89
>
90
90
{externalEmbed.external.thumb === undefined ? null : (
···
102
102
</>
103
103
)}
104
104
<div
105
-
className={`p-2 flex flex-col gap-1 w-full min-w-0 ${props.compact && "sm:pl-3 py-1"}`}
105
+
className={`p-2 flex flex-col w-full min-w-0 ${props.compact && "sm:pl-3 py-1"}`}
106
106
>
107
-
<div className="flex flex-col shrink-0">
108
-
<h4 className="truncate">{externalEmbed.external.title} </h4>
109
-
<p className="text-secondary line-clamp-2 grow">
107
+
<h4 className="truncate shrink-0" style={{ fontSize: "inherit" }}>
108
+
{externalEmbed.external.title}{" "}
109
+
</h4>
110
+
<div className="grow">
111
+
<p className="text-secondary line-clamp-2">
110
112
{externalEmbed.external.description}
111
113
</p>
112
114
</div>
113
-
<hr className="border-border-light mt-1" />
115
+
116
+
<hr className="border-border-light my-1" />
114
117
<div className="text-tertiary text-xs shrink-0 sm:group-hover:text-accent-contrast truncate">
115
118
{externalEmbed.external.uri}
116
119
</div>