erudit 2.0.0-dev.9 → 3.0.0-dev.2

package/app/components/aside/major/panes/nav/fnav/FNavSeparator.vue

@@ -1,80 +1,80 @@
-<script lang="ts" setup>
-import { navStateKey } from '../../../../../../../app/scripts/aside/major/nav';
-import type { FrontNavSeparator } from '@shared/frontNav';
-
-import FNavItem from './FNavItem.vue';
-import FNavFlags from './FNavFlags.vue';
-
-const props = defineProps<{ navItem: FrontNavSeparator }>();
-const navState = inject(navStateKey);
-
-const active = ref(false);
-const accent = ref(false);
-
-function onStateUpdate() {
-    const newState = navState!.value[props.navItem.id]!.value;
-    active.value = newState === 'active';
-    accent.value = newState === 'activePart';
-}
-
-onStateUpdate();
-watch(navState!.value[props.navItem.id]!, onStateUpdate);
-</script>
-
-<template>
-    <div>
-        <NuxtLink
-            :to="`/group/${navItem.id}`"
-            :class="[
-                $style.header,
-                active && $style.active,
-                accent && $style.accent,
-            ]"
-            :prefetch="false"
-        >
-            <div :class="$style.label">{{ navItem.label }}</div>
-            <FNavFlags
-                :class="$style.flags"
-                v-if="navItem.flags"
-                :flags="navItem.flags"
-            />
-        </NuxtLink>
-        <FNavItem v-for="childItem of navItem.children" :navItem="childItem" />
-    </div>
-</template>
-
-<style lang="scss" module>
-.header {
-    display: flex;
-    gap: var(--gap);
-    padding: calc(var(--gap) / 2) var(--gap);
-    text-decoration: none;
-    @include transition(background);
-
-    .label {
-        flex: 1;
-        font-weight: 600;
-        font-size: 0.95em;
-        color: var(--textDimmed);
-        @include transition(color);
-    }
-
-    .flags {
-        flex-shrink: 0;
-    }
-
-    &:hover {
-        background: var(--bgAccent);
-    }
-    &:hover:not(.active) .label {
-        color: var(--text);
-    }
-
-    &.active .label {
-        color: var(--brand);
-    }
-    &.accent .label {
-        color: var(--textMuted);
-    }
-}
-</style>
+<script lang="ts" setup>
+import { navStateKey } from '@app/scripts/aside/major/nav';
+import type { FrontNavSeparator } from '@shared/frontNav';
+
+import FNavItem from './FNavItem.vue';
+import FNavFlags from './FNavFlags.vue';
+
+const props = defineProps<{ navItem: FrontNavSeparator }>();
+const navState = inject(navStateKey);
+
+const active = ref(false);
+const accent = ref(false);
+
+function onStateUpdate() {
+    const newState = navState!.value[props.navItem.id]!.value;
+    active.value = newState === 'active';
+    accent.value = newState === 'activePart';
+}
+
+onStateUpdate();
+watch(navState!.value[props.navItem.id]!, onStateUpdate);
+</script>
+
+<template>
+    <div>
+        <NuxtLink
+            :to="`/group/${navItem.id}`"
+            :class="[
+                $style.header,
+                active && $style.active,
+                accent && $style.accent,
+            ]"
+            :prefetch="false"
+        >
+            <div :class="$style.label">{{ navItem.label }}</div>
+            <FNavFlags
+                :class="$style.flags"
+                v-if="navItem.flags"
+                :flags="navItem.flags"
+            />
+        </NuxtLink>
+        <FNavItem v-for="childItem of navItem.children" :navItem="childItem" />
+    </div>
+</template>
+
+<style lang="scss" module>
+.header {
+    display: flex;
+    gap: var(--gap);
+    padding: calc(var(--gap) / 2) var(--gap);
+    text-decoration: none;
+    @include transition(background);
+
+    .label {
+        flex: 1;
+        font-weight: 600;
+        font-size: 0.95em;
+        color: var(--textDimmed);
+        @include transition(color);
+    }
+
+    .flags {
+        flex-shrink: 0;
+    }
+
+    &:hover {
+        background: var(--bgAccent);
+    }
+    &:hover:not(.active) .label {
+        color: var(--text);
+    }
+
+    &.active .label {
+        color: var(--brand);
+    }
+    &.accent .label {
+        color: var(--textMuted);
+    }
+}
+</style>

