feat(i18n,ui): add privacy policy page #900
There are no files selected for viewing
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,231 @@ | ||
| <script setup lang="ts"> | ||
| definePageMeta({ | ||
| name: 'cookie-policy', | ||
| }) | ||
|
|
||
| useSeoMeta({ | ||
| title: () => `${$t('cookie_policy.title')} - npmx`, | ||
| description: () => $t('cookie_policy.welcome', { app: 'npmx' }), | ||
| }) | ||
|
|
||
| defineOgImageComponent('Default', { | ||
| title: () => $t('cookie_policy.title'), | ||
| description: () => $t('cookie_policy.welcome', { app: 'npmx' }), | ||
| }) | ||
|
Contributor
There was a problem hiding this comment. 🧩 Analysis chain🌐 Web query:
💡 Result:
<script setup lang="ts">
const { t } = useI18n()
useSeoMeta({
title: () => t('seo.home.title'),
description: () => t('seo.home.description'),
ogTitle: () => t('seo.home.title'),
})
</script>This will also update when the locale changes because Sources: Nuxt [1] (nuxt.com) Citations:
🏁 Script executed: # Search for other useSeoMeta usage in the codebase to see if $t() is used elsewhere
rg 'useSeoMeta' -A 5 --type vue --type tsRepository: npmx-dev/npmx.dev Length of output: 88 🏁 Script executed: # Check if there are imports of useI18n in similar components
rg 'useI18n\(\)' -B 5 -A 10 --type vue --type ts | head -100Repository: npmx-dev/npmx.dev Length of output: 88 🏁 Script executed: # Check the actual content of the cookie-policy.vue file to see the full context
cat -n app/pages/cookie-policy.vue | head -20Repository: npmx-dev/npmx.dev Length of output: 652 Use The 🔧 Fix-const buildInfo = useAppConfig().buildInfo
-const { locale } = useI18n()
+const buildInfo = useAppConfig().buildInfo
+const { locale, t } = useI18n()
useSeoMeta({
- title: () => `${$t('cookie_policy.title')} - npmx`,
- description: () => $t('cookie_policy.welcome', { app: 'npmx' }),
+ title: () => `${t('cookie_policy.title')} - npmx`,
+ description: () => t('cookie_policy.welcome', { app: 'npmx' }),
})
defineOgImageComponent('Default', {
- title: () => $t('cookie_policy.title'),
- description: () => $t('cookie_policy.welcome', { app: 'npmx' }),
+ title: () => t('cookie_policy.title'),
+ description: () => t('cookie_policy.welcome', { app: 'npmx' }),
})
Member
Author
There was a problem hiding this comment. not sure about this fix, there are more usages of useSeoMeta({
title: () => `${$t('about.title')} - npmx`,
ogTitle: () => `${$t('about.title')} - npmx`,
twitterTitle: () => `${$t('about.title')} - npmx`,
description: () => $t('about.meta_description'),
ogDescription: () => $t('about.meta_description'),
twitterDescription: () => $t('about.meta_description'),
})
defineOgImageComponent('Default', {
primaryColor: '#60a5fa',
title: 'About npmx',
description: 'A better browser for the **npm registry**',
})
Contributor
There was a problem hiding this comment. 🧩 Analysis chain🏁 Script executed: Length of output: 9200 🏁 Script executed: Length of output: 27 🏁 Script executed: Length of output: 7385 🏁 Script executed: Length of output: 11318 🏁 Script executed: Length of output: 1795 🌐 Web query: 💡 Result: In @nuxtjs/i18n v8, Make
|
||
|
|
||
| const buildInfo = useAppConfig().buildInfo | ||
| const { locale } = useI18n() | ||
| </script> | ||
|
|
||
| <template> | ||
| <main class="container flex-1 py-12 sm:py-16 w-full"> | ||
| <article class="max-w-3xl mx-auto"> | ||
| <header class="mb-12"> | ||
| <h1 class="font-mono text-3xl sm:text-4xl font-medium mb-4 lowercase"> | ||
| {{ $t('cookie_policy.title') }} | ||
| </h1> | ||
| <i18n-t keypath="cookie_policy.last_updated" tag="p" scope="global" class="text-fg-muted"> | ||
| <template #date> | ||
| <NuxtTime | ||
| :locale | ||
| :datetime="buildInfo.cookiePolicyDate" | ||
| date-style="long" | ||
| time-style="medium" | ||
| /> | ||
| </template> | ||
| </i18n-t> | ||
| </header> | ||
|
|
||
| <div class="prose prose-invert max-w-none text-fg-muted"> | ||
| <p> | ||
| <i18n-t keypath="cookie_policy.welcome" tag="span" scope="global"> | ||
| <template #app> | ||
| <strong class="text-fg">npmx</strong> | ||
| </template> | ||
| </i18n-t> | ||
| </p> | ||
|
|
||
| <section class="mt-8"> | ||
| <h2 class="text-lg text-fg-subtle uppercase tracking-wider mb-4"> | ||
| {{ $t('cookie_policy.section_1.title') }} | ||
| </h2> | ||
| <p>{{ $t('cookie_policy.section_1.p1') }}</p> | ||
| </section> | ||
|
|
||
| <section class="mt-8"> | ||
| <h2 class="text-lg text-fg-subtle uppercase tracking-wider mb-4"> | ||
| {{ $t('cookie_policy.section_2.title') }} | ||
| </h2> | ||
| <p class="mb-4"> | ||
| <i18n-t keypath="cookie_policy.section_2.p1" tag="span" scope="global"> | ||
| <template #bold> | ||
| <strong class="text-fg">{{ $t('cookie_policy.section_2.bold') }}</strong> | ||
| </template> | ||
| </i18n-t> | ||
| </p> | ||
| <ul class="list-disc ps-5 space-y-2"> | ||
| <li> | ||
| <strong class="text-fg font-mono text-sm">{{ | ||
| $t('cookie_policy.section_2.cookie_vdpl') | ||
| }}</strong | ||
| >: | ||
| {{ $t('cookie_policy.section_2.cookie_vdpl_desc') }} | ||
| </li> | ||
| <li> | ||
| <strong class="text-fg font-mono text-sm">{{ | ||
| $t('cookie_policy.section_2.cookie_h3') | ||
| }}</strong | ||
| >: | ||
| {{ $t('cookie_policy.section_2.cookie_h3_desc') }} | ||
| </li> | ||
| </ul> | ||
| </section> | ||
|
|
||
| <section class="mt-8"> | ||
| <h2 class="text-lg text-fg-subtle uppercase tracking-wider mb-4"> | ||
| {{ $t('cookie_policy.section_3.title') }} | ||
| </h2> | ||
| <p class="mb-4"> | ||
| <i18n-t keypath="cookie_policy.section_3.p1" tag="span" scope="global"> | ||
| <template #bold> | ||
| <strong class="text-fg">{{ $t('cookie_policy.section_3.bold') }}</strong> | ||
| </template> | ||
| <template #settings> | ||
| <NuxtLink | ||
| to="/settings" | ||
| class="text-fg-muted hover:text-fg underline decoration-fg-subtle/50 hover:decoration-fg" | ||
| > | ||
| {{ $t('cookie_policy.section_3.settings') }} | ||
| </NuxtLink> | ||
| </template> | ||
| </i18n-t> | ||
| </p> | ||
| <p> | ||
| <i18n-t keypath="cookie_policy.section_3.p2" tag="span" scope="global"> | ||
| <template #bold> | ||
| <strong class="text-fg">{{ $t('cookie_policy.section_3.bold2') }}</strong> | ||
| </template> | ||
| </i18n-t> | ||
| </p> | ||
|
coderabbitai[bot] marked this conversation as resolved.
Outdated
|
||
| </section> | ||
|
|
||
| <section class="mt-8"> | ||
| <h2 class="text-lg text-fg-subtle uppercase tracking-wider mb-4"> | ||
| {{ $t('cookie_policy.section_4.title') }} | ||
| </h2> | ||
| <p> | ||
| <i18n-t keypath="cookie_policy.section_4.p1" tag="span" scope="global"> | ||
| <template #bold> | ||
| <strong class="text-fg">{{ $t('cookie_policy.section_4.bold') }}</strong> | ||
| </template> | ||
| <template #bold2> | ||
| <strong class="text-fg">{{ $t('cookie_policy.section_4.bold2') }}</strong> | ||
| </template> | ||
| </i18n-t> | ||
| </p> | ||
| </section> | ||
|
|
||
| <section class="mt-8"> | ||
| <h2 class="text-lg text-fg-subtle uppercase tracking-wider mb-4"> | ||
| {{ $t('cookie_policy.section_5.title') }} | ||
| </h2> | ||
| <p class="mb-4"> | ||
| <i18n-t keypath="cookie_policy.section_5.p1" tag="span" scope="global"> | ||
| <template #bold> | ||
| <strong class="text-fg">{{ $t('cookie_policy.section_5.bold') }}</strong> | ||
| </template> | ||
| </i18n-t> | ||
| </p> | ||
| <p class="mb-2">{{ $t('cookie_policy.section_5.p2') }}</p> | ||
| <ul class="list-none px-0 space-y-2"> | ||
| <li> | ||
| <a | ||
| href="https://support.google.com/chrome/answer/95647?hl=en" | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| class="flex justify-start items-center gap-2 p-3" | ||
| > | ||
| <span aria-hidden="true" class="text-fg-subtle shrink-0">—</span> | ||
| <span class="flex justify-between items-center flex-grow-1"> | ||
| <span | ||
| class="text-fg-muted hover:text-fg underline decoration-fg-subtle/50 hover:decoration-fg" | ||
| > | ||
| {{ $t('cookie_policy.section_5.chrome') }} | ||
| </span> | ||
| <span class="i-carbon:launch rtl-flip w-5 h-5" aria-hidden="true"></span> | ||
| </span> | ||
| </a> | ||
| </li> | ||
| <li> | ||
| <a | ||
| href="https://support.mozilla.org/en-US/kb/clear-cookies-and-site-data-firefox" | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| class="flex justify-start items-center gap-2 p-3" | ||
| > | ||
| <span aria-hidden="true" class="text-fg-subtle shrink-0">—</span> | ||
| <span class="flex justify-between items-center flex-grow-1"> | ||
| <span | ||
| class="text-fg-muted hover:text-fg underline decoration-fg-subtle/50 hover:decoration-fg" | ||
| > | ||
| {{ $t('cookie_policy.section_5.firefox') }} | ||
| </span> | ||
| <span class="i-carbon:launch rtl-flip w-5 h-5" aria-hidden="true"></span> | ||
| </span> | ||
| </a> | ||
| </li> | ||
| <li> | ||
| <a | ||
| href="https://support.microsoft.com/en-us/windows/manage-cookies-in-microsoft-edge-view-allow-block-delete-and-use-168dab11-0753-043d-7c16-ede5947fc64d" | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| class="flex justify-start items-center gap-2 p-3" | ||
| > | ||
| <span aria-hidden="true" class="text-fg-subtle shrink-0">—</span> | ||
| <span class="flex justify-between items-center flex-grow-1"> | ||
| <span | ||
| class="text-fg-muted hover:text-fg underline decoration-fg-subtle/50 hover:decoration-fg" | ||
| > | ||
| {{ $t('cookie_policy.section_5.edge') }} | ||
| </span> | ||
| <span class="i-carbon:launch rtl-flip w-5 h-5" aria-hidden="true"></span> | ||
| </span> | ||
| </a> | ||
| </li> | ||
| </ul> | ||
| </section> | ||
|
|
||
| <section class="mt-8"> | ||
| <h2 class="text-lg text-fg-subtle uppercase tracking-wider mb-4"> | ||
| {{ $t('cookie_policy.section_6.title') }} | ||
| </h2> | ||
| <p> | ||
| <i18n-t keypath="cookie_policy.section_6.p1" tag="span" scope="global"> | ||
| <template #link> | ||
| <a | ||
| href="https://github.com/npmx-dev/npmx.dev/issues" | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| class="inline-flex items-center gap-1" | ||
| > | ||
| <span | ||
| class="text-fg-muted hover:text-fg underline decoration-fg-subtle/50 hover:decoration-fg" | ||
| >{{ $t('cookie_policy.section_6.link') }}</span | ||
| > | ||
| <span class="i-carbon:launch rtl-flip w-4 h-4" aria-hidden="true"></span> | ||
| </a> | ||
| </template> | ||
| </i18n-t> | ||
| </p> | ||
| </section> | ||
|
|
||
| <section class="mt-8"> | ||
| <h2 class="text-lg text-fg-subtle uppercase tracking-wider mb-4"> | ||
| {{ $t('cookie_policy.section_7.title') }} | ||
| </h2> | ||
| <p>{{ $t('cookie_policy.section_7.p1') }}</p> | ||
| </section> | ||
| </div> | ||
| </article> | ||
| </main> | ||
| </template> | ||
Uh oh!
There was an error while loading. Please reload this page.