Skip to content

Minor updates #21

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Mar 23, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 20 additions & 4 deletions components/LanguageSwitcher.vue
Original file line number Diff line number Diff line change
Expand Up @@ -44,25 +44,41 @@ function closePopup() {
</button>
<div
v-if="isPopupOpen"
class="absolute -bottom-36 right-0 flex flex-col items-stretch rounded"
class="absolute -bottom-40 right-0 flex flex-col items-stretch rounded"
>
<NuxtLink
:to="switchLocalePath('fr')"
@click="closePopup"
class="language"
><span class="block">🇫🇷</span> Français</NuxtLink
>
<span class="block">
<NuxtImg
src="/images/flag-france.svg"
alt="The flag of France"
class="h-8"
/>
</span>
<span class="block"> Français </span>
</NuxtLink>
<NuxtLink
:to="switchLocalePath('en')"
@click="closePopup"
class="language"
><span class="block">🇺🇸</span> English</NuxtLink
>
<span class="block">
<NuxtImg
src="/images/flag-united-states.svg"
alt="The flag of the States"
class="h-8"
/>
</span>
<span class="block">English</span>
</NuxtLink>
</div>
</div>
</template>

<style scoped lang="sass">
.language
@apply p-2 block hover:border-gray-200 dark:hover:border-slate-600 dark:hover:bg-slate-700 hover:bg-white border border-solid border-transparent rounded text-center
@apply p-2 flex flex-col items-center hover:border-gray-200 dark:hover:border-slate-600 dark:hover:bg-slate-700 hover:bg-white border border-solid border-transparent rounded text-center
</style>
2 changes: 1 addition & 1 deletion components/TableOfContent.vue
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ var scrollToTop = function () {

<template>
<aside
class="sticky top-[350px] bg-white dark:bg-slate-800 font-bold rounded-lg border border-solid border-gray-200 dark:border-gray-700 xl:w-[272px] text-sm transform -translate-y-60"
class="lg:sticky lg:top-[350px] bg-white dark:bg-slate-800 font-bold rounded-lg border border-solid border-gray-200 dark:border-gray-700 xl:w-[272px] text-sm transform lg:-translate-y-60"
aria-label="Table of Content"
>
<header
Expand Down
3 changes: 3 additions & 0 deletions nuxt.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -91,4 +91,7 @@ export default defineNuxtConfig({
language: "en",
},
},
image: {
provider: "netlify", // Use your own provider!
},
});
8 changes: 5 additions & 3 deletions pages/[...slug].vue
Original file line number Diff line number Diff line change
Expand Up @@ -83,9 +83,11 @@ onBeforeUnmount(() => {
</li>
</ul>
</Landing>
<main class="mx-auto flex justify-center">
<main
class="mx-auto flex flex-col-reverse lg:flex-row justify-center px-6 lg:px-0"
>
<article
class="prose prose-stone dark:prose-invert max-w-[90%] sm:max-w-[65ch] prose-pre:bg-gray-100 dark:prose-pre:bg-slate-700 dark:prose-pre:text-gray-50 prose-pre:border prose-pre:border-gray-200 dark:prose-pre:border-gray-700 prose-pre:border-solid prose-pre:rounded-lg prose-pre:text-slate-800 prose-headings:text-cyan-600 dark:prose-hr:border-gray-700 dark:prose-li:marker:text-gray-200 dark:prose-blockquote:border-gray-200 prose-headings:scroll-mt-24"
class="prose prose-stone dark:prose-invert sm:max-w-[65ch] prose-pre:bg-gray-100 dark:prose-pre:bg-slate-700 dark:prose-pre:text-gray-50 prose-pre:border prose-pre:border-gray-200 dark:prose-pre:border-gray-700 prose-pre:border-solid prose-pre:rounded-lg prose-pre:text-slate-800 prose-headings:text-cyan-600 dark:prose-hr:border-gray-700 dark:prose-li:marker:text-gray-200 dark:prose-blockquote:border-gray-200 prose-headings:scroll-mt-24"
>
<ContentRenderer :value="(data as Record<string, any> | undefined)">
<template #empty>
Expand All @@ -112,7 +114,7 @@ onBeforeUnmount(() => {
<div aria-hidden v-else />
</div>
</article>
<div v-if="toc" class="relative ml-10 hidden lg:block">
<div v-if="toc" class="relative lg:ml-10 lg:block">
<TableOfContent :toc="toc.links" />
</div>
</main>
Expand Down
1 change: 1 addition & 0 deletions public/images/flag-france.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions public/images/flag-united-states.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.