Skip to content

Commit 848cd43

Browse files
committed
some styling on bsky likes and i18n
1 parent f08c10b commit 848cd43

7 files changed

Lines changed: 75 additions & 38 deletions

File tree

app/components/BlogPostListCard.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ defineProps<{
4545
</div>
4646

4747
<span
48-
class="i-carbon:arrow-right w-4 h-4 text-fg-subtle group-hover:text-fg relative inset-is-0 group-hover:inset-is-1 transition-all duration-200 shrink-0"
48+
class="i-lucide:arrow-right w-4 h-4 text-fg-subtle group-hover:text-fg relative inset-is-0 group-hover:inset-is-1 transition-all duration-200 shrink-0"
4949
aria-hidden="true"
5050
/>
5151
</NuxtLink>

app/components/BlueskyComments.vue

Lines changed: 22 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,9 @@ const postUrl = computed(() => data.value?.postUrl)
1616
<section class="mt-12 pt-8 border-t border-border max-w-prose mx-auto">
1717
<!-- Likes -->
1818
<div v-if="likes.length > 0" class="mb-8">
19-
<h3 class="text-lg font-semibold text-fg mb-4">Likes on Bluesky ({{ totalLikes }})</h3>
19+
<h3 class="text-xl font-semibold text-fg mb-4">
20+
{{ $t('blog.atproto.likes_on_bluesky') }} ({{ totalLikes }})
21+
</h3>
2022
<ul class="flex flex-wrap gap-1 list-none p-0 m-0">
2123
<li v-for="like in likes" :key="like.actor.did" class="m-0 p-0">
2224
<a
@@ -50,56 +52,50 @@ const postUrl = computed(() => data.value?.postUrl)
5052
rel="noopener noreferrer"
5153
class="link ms-auto"
5254
>
53-
+{{ totalLikes - likes.length }} more
55+
+{{ totalLikes - likes.length }}
5456
</a>
5557
</li>
5658
</ul>
5759
</div>
5860

5961
<!-- Comments Section -->
6062
<div class="mb-8">
61-
<h3 class="text-lg font-semibold text-fg mb-4">Comments</h3>
63+
<h3 class="text-xl font-semibold text-fg mb-4">{{ $t('blog.atproto.comments') }}</h3>
6264

6365
<!-- Build-time/Initial loading -->
6466
<div v-if="pending && !thread" class="flex items-center gap-2 text-fg-muted" role="status">
6567
<span class="i-svg-spinners:90-ring-with-bg h-5 w-5" aria-hidden="true" />
66-
<span>Loading comments...</span>
68+
<span>{{ $t('blog.atproto.loading_comments') }}</span>
6769
</div>
6870

6971
<!-- Background refresh indicator -->
7072
<div v-else-if="pending && thread" class="text-xs text-fg-subtle mb-4 animate-pulse">
71-
Updating...
73+
{{ $t('blog.atproto.updating') }}
7274
</div>
7375

7476
<!-- Error State -->
7577
<div v-else-if="error" class="text-fg-muted">
76-
Could not load comments.
77-
<a v-if="postUrl" :href="postUrl" target="_blank" rel="noopener noreferrer" class="link">
78-
View on Bluesky
79-
</a>
78+
{{ $t('blog.atproto.could_not_load_comments') }}
79+
<LinkBase v-if="postUrl" variant="button-primary" :to="postUrl">
80+
{{ $t('blog.atproto.view_on_bluesky') }}
81+
</LinkBase>
8082
</div>
8183

8284
<!-- No comments -->
8385
<div v-else-if="!thread || thread.replies.length === 0">
84-
<p class="text-fg-muted mb-4">No comments yet.</p>
85-
<a v-if="postUrl" :href="postUrl" target="_blank" rel="noopener noreferrer" class="link">
86-
Reply on Bluesky
87-
</a>
86+
<p class="text-fg-muted mb-4">{{ $t('blog.atproto.no_comments_yet') }}</p>
87+
<LinkBase v-if="postUrl" variant="button-primary" :to="postUrl">
88+
{{ $t('blog.atproto.reply_on_bluesky') }}
89+
</LinkBase>
8890
</div>
8991

9092
<!-- Comments Thread -->
9193
<div v-else class="flex flex-col gap-6">
92-
<div class="flex items-center gap-4 text-sm text-fg-muted">
94+
<div class="flex items-center justify-between gap-4 text-sm text-fg-muted">
9395
<span>{{ thread.replyCount }} {{ thread.replyCount === 1 ? 'reply' : 'replies' }}</span>
94-
<a
95-
v-if="postUrl"
96-
:href="postUrl"
97-
target="_blank"
98-
rel="noopener noreferrer"
99-
class="link ms-auto"
100-
>
101-
Reply on Bluesky
102-
</a>
96+
<LinkBase v-if="postUrl" variant="button-primary" :to="postUrl">
97+
{{ $t('blog.atproto.reply_on_bluesky') }}
98+
</LinkBase>
10399
</div>
104100

105101
<BlueskyComment
@@ -109,16 +105,9 @@ const postUrl = computed(() => data.value?.postUrl)
109105
:depth="0"
110106
/>
111107

112-
<a
113-
v-if="postUrl"
114-
:href="postUrl"
115-
target="_blank"
116-
rel="noopener noreferrer"
117-
class="link inline-flex items-center gap-2"
118-
>
119-
Like this post or add your comment on Bluesky
120-
<span class="i-carbon:arrow-right" aria-hidden="true" />
121-
</a>
108+
<LinkBase v-if="postUrl" variant="button-primary" :to="postUrl">
109+
{{ $t('blog.atproto.like_or_reply_on_bluesky') }}
110+
</LinkBase>
122111
</div>
123112
</div>
124113
</section>

app/utils/bluesky.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
export function atUriToWebUrl(atUri: string): string | null {
22
// Convert AT URI to bsky.app URL
33
// at://did:plc:xxx/app.bsky.feed.post/rkey -> https://bsky.app/profile/did:plc:xxx/post/rkey
4-
const match = atUri.match(AT_URI_REGEX)
4+
const match = atUri.match(BSKY_POST_AT_URI_REGEX)
55
if (!match) return null
66
const [, did, rkey] = match
77
return `https://bsky.app/profile/${did}/post/${rkey}`

i18n/locales/en.json

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,15 @@
8787
},
8888
"atproto": {
8989
"loading_bluesky_post": "Loading Bluesky post...",
90-
"view_on_bluesky": "View this post on Bluesky"
90+
"view_on_bluesky": "View on Bluesky",
91+
"reply_on_bluesky": "Reply on Bluesky",
92+
"likes_on_bluesky": "Likes on Bluesky",
93+
"like_or_reply_on_bluesky": "Like this post or add your comment on Bluesky",
94+
"no_comments_yet": "No comments yet.",
95+
"could_not_load_comments": "Could not load comments.",
96+
"comments": "Comments",
97+
"loading_comments": "Loading comments...",
98+
"updating": "Updating..."
9199
}
92100
},
93101
"settings": {

i18n/schema.json

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -267,6 +267,30 @@
267267
},
268268
"view_on_bluesky": {
269269
"type": "string"
270+
},
271+
"reply_on_bluesky": {
272+
"type": "string"
273+
},
274+
"likes_on_bluesky": {
275+
"type": "string"
276+
},
277+
"like_or_reply_on_bluesky": {
278+
"type": "string"
279+
},
280+
"no_comments_yet": {
281+
"type": "string"
282+
},
283+
"could_not_load_comments": {
284+
"type": "string"
285+
},
286+
"comments": {
287+
"type": "string"
288+
},
289+
"loading_comments": {
290+
"type": "string"
291+
},
292+
"updating": {
293+
"type": "string"
270294
}
271295
},
272296
"additionalProperties": false