package/app/components/aside/major/panes/nav/fnav/FNavTopic.vue

@@ -1,24 +1,24 @@
-<script lang="ts" setup>
-import { navStateKey } from '../../../../../../../app/scripts/aside/major/nav';
-import type { FrontNavTopic } from '@shared/frontNav';
-
-import FNavFlags from './FNavFlags.vue';
-
-const props = defineProps<{ navItem: FrontNavTopic }>();
-const navState = inject(navStateKey);
-const active = computed(
-    () => navState!.value[props.navItem.id]!.value === 'active',
-);
-</script>
-
-<template>
-    <TreeItem
-        icon="outline/file-lines"
-        :active
-        :label="navItem.label"
-        :level="navItem.level"
-        :link="`/${navItem.part}/${navItem.id}`"
-    >
-        <FNavFlags v-if="navItem.flags" :flags="navItem.flags" />
-    </TreeItem>
-</template>
+<script lang="ts" setup>
+import { navStateKey } from '@app/scripts/aside/major/nav';
+import type { FrontNavTopic } from '@shared/frontNav';
+
+import FNavFlags from './FNavFlags.vue';
+
+const props = defineProps<{ navItem: FrontNavTopic }>();
+const navState = inject(navStateKey);
+const active = computed(
+    () => navState!.value[props.navItem.id]!.value === 'active',
+);
+</script>
+
+<template>
+    <TreeItem
+        icon="outline/file-lines"
+        :active
+        :label="navItem.label"
+        :level="navItem.level"
+        :link="`/${navItem.part}/${navItem.id}`"
+    >
+        <FNavFlags v-if="navItem.flags" :flags="navItem.flags" />
+    </TreeItem>
+</template>

package/app/components/aside/major/panes/other/ItemContent.vue

@@ -1,29 +1,29 @@
-<script lang="ts" setup>
-import eruditConfig from '#erudit/config';
-
-const phrase = await usePhrases('_language_code', 'content');
-
-const secondary = ref<string>();
-
-const githubResponse = await useExternalApiRepository();
-const strDate = githubResponse.commit?.commit?.author?.date;
-
-if (strDate) {
-    secondary.value = new Date(strDate).toLocaleString(phrase._language_code, {
-        day: 'numeric',
-        month: 'short',
-        year: 'numeric',
-    });
-} else console.warn(`Bad content last commit date repsonse: ${strDate}`);
-</script>
-
-<template>
-    <AsideListItem
-        v-if="secondary"
-        :link="`https://github.com/${eruditConfig.repository?.name}`"
-        target="_blank"
-        icon="draw"
-        :main="phrase.content + ':'"
-        :secondary
-    />
-</template>
+<script lang="ts" setup>
+import eruditConfig from '#erudit/config';
+
+const phrase = await usePhrases('_language_code', 'content');
+
+const secondary = ref<string>();
+
+const githubResponse = await useExternalApiRepository();
+const strDate = githubResponse.commit?.commit?.author?.date;
+
+if (strDate) {
+    secondary.value = new Date(strDate).toLocaleString(phrase._language_code, {
+        day: 'numeric',
+        month: 'short',
+        year: 'numeric',
+    });
+} else console.warn(`Bad content last commit date repsonse: ${strDate}`);
+</script>
+
+<template>
+    <AsideListItem
+        v-if="secondary"
+        :link="`https://github.com/${eruditConfig.repository?.name}`"
+        target="_blank"
+        icon="draw"
+        :main="phrase.content + ':'"
+        :secondary
+    />
+</template>

package/app/components/aside/major/panes/other/ItemGenerator.vue

@@ -1,15 +1,15 @@
-<script lang="ts" setup>
-import { version } from '@erudit/package.json';
-
-const phrase = await usePhrases('generator');
-</script>
-
-<template>
-    <AsideListItem
-        link="https://github.com/Gwynerva/erudit"
-        target="_blank"
-        icon="chip"
-        :main="phrase.generator + ':'"
-        :secondary="`Erudit ${version}`"
-    />
-</template>
+<script lang="ts" setup>
+import { version } from '@erudit/package.json';
+
+const phrase = await usePhrases('generator');
+</script>
+
+<template>
+    <AsideListItem
+        link="https://github.com/Gwynerva/erudit"
+        target="_blank"
+        icon="chip"
+        :main="phrase.generator + ':'"
+        :secondary="`Erudit ${version}`"
+    />
+</template>

package/app/components/aside/major/panes/other/ItemTheme.vue

@@ -1,54 +1,54 @@
-<script lang="ts" setup>
-import type { MyIconName } from '#my-icons';
-
-const phrase = await usePhrases(
-    'theme',
-    'theme_system',
-    'theme_light',
-    'theme_dark',
-);
-
-const themeOptions: Record<string, [MyIconName, string]> = {
-    auto: ['sun-moon', phrase.theme_system],
-    light: ['sun', phrase.theme_light],
-    dark: ['moon', phrase.theme_dark],
-};
-
-const themeItem = ref(themeOptions.auto);
-
-let _cycle = () => {};
-
-onMounted(() => {
-    const { cycle, theme } = useTheme();
-
-    _cycle = cycle;
-
-    watch(
-        theme,
-        () => {
-            themeItem.value = (() => {
-                switch (theme.value) {
-                    case 'auto':
-                        return themeOptions.auto;
-                    case 'light':
-                        return themeOptions.light;
-                    case 'dark':
-                        return themeOptions.dark;
-                }
-            })();
-        },
-        { immediate: true },
-    );
-});
-</script>
-
-<template>
-    <ClientOnly>
-        <AsideListItem
-            @click="_cycle"
-            :icon="themeItem![0]"
-            :main="phrase.theme + ':'"
-            :secondary="themeItem![1]"
-        />
-    </ClientOnly>
-</template>
+<script lang="ts" setup>
+import type { MyIconName } from '#my-icons';
+
+const phrase = await usePhrases(
+    'theme',
+    'theme_system',
+    'theme_light',
+    'theme_dark',
+);
+
+const themeOptions: Record<string, [MyIconName, string]> = {
+    auto: ['sun-moon', phrase.theme_system],
+    light: ['sun', phrase.theme_light],
+    dark: ['moon', phrase.theme_dark],
+};
+
+const themeItem = ref(themeOptions.auto);
+
+let _cycle = () => {};
+
+onMounted(() => {
+    const { cycle, theme } = useTheme();
+
+    _cycle = cycle;
+
+    watch(
+        theme,
+        () => {
+            themeItem.value = (() => {
+                switch (theme.value) {
+                    case 'auto':
+                        return themeOptions.auto;
+                    case 'light':
+                        return themeOptions.light;
+                    case 'dark':
+                        return themeOptions.dark;
+                }
+            })();
+        },
+        { immediate: true },
+    );
+});
+</script>
+
+<template>
+    <ClientOnly>
+        <AsideListItem
+            @click="_cycle"
+            :icon="themeItem![0]"
+            :main="phrase.theme + ':'"
+            :secondary="themeItem![1]"
+        />
+    </ClientOnly>
+</template>

package/app/components/aside/major/panes/other/Other.vue

@@ -1,16 +1,16 @@
-<script lang="ts" setup>
-import eruditConfig from '#erudit/config';
-
-import PaneContentScroll from '../../PaneContentScroll.vue';
-import ItemTheme from './ItemTheme.vue';
-import ItemContent from './ItemContent.vue';
-import ItemGenerator from './ItemGenerator.vue';
-</script>
-
-<template>
-    <PaneContentScroll>
-        <ItemTheme />
-        <ItemContent v-if="eruditConfig.repository" />
-        <ItemGenerator />
-    </PaneContentScroll>
-</template>
+<script lang="ts" setup>
+import eruditConfig from '#erudit/config';
+
+import PaneContentScroll from '../../PaneContentScroll.vue';
+import ItemTheme from './ItemTheme.vue';
+import ItemContent from './ItemContent.vue';
+import ItemGenerator from './ItemGenerator.vue';
+</script>
+
+<template>
+    <PaneContentScroll>
+        <ItemTheme />
+        <ItemContent v-if="eruditConfig.repository" />
+        <ItemGenerator />
+    </PaneContentScroll>
+</template>

package/app/components/aside/minor/AsideMinorContributor.vue

@@ -1,5 +1,5 @@
-<template>
-    <AsideMinorPane>
-        <div>Contributor</div>
-    </AsideMinorPane>
-</template>
+<template>
+    <AsideMinorPane>
+        <div>Contributor</div>
+    </AsideMinorPane>
+</template>

package/app/components/aside/minor/AsideMinorNews.vue

@@ -1,11 +1,11 @@
-<script lang="ts" setup>
-// import { injectNewsData } from '../../../../app/scripts/aside/minor/state';
-
-// const newsData = injectNewsData();
-</script>
-
-<template>
-    <AsideMinorPane>
-        <div></div>
-    </AsideMinorPane>
-</template>
+<script lang="ts" setup>
+// import { injectNewsData } from '@app/scripts/aside/minor/state';
+
+// const newsData = injectNewsData();
+</script>
+
+<template>
+    <AsideMinorPane>
+        <div></div>
+    </AsideMinorPane>
+</template>

package/app/components/aside/minor/AsideMinorPane.vue

@@ -1,16 +1,15 @@
-<template>
-    <div :class="$style.asideMinorPane">
-        <slot></slot>
-    </div>
-</template>
-
-<style lang="scss" module>
-.asideMinorPane
-{
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    top: 0;
-    left: 0;
-}
-</style>
+<template>
+    <div :class="$style.asideMinorPane">
+        <slot></slot>
+    </div>
+</template>
+
+<style lang="scss" module>
+.asideMinorPane {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+}
+</style>

package/app/components/aside/minor/AsideMinorTopLink.vue

@@ -1,67 +1,67 @@
-<script lang="ts" setup>
-import type { MyIconName } from '#my-icons';
-
-defineProps<{ link?: string; icon: MyIconName; active?: boolean }>();
-
-const Link = defineNuxtLink({ prefetch: false });
-</script>
-
-<template>
-    <Link
-        :to="link"
-        :class="[
-            $style.asideMinorTopLink,
-            !link && $style.noLink,
-            active && $style.active,
-        ]"
-    >
-        <MyIcon :name="icon" />
-    </Link>
-</template>
-
-<style lang="scss" module>
-.asideMinorTopLink {
-    position: relative;
-    font-size: 22px;
-    padding: 20px 12px;
-    color: var(--textDimmed);
-    cursor: pointer;
-    color: var(--textMuted);
-
-    @include transition(color, opacity);
-
-    &:hover {
-        color: var(--text);
-        &::after {
-            background: var(--border);
-        }
-    }
-
-    &::after {
-        content: '';
-        position: absolute;
-        left: 0;
-        bottom: -1px;
-        width: 100%;
-        height: 3px;
-        background: transparent;
-        @include transition(background);
-    }
-
-    &.active {
-        color: var(--text);
-        &::after {
-            background: var(--textMuted);
-        }
-    }
-
-    &.noLink {
-        opacity: 0.8;
-        cursor: default;
-        color: var(--textDisabled);
-        &::after {
-            background: transparent;
-        }
-    }
-}
-</style>
+<script lang="ts" setup>
+import type { MyIconName } from '#my-icons';
+
+defineProps<{ link?: string; icon: MyIconName; active?: boolean }>();
+
+const Link = defineNuxtLink({ prefetch: false });
+</script>
+
+<template>
+    <Link
+        :to="link"
+        :class="[
+            $style.asideMinorTopLink,
+            !link && $style.noLink,
+            active && $style.active,
+        ]"
+    >
+        <MyIcon :name="icon" />
+    </Link>
+</template>
+
+<style lang="scss" module>
+.asideMinorTopLink {
+    position: relative;
+    font-size: 22px;
+    padding: 20px 12px;
+    color: var(--textDimmed);
+    cursor: pointer;
+    color: var(--textMuted);
+
+    @include transition(color, opacity);
+
+    &:hover {
+        color: var(--text);
+        &::after {
+            background: var(--border);
+        }
+    }
+
+    &::after {
+        content: '';
+        position: absolute;
+        left: 0;
+        bottom: -1px;
+        width: 100%;
+        height: 3px;
+        background: transparent;
+        @include transition(background);
+    }
+
+    &.active {
+        color: var(--text);
+        &::after {
+            background: var(--textMuted);
+        }
+    }
+
+    &.noLink {
+        opacity: 0.8;
+        cursor: default;
+        color: var(--textDisabled);
+        &::after {
+            background: transparent;
+        }
+    }
+}
+</style>