A React component library for rendering common AT Protocol records for applications such as Bluesky and Leaflet.

version bump, fix styling again

Changed files
+16 -14
lib
+15 -13
lib/renderers/BlueskyProfileRenderer.tsx
···
{record.description}
</p>
)}
-
{websiteHref && websiteLabel && (
-
<div style={{ marginTop: 12 }}>
-
<a
-
href={websiteHref}
-
target="_blank"
-
rel="noopener noreferrer"
-
style={{ ...base.link, color: `var(--atproto-color-link)` }}
-
>
-
{websiteLabel}
-
</a>
-
</div>
-
)}
<div style={base.bottomRow}>
<div style={base.bottomLeft}>
{record.createdAt && (
<div style={{ ...base.meta, color: `var(--atproto-color-text-secondary)` }}>
Joined {new Date(record.createdAt).toLocaleDateString()}
</div>
+
)}
+
{websiteHref && websiteLabel && (
+
<a
+
href={websiteHref}
+
target="_blank"
+
rel="noopener noreferrer"
+
style={{ ...base.link, color: `var(--atproto-color-link)` }}
+
>
+
{websiteLabel}
+
</a>
)}
<a
href={profileUrl}
···
const base: Record<string, React.CSSProperties> = {
card: {
+
display: "flex",
+
flexDirection: "column",
+
height: "100%",
borderRadius: 12,
padding: 16,
fontFamily: "system-ui, sans-serif",
···
display: "flex",
alignItems: "flex-end",
justifyContent: "space-between",
-
marginTop: 12,
+
marginTop: "auto",
+
paddingTop: 12,
},
bottomLeft: {
display: "flex",
+1 -1
package.json
···
{
"name": "atproto-ui",
-
"version": "0.7.0",
+
"version": "0.7.2",
"type": "module",
"description": "React components and hooks for rendering AT Protocol records.",
"main": "./lib-dist/index.js",