lunaria/files/en-GB.json

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -86,7 +86,15 @@
8686
},
8787
"atproto": {
8888
"loading_bluesky_post": "Loading Bluesky post...",
89-
"view_on_bluesky": "View this post on Bluesky"
89+
"view_on_bluesky": "View on Bluesky",
90+
"reply_on_bluesky": "Reply on Bluesky",
91+
"likes_on_bluesky": "Likes on Bluesky",
92+
"like_or_reply_on_bluesky": "Like this post or add your comment on Bluesky",
93+
"no_comments_yet": "No comments yet.",
94+
"could_not_load_comments": "Could not load comments.",
95+
"comments": "Comments",
96+
"loading_comments": "Loading comments...",
97+
"updating": "Updating..."
9098
}
9199
},
92100
"settings": {

lunaria/files/en-US.json

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -86,7 +86,15 @@
8686
},
8787
"atproto": {
8888
"loading_bluesky_post": "Loading Bluesky post...",
89-
"view_on_bluesky": "View this post on Bluesky"
89+
"view_on_bluesky": "View on Bluesky",
90+
"reply_on_bluesky": "Reply on Bluesky",
91+
"likes_on_bluesky": "Likes on Bluesky",
92+
"like_or_reply_on_bluesky": "Like this post or add your comment on Bluesky",
93+
"no_comments_yet": "No comments yet.",
94+
"could_not_load_comments": "Could not load comments.",
95+
"comments": "Comments",
96+
"loading_comments": "Loading comments...",
97+
"updating": "Updating..."
9098
}
9199
},
92100
"settings": {

0 commit comments

Comments
 (0)