tangled
alpha
login
or
join now
nekomimi.pet
/
atproto-ui
41
fork
atom
A React component library for rendering common AT Protocol records for applications such as Bluesky and Leaflet.
41
fork
atom
overview
issues
2
pulls
pipelines
version bump, fix styling again
waveringana
4 months ago
26a9949f
5e209f78
+16
-14
2 changed files
expand all
collapse all
unified
split
lib
renderers
BlueskyProfileRenderer.tsx
package.json
+15
-13
lib/renderers/BlueskyProfileRenderer.tsx
···
71
71
{record.description}
72
72
</p>
73
73
)}
74
74
-
{websiteHref && websiteLabel && (
75
75
-
<div style={{ marginTop: 12 }}>
76
76
-
<a
77
77
-
href={websiteHref}
78
78
-
target="_blank"
79
79
-
rel="noopener noreferrer"
80
80
-
style={{ ...base.link, color: `var(--atproto-color-link)` }}
81
81
-
>
82
82
-
{websiteLabel}
83
83
-
</a>
84
84
-
</div>
85
85
-
)}
86
74
<div style={base.bottomRow}>
87
75
<div style={base.bottomLeft}>
88
76
{record.createdAt && (
89
77
<div style={{ ...base.meta, color: `var(--atproto-color-text-secondary)` }}>
90
78
Joined {new Date(record.createdAt).toLocaleDateString()}
91
79
</div>
80
80
+
)}
81
81
+
{websiteHref && websiteLabel && (
82
82
+
<a
83
83
+
href={websiteHref}
84
84
+
target="_blank"
85
85
+
rel="noopener noreferrer"
86
86
+
style={{ ...base.link, color: `var(--atproto-color-link)` }}
87
87
+
>
88
88
+
{websiteLabel}
89
89
+
</a>
92
90
)}
93
91
<a
94
92
href={profileUrl}
···
109
107
110
108
const base: Record<string, React.CSSProperties> = {
111
109
card: {
110
110
+
display: "flex",
111
111
+
flexDirection: "column",
112
112
+
height: "100%",
112
113
borderRadius: 12,
113
114
padding: 16,
114
115
fontFamily: "system-ui, sans-serif",
···
171
172
display: "flex",
172
173
alignItems: "flex-end",
173
174
justifyContent: "space-between",
174
174
-
marginTop: 12,
175
175
+
marginTop: "auto",
176
176
+
paddingTop: 12,
175
177
},
176
178
bottomLeft: {
177
179
display: "flex",
+1
-1
package.json
···
1
1
{
2
2
"name": "atproto-ui",
3
3
-
"version": "0.7.0",
3
3
+
"version": "0.7.2",
4
4
"type": "module",
5
5
"description": "React components and hooks for rendering AT Protocol records.",
6
6
"main": "./lib-dist/index.js",