feat: cleanup locale conf and add some RTL stuff (#564)
Joaquín Sánchez
GitHub
parent
29b7cb3838
commit
6412127283
|
|
@ -10,7 +10,17 @@ const { notification } = defineProps<{
|
|||
<article flex flex-col relative>
|
||||
<template v-if="notification.type === 'follow'">
|
||||
<NuxtLink :to="getAccountRoute(notification.account)">
|
||||
<div flex items-center absolute pl-3 pr-4 py-3 bg-base rounded-br-3 top-0 left-0>
|
||||
<div
|
||||
flex items-center absolute
|
||||
pl-3 pr-4 lrt-left-0
|
||||
rounded-br-3
|
||||
rtl="pr-3 pl-4 right-0"
|
||||
rtl-rounded-bl-3
|
||||
rtl-rounded-br-0
|
||||
py-3 bg-base top-0
|
||||
:lang="notification.status?.language ?? undefined"
|
||||
:dir="notification.status?.language ? 'auto' : 'ltr'"
|
||||
>
|
||||
<div i-ri:user-follow-fill mr-1 color-primary />
|
||||
<ContentRich
|
||||
text-primary mr-1 font-bold line-clamp-1 ws-pre-wrap break-all
|
||||
|
|
@ -21,7 +31,11 @@ const { notification } = defineProps<{
|
|||
{{ $t('notification.followed_you') }}
|
||||
</span>
|
||||
</div>
|
||||
<AccountBigCard :account="notification.account" />
|
||||
<AccountBigCard
|
||||
:account="notification.account"
|
||||
:lang="notification.status?.language ?? undefined"
|
||||
:dir="notification.status?.language ? 'auto' : 'ltr'"
|
||||
/>
|
||||
</NuxtLink>
|
||||
</template>
|
||||
<template v-else-if="notification.type === 'admin.sign_up'">
|
||||
|
|
|
|||
|
|
@ -10,10 +10,16 @@ const { formatHumanReadableNumber, forSR } = useHumanReadableNumber()
|
|||
const count = $computed(() => items.items.length)
|
||||
const addSR = $computed(() => forSR(count))
|
||||
const isExpanded = ref(false)
|
||||
const lang = $computed(() => {
|
||||
return count > 1 || count === 0 ? undefined : items.items[0].status?.language
|
||||
})
|
||||
const dir = $computed(() => {
|
||||
return lang ? 'auto' : 'ltr'
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<article flex flex-col relative>
|
||||
<article flex flex-col relative :lang="lang ?? undefined" :dir="dir">
|
||||
<div flex items-center top-0 left-2 pt-2 px-3>
|
||||
<div i-ri:user-follow-fill mr-3 color-primary aria-hidden="true" />
|
||||
<template v-if="count > 1">
|
||||
|
|
|
|||
|
|
@ -237,7 +237,10 @@ defineExpose({
|
|||
role="alert"
|
||||
aria-describedby="upload-failed"
|
||||
flex="~ col"
|
||||
gap-1 text-sm pt-1 pl-2 pr-1 pb-2 text-red-600 dark:text-red-400
|
||||
gap-1 text-sm
|
||||
pt-1 pl-2 pr-1 pb-2
|
||||
rtl="pl-1 pr-2"
|
||||
text-red-600 dark:text-red-400
|
||||
border="~ base rounded red-600 dark:red-400"
|
||||
>
|
||||
<head id="upload-failed" flex justify-between>
|
||||
|
|
|
|||
|
|
@ -65,7 +65,21 @@ const isSelf = $computed(() => status.account.id === currentUser.value?.account.
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div v-if="filter?.filterAction !== 'hide'" :id="`status-${status.id}`" ref="el" relative flex flex-col gap-1 px-4 pt-1 class="pb-1.5" transition-100 :class="{ 'hover:bg-active': hover }" tabindex="0" focus:outline-none focus-visible:ring="2 primary" @click="onclick" @keydown.enter="onclick">
|
||||
<div
|
||||
v-if="filter?.filterAction !== 'hide'"
|
||||
:id="`status-${status.id}`"
|
||||
ref="el"
|
||||
relative flex flex-col gap-1 px-4 pt-1
|
||||
class="pb-1.5"
|
||||
transition-100
|
||||
:class="{ 'hover:bg-active': hover }"
|
||||
tabindex="0"
|
||||
focus:outline-none focus-visible:ring="2 primary"
|
||||
:lang="status.language ?? undefined"
|
||||
:dir="status.language ? 'auto' : 'ltr'"
|
||||
@click="onclick"
|
||||
@keydown.enter="onclick"
|
||||
>
|
||||
<div flex justify-between>
|
||||
<slot name="meta">
|
||||
<div v-if="rebloggedBy" text-secondary text-sm ws-nowrap flex="~" gap-1 items-center py1>
|
||||
|
|
@ -79,7 +93,7 @@ const isSelf = $computed(() => status.account.id === currentUser.value?.account.
|
|||
<div flex gap-3 :class="{ 'text-secondary': faded }">
|
||||
<div relative>
|
||||
<template v-if="showRebloggedByAvatarOnAvatar">
|
||||
<div absolute top--3px left--0.8 z--1 w-25px h-25px rounded-full>
|
||||
<div absolute top--3px lrt-left--0.8 rtl-right--0.8 z--1 w-25px h-25px rounded-full>
|
||||
<AccountAvatar :account="rebloggedBy" />
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ const isDM = $computed(() => status.visibility === 'direct')
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div :id="`status-${status.id}`" flex flex-col gap-2 pt2 pb1 px-4 relative>
|
||||
<div :id="`status-${status.id}`" flex flex-col gap-2 pt2 pb1 px-4 relative :lang="status.language ?? undefined" dir="auto">
|
||||
<StatusActionsMore :status="status" absolute right-2 top-2 />
|
||||
<NuxtLink :to="getAccountRoute(status.account)" rounded-full hover:bg-active transition-100 pr5 mr-a>
|
||||
<AccountHoverWrapper :account="status.account">
|
||||
|
|
|
|||
|
|
@ -33,14 +33,14 @@ export function setupPageHeader() {
|
|||
}
|
||||
|
||||
const localeMap = (i18n.locales.value as LocaleObject[]).reduce((acc, l) => {
|
||||
acc[l.code!] = l.dir ?? 'ltr'
|
||||
acc[l.code!] = l.dir ?? 'auto'
|
||||
return acc
|
||||
}, {} as Record<string, Directions>)
|
||||
|
||||
useHeadFixed({
|
||||
htmlAttrs: {
|
||||
lang: () => i18n.locale.value,
|
||||
dir: () => localeMap[i18n.locale.value] ?? 'ltr',
|
||||
dir: () => localeMap[i18n.locale.value] ?? 'auto',
|
||||
},
|
||||
titleTemplate: title => `${title ? `${title} | ` : ''}${APP_NAME}${isDev ? ' (dev)' : isPreview ? ' (preview)' : ''}`,
|
||||
link,
|
||||
|
|
|
|||
|
|
@ -8,43 +8,36 @@ const locales: LocaleObject[] = [
|
|||
code: 'en-US',
|
||||
file: 'en-US.json',
|
||||
name: 'English',
|
||||
dir: 'ltr',
|
||||
},
|
||||
{
|
||||
code: 'de-DE',
|
||||
file: 'de-DE.json',
|
||||
name: 'Deutsch',
|
||||
dir: 'ltr',
|
||||
},
|
||||
{
|
||||
code: 'zh-CN',
|
||||
file: 'zh-CN.json',
|
||||
name: '简体中文',
|
||||
dir: 'ltr',
|
||||
},
|
||||
{
|
||||
code: 'ja-JP',
|
||||
file: 'ja-JP.json',
|
||||
name: '日本語',
|
||||
dir: 'ltr',
|
||||
},
|
||||
{
|
||||
code: 'es-ES',
|
||||
file: 'es-ES.json',
|
||||
name: 'Español',
|
||||
dir: 'ltr',
|
||||
},
|
||||
{
|
||||
code: 'fr-FR',
|
||||
file: 'fr-FR.json',
|
||||
name: 'Français',
|
||||
dir: 'ltr',
|
||||
},
|
||||
{
|
||||
code: 'cs-CZ',
|
||||
file: 'cs-CZ.json',
|
||||
name: 'Česky',
|
||||
dir: 'ltr',
|
||||
},
|
||||
{
|
||||
code: 'ar',
|
||||
|
|
|
|||
|
|
@ -83,7 +83,7 @@ onReactivated(() => {
|
|||
@published="refreshContext()"
|
||||
/>
|
||||
|
||||
<template v-for="comment, di of context?.descendants" :key="comment.id">
|
||||
<template v-for="(comment, di) of context?.descendants" :key="comment.id">
|
||||
<StatusCard
|
||||
:status="comment" :actions="comment.visibility !== 'direct'" context="account"
|
||||
:connect-reply="comment.id === context?.descendants[di + 1]?.inReplyToId"
|
||||
|
|
|
|||
Loading…
Reference in New Issue