Skip to content

Commit 7449877

Browse files
userquinuserquin
committed
chore: change styles and use bdi for cookies list item
1 parent 1755360 commit 7449877

5 files changed

Lines changed: 71 additions & 19 deletions

File tree

‎app/pages/cookie-policy.vue‎

Lines changed: 54 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -13,18 +13,35 @@ defineOgImageComponent('Default', {
1313
description: () => $t('cookie_policy.welcome', { app: 'npmx' }),
1414
})
1515
16+
const router = useRouter()
1617
const buildInfo = useAppConfig().buildInfo
1718
const { locale } = useI18n()
1819
</script>
1920

2021
<template>
21-
<main class="container flex-1 py-12 sm:py-16 w-full">
22-
<article class="max-w-3xl mx-auto">
22+
<main class="container flex-1 py-12 sm:py-16 w-full overflow-x-hidden">
23+
<article class="max-w-2xl mx-auto">
2324
<header class="mb-12">
24-
<h1 class="font-mono text-3xl sm:text-4xl font-medium mb-4">
25-
{{ $t('cookie_policy.title') }}
26-
</h1>
27-
<i18n-t keypath="cookie_policy.last_updated" tag="p" scope="global" class="text-fg-muted">
25+
<div class="flex items-baseline justify-between gap-4 mb-4">
26+
<h1 class="font-mono text-3xl sm:text-4xl font-medium">
27+
{{ $t('cookie_policy.title') }}
28+
</h1>
29+
<button
30+
type="button"
31+
:title="$t('nav.back')"
32+
class="inline-flex items-center gap-2 font-mono text-sm text-fg-muted hover:text-fg transition-colors duration-200 rounded focus-visible:outline-accent/70 shrink-0"
33+
@click="router.back()"
34+
>
35+
<span class="i-carbon:arrow-left rtl-flip w-4 h-4" aria-hidden="true" />
36+
<span class="hidden sm:inline">{{ $t('nav.back') }}</span>
37+
</button>
38+
</div>
39+
<i18n-t
40+
keypath="cookie_policy.last_updated"
41+
tag="p"
42+
scope="global"
43+
class="text-fg-muted text-lg"
44+
>
2845
<template #date>
2946
<NuxtTime
3047
:locale
@@ -63,20 +80,38 @@ const { locale } = useI18n()
6380
</template>
6481
</i18n-t>
6582
</p>
66-
<ul class="list-disc ps-5 space-y-2">
67-
<li>
68-
<strong class="text-fg font-mono text-sm">{{
69-
$t('cookie_policy.section_2.cookie_vdpl')
70-
}}</strong
71-
>:
72-
{{ $t('cookie_policy.section_2.cookie_vdpl_desc') }}
83+
<ul class="list-none ps-5 space-y-2">
84+
<li class="flex justify-start items-start gap-2">
85+
<span aria-hidden="true" class="text-fg-subtle shrink-0">—</span>
86+
<i18n-t keypath="cookie_policy.section_2.li1" tag="span">
87+
<template #li11>
88+
<strong class="text-fg font-mono text-sm">
89+
<bdi>{{ $t('cookie_policy.section_2.cookie_vdpl') }}</bdi>
90+
</strong>
91+
</template>
92+
<template #separator>
93+
<bdi>{{ $t('cookie_policy.section_2.separator') }}</bdi>
94+
</template>
95+
<template #li12>
96+
<bdi>{{ $t('cookie_policy.section_2.cookie_vdpl_desc') }}</bdi>
97+
</template>
98+
</i18n-t>
7399
</li>
74-
<li>
75-
<strong class="text-fg font-mono text-sm">{{
76-
$t('cookie_policy.section_2.cookie_h3')
77-
}}</strong
78-
>:
79-
{{ $t('cookie_policy.section_2.cookie_h3_desc') }}
100+
<li class="flex justify-start items-start gap-2">
101+
<span aria-hidden="true" class="text-fg-subtle shrink-0">—</span>
102+
<i18n-t keypath="cookie_policy.section_2.li2" tag="span">
103+
<template #li21>
104+
<strong class="text-fg font-mono text-sm">
105+
<bdi>{{ $t('cookie_policy.section_2.cookie_h3') }}</bdi>
106+
</strong>
107+
</template>
108+
<template #separator>
109+
<bdi>{{ $t('cookie_policy.section_2.separator') }}</bdi>
110+
</template>
111+
<template #li22>
112+
<bdi>{{ $t('cookie_policy.section_2.cookie_h3_desc') }}</bdi>
113+
</template>
114+
</i18n-t>
80115
</li>
81116
</ul>
82117
</section>

‎i18n/locales/en.json‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -972,6 +972,9 @@
972972
"title": "WHAT TYPES OF COOKIES DO WE USE?",
973973
"p1": "On our website, we only use {bold} for purposes strictly necessary for the site's functionality. We do not use third-party or advertising cookies.",
974974
"bold": "essential technical cookies",
975+
"li1": "{li11}{separator} {li12}",
976+
"li2": "{li21}{separator} {li22}",
977+
"separator": ":",
975978
"cookie_vdpl": "__vdpl",
976979
"cookie_vdpl_desc": "This cookie is used by our hosting provider (Vercel) for skew protection. It ensures you fetch assets from the correct deployment version if a new update is released while you are browsing. It does not track you.",
977980
"cookie_h3": "h3",

‎lunaria/files/ar-EG.json‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -929,5 +929,13 @@
929929
"vulnerabilities_summary": "{count} ({critical} حرجة/{high} عالية)"
930930
}
931931
}
932+
},
933+
"cookie_policy": {
934+
"section_2": {
935+
"li1": "{li11}{separator} {li12}",
936+
"li2": "{li21}{separator} {li22}",
937+
"cookie_vdpl_desc": "يستخدم مزود خدمة الاستضافة لدينا (Vercel) هذه الكعكة لحماية الموقع من التشويش. فهي تضمن لك جلب الملفات من إصدار النشر الصحيح في حال صدور تحديث جديد أثناء تصفحك. ولا تقوم هذه الكعكة بتتبعك.",
938+
"cookie_h3_desc": "هذه هي كعكة الجلسة الآمنة الخاصة بنا. تقوم بتخزين رمز الوصول OAuth عند اتصالك بحساب Atmosphere الخاص بك. وهي ضرورية للحفاظ على جلستك الموثقة."
939+
}
932940
}
933941
}

‎lunaria/files/en-GB.json‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -972,6 +972,9 @@
972972
"title": "WHAT TYPES OF COOKIES DO WE USE?",
973973
"p1": "On our website, we only use {bold} for purposes strictly necessary for the site's functionality. We do not use third-party or advertising cookies.",
974974
"bold": "essential technical cookies",
975+
"li1": "{li11}{separator} {li12}",
976+
"li2": "{li21}{separator} {li22}",
977+
"separator": ":",
975978
"cookie_vdpl": "__vdpl",
976979
"cookie_vdpl_desc": "This cookie is used by our hosting provider (Vercel) for skew protection. It ensures you fetch assets from the correct deployment version if a new update is released while you are browsing. It does not track you.",
977980
"cookie_h3": "h3",

‎lunaria/files/en-US.json‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -972,6 +972,9 @@
972972
"title": "WHAT TYPES OF COOKIES DO WE USE?",
973973
"p1": "On our website, we only use {bold} for purposes strictly necessary for the site's functionality. We do not use third-party or advertising cookies.",
974974
"bold": "essential technical cookies",
975+
"li1": "{li11}{separator} {li12}",
976+
"li2": "{li21}{separator} {li22}",
977+
"separator": ":",
975978
"cookie_vdpl": "__vdpl",
976979
"cookie_vdpl_desc": "This cookie is used by our hosting provider (Vercel) for skew protection. It ensures you fetch assets from the correct deployment version if a new update is released while you are browsing. It does not track you.",
977980
"cookie_h3": "h3",

0 commit comments

Comments
 (0)