Skip to content

Commit abf1d72

Browse files
jellydeckjellydeck
committed
Merge branch 'main' into accessible-accent
2 parents 2be900e + 22169b2 commit abf1d72

126 files changed

Lines changed: 4154 additions & 1266 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎.lighthouserc.cjs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ module.exports = {
2929
url: [
3030
'http://localhost:3000/',
3131
'http://localhost:3000/search?q=nuxt',
32-
'http://localhost:3000/nuxt',
32+
'http://localhost:3000/package/nuxt',
3333
],
3434
numberOfRuns: 1,
3535
chromePath: findChrome(),

‎app/app.vue‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,16 @@ const localeMap = locales.value.reduce(
2121
{} as Record<string, Directions>,
2222
)
2323
24+
const darkMode = usePreferredDark()
25+
const colorMode = useColorMode()
26+
const colorScheme = computed(() => {
27+
return {
28+
system: darkMode ? 'dark light' : 'light dark',
29+
light: 'only light',
30+
dark: 'only dark',
31+
}[colorMode.preference]
32+
})
33+
2434
useHead({
2535
htmlAttrs: {
2636
'lang': () => locale.value,
@@ -30,6 +40,7 @@ useHead({
3040
titleTemplate: titleChunk => {
3141
return titleChunk ? titleChunk : 'npmx - Better npm Package Browser'
3242
},
43+
meta: [{ name: 'color-scheme', content: colorScheme }],
3344
})
3445
3546
if (import.meta.server) {

‎app/assets/main.css‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,32 @@
7575
--badge-cyan: oklch(0.571 0.181 210);
7676
}
7777

78+
@media (prefers-contrast: more) {
79+
:root[data-theme='dark'] {
80+
/* text colors */
81+
--fg: oklch(1 0 0);
82+
--fg-muted: oklch(0.769 0 0);
83+
--fg-subtle: oklch(0.693 0 0);
84+
85+
/* border, separator colors */
86+
--border: oklch(0.769 0 0);
87+
--border-subtle: oklch(0.739 0 0);
88+
--border-hover: oklch(0.771 0 0);
89+
}
90+
91+
:root[data-theme='light'] {
92+
/* text colors */
93+
--fg: oklch(0 0 0);
94+
--fg-muted: oklch(0.329 0 0);
95+
--fg-subtle: oklch(0.4 0 0);
96+
97+
/* border, separator colors */
98+
--border: oklch(0.3514 0 0);
99+
--border-subtle: oklch(0.422 0 0);
100+
--border-hover: oklch(0.315 0 0);
101+
}
102+
}
103+
78104
html {
79105
-webkit-font-smoothing: antialiased;
80106
-moz-osx-font-smoothing: grayscale;

‎app/components/AppFooter.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ const isHome = computed(() => route.name === 'index')
77
<footer class="border-t border-border mt-auto">
88
<div class="container py-3 sm:py-8 flex flex-col gap-2 sm:gap-4 text-fg-subtle text-sm">
99
<div
10-
class="flex flex-col sm:flex-row items-center sm:items-baseline justify-between gap-2 sm:gap-4"
10+
class="flex flex-col sm:flex-row sm:flex-wrap items-center sm:items-baseline justify-between gap-2 sm:gap-4"
1111
>
1212
<div>
1313
<p class="font-mono text-balance m-0 hidden sm:block">{{ $t('tagline') }}</p>

‎app/components/CallToAction.vue‎

Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
<script setup lang="ts">
2+
const socialLinks = {
3+
github: 'https://repo.npmx.dev',
4+
discord: 'https://chat.npmx.dev',
5+
bluesky: 'https://social.npmx.dev',
6+
}
7+
</script>
8+
9+
<template>
10+
<div>
11+
<h2 class="text-lg text-fg-subtle uppercase tracking-wider mb-6">
12+
{{ $t('about.get_involved.title') }}
13+
</h2>
14+
15+
<div class="grid gap-4 sm:grid-cols-3">
16+
<a
17+
:href="socialLinks.github"
18+
target="_blank"
19+
rel="noopener noreferrer"
20+
class="group flex flex-col gap-3 p-4 rounded-lg bg-bg-subtle hover:bg-bg-elevated border border-border hover:border-border-hover transition-all duration-200"
21+
>
22+
<div class="flex gap-2">
23+
<span class="i-carbon:logo-github shrink-0 mt-1 w-5 h-5 text-fg" aria-hidden="true" />
24+
<span class="font-medium text-fg">
25+
{{ $t('about.get_involved.contribute.title') }}
26+
</span>
27+
</div>
28+
<p class="text-sm text-fg-muted leading-relaxed">
29+
{{ $t('about.get_involved.contribute.description') }}
30+
</p>
31+
<span
32+
class="text-sm text-fg-muted group-hover:text-fg inline-flex items-center gap-1 mt-auto"
33+
>
34+
{{ $t('about.get_involved.contribute.cta') }}
35+
<span class="i-carbon:arrow-right rtl-flip w-3 h-3" aria-hidden="true" />
36+
</span>
37+
</a>
38+
39+
<a
40+
:href="socialLinks.discord"
41+
target="_blank"
42+
rel="noopener noreferrer"
43+
class="group flex flex-col gap-3 p-4 rounded-lg bg-bg-subtle hover:bg-bg-elevated border border-border hover:border-border-hover transition-all duration-200"
44+
>
45+
<div class="flex gap-2">
46+
<span class="i-carbon:chat shrink-0 mt-1 w-5 h-5 text-fg" aria-hidden="true" />
47+
<span class="font-medium text-fg">
48+
{{ $t('about.get_involved.community.title') }}
49+
</span>
50+
</div>
51+
<p class="text-sm text-fg-muted leading-relaxed">
52+
{{ $t('about.get_involved.community.description') }}
53+
</p>
54+
<span
55+
class="text-sm text-fg-muted group-hover:text-fg inline-flex items-center gap-1 mt-auto"
56+
>
57+
{{ $t('about.get_involved.community.cta') }}
58+
<span class="i-carbon:arrow-right rtl-flip w-3 h-3" aria-hidden="true" />
59+
</span>
60+
</a>
61+
62+
<a
63+
:href="socialLinks.bluesky"
64+
target="_blank"
65+
rel="noopener noreferrer"
66+
class="group flex flex-col gap-3 p-4 rounded-lg bg-bg-subtle hover:bg-bg-elevated border border-border hover:border-border-hover transition-all duration-200"
67+
>
68+
<div class="flex gap-2">
69+
<span class="i-simple-icons:bluesky shrink-0 mt-1 w-5 h-5 text-fg" aria-hidden="true" />
70+
<span class="font-medium text-fg">
71+
{{ $t('about.get_involved.follow.title') }}
72+
</span>
73+
</div>
74+
<p class="text-sm text-fg-muted leading-relaxed">
75+
{{ $t('about.get_involved.follow.description') }}
76+
</p>
77+
<span
78+
class="text-sm text-fg-muted group-hover:text-fg inline-flex items-center gap-1 mt-auto"
79+
>
80+
{{ $t('about.get_involved.follow.cta') }}
81+
<span class="i-carbon:arrow-right rtl-flip w-3 h-3" aria-hidden="true" />
82+
</span>
83+
</a>
84+
</div>
85+
</div>
86+
</template>

‎app/components/CollapsibleSection.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -109,7 +109,7 @@ useHead({
109109
>
110110
{{ title }}
111111
<span
112-
class="i-carbon:link w-3 h-3 block opacity-0 group-hover:opacity-100 transition-opacity duration-200"
112+
class="i-carbon:link w-3 h-3 opacity-0 group-hover:opacity-100 transition-opacity duration-200"
113113
aria-hidden="true"
114114
/>
115115
</a>

‎app/components/Header/ConnectorModal.vue‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -119,8 +119,8 @@ function handleDisconnect() {
119119
class="ms-auto text-fg-subtle hover:text-fg transition-colors duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/70 rounded"
120120
@click="copy('pnpm npmx-connector')"
121121
>
122-
<span v-if="!copied" class="i-carbon:copy block w-5 h-5" aria-hidden="true" />
123-
<span v-else class="i-carbon:checkmark block w-5 h-5 text-green-500" aria-hidden="true" />
122+
<span v-if="!copied" class="i-carbon:copy w-5 h-5" aria-hidden="true" />
123+
<span v-else class="i-carbon:checkmark w-5 h-5 text-green-500" aria-hidden="true" />
124124
</button>
125125
</div>
126126

@@ -141,10 +141,10 @@ function handleDisconnect() {
141141
class="ms-auto text-fg-subtle hover:text-fg transition-colors duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent/70 rounded"
142142
@click="copyCommand"
143143
>
144-
<span v-if="!copied" class="i-carbon:copy block w-5 h-5" aria-hidden="true" />
144+
<span v-if="!copied" class="i-carbon:copy w-5 h-5" aria-hidden="true" />
145145
<span
146146
v-else
147-
class="i-carbon:checkmark block w-5 h-5 text-green-500"
147+
class="i-carbon:checkmark w-5 h-5 text-green-500"
148148
aria-hidden="true"
149149
/>
150150
</button>

‎app/components/Header/MobileMenu.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ onUnmounted(deactivate)
9494
:aria-label="$t('common.close')"
9595
@click="closeMenu"
9696
>
97-
<span class="i-carbon:close block w-5 h-5" aria-hidden="true" />
97+
<span class="i-carbon:close w-5 h-5" aria-hidden="true" />
9898
</button>
9999
</div>
100100

‎app/components/Header/PackagesDropdown.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ function handleKeydown(event: KeyboardEvent) {
9494
<ul v-else-if="packages.length > 0" class="py-1 max-h-80 overflow-y-auto">
9595
<li v-for="pkg in packages" :key="pkg">
9696
<NuxtLink
97-
:to="`/${pkg}`"
97+
:to="`/package/${pkg}`"
9898
class="block px-3 py-2 font-mono text-sm text-fg hover:bg-bg-subtle transition-colors truncate"
9999
>
100100
{{ pkg }}

‎app/components/Header/SearchBox.vue‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script setup lang="ts">
22
import { debounce } from 'perfect-debounce'
3+
import { normalizeSearchParam } from '#shared/utils/url'
34
45
withDefaults(
56
defineProps<{
@@ -22,9 +23,7 @@ const showSearchBar = computed(() => {
2223
})
2324
2425
// Local input value (updates immediately as user types)
25-
const searchQuery = shallowRef(
26-
(Array.isArray(route.query.q) ? route.query.q[0] : route.query.q) ?? '',
27-
)
26+
const searchQuery = shallowRef(normalizeSearchParam(route.query.q))
2827
2928
// Pages that have their own local filter using ?q
3029
const pagesWithLocalFilter = new Set(['~username', 'org'])
@@ -64,7 +63,7 @@ watch(
6463
if (pagesWithLocalFilter.has(route.name as string)) {
6564
return
6665
}
67-
const value = (urlQuery as string) ?? ''
66+
const value = normalizeSearchParam(urlQuery)
6867
if (searchQuery.value !== value) {
6968
searchQuery.value = value
7069
}

0 commit comments

Comments
 (0)