nardu.in/website-astro
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

lot of content

Browse Source
This commit is contained in:
Nico 2023-02-03 10:37:28 +01:00
parent 9b91b02d90
commit 082b193d23
31 changed files with 338 additions and 70 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.astro-i18n/generated.d.ts vendored
View File

@ -1,8 +1,8 @@
type DefaultLangCode = "fr"
type SupportedLangCode = "en"
type LangCode = DefaultLangCode | SupportedLangCode
type RouteUri = | "/articles/[slug]" | "/articles" | "/agments/[slug]" | "/agments" | "/tags/[tag]" | "/tags" | "/"
type RouteParams = {"/articles/[slug]": { "slug": string; }; "/articles": undefined; "/agments/[slug]": { "slug": string; }; "/agments": undefined; "/tags/[tag]": { "tag": string; }; "/tags": undefined; "/": undefined; }
type RouteUri = | "/articles/[slug]" | "/articles" | "/agments/[slug]" | "/agments" | "/tags/[tag]" | "/tags" | "/" | "/plan-du-site"
type RouteParams = {"/articles/[slug]": { "slug": string; }; "/articles": undefined; "/agments/[slug]": { "slug": string; }; "/agments": undefined; "/tags/[tag]": { "tag": string; }; "/tags": undefined; "/": undefined; "/plan-du-site": undefined; }
type TranslationPath = "accueil" | "tagline" | "copyright" | "contact.title" | "contact.email" | "contact.tel" | "contenuVide" | "header.skipLink" | "header.mainNav" | "header.homeLink" | "sitemap" | "prevNext.contenus" | "prevNext.precedent" | "prevNext.suivant" | "article.titre" | "article.tagline" | "article.published" | "meta.publication" | "meta.modification" | "meta.credit" | "fragments.titre" | "fragments.tagline" | "projet.titre" | "projet.tagline" | "projet.cta" | "projet.lienTitle" | "projet.fenetre" | "erreur.introuvable" | "erreur.autre" | "erreur.lienRetour" | "seo.article.title" | "seo.article.description" | "seo.projet.title" | "seo.projet.description" | "seo.code.title" | "seo.code.description" | "index.articles.pageName" | "index.articles.subtitle" | "index.fragments.pageName" | "index.fragments.subtitle" | "index.title" | "index.subtitle" | "index.quoi" | "index.comment" | "index.opensource" | "index.writing" | "index.latestProjects" | "index.latestArticles" | "index.allProjects" | "index.allArticles" | "index.latestSnippets" | "index.allSnippets" | "index.toc" | "contact.contenuVide"
type TranslationOptions = { "accueil": {} | undefined; "tagline": {} | undefined; "copyright": {} | undefined; "contact.title": {} | undefined; "contact.email": {} | undefined; "contact.tel": {} | undefined; "contenuVide": {} | undefined; "header.skipLink": {} | undefined; "header.mainNav": {} | undefined; "header.homeLink": {} | undefined; "sitemap": {} | undefined; "prevNext.contenus": {} | undefined; "prevNext.precedent": {} | undefined; "prevNext.suivant": {} | undefined; "article.titre": {} | undefined; "article.tagline": {} | undefined; "article.published": { datetime: unknown; options: unknown; }; "meta.publication": {} | undefined; "meta.modification": {} | undefined; "meta.credit": {} | undefined; "fragments.titre": {} | undefined; "fragments.tagline": {} | undefined; "projet.titre": {} | undefined; "projet.tagline": {} | undefined; "projet.cta": {} | undefined; "projet.lienTitle": {} | undefined; "projet.fenetre": {} | undefined; "erreur.introuvable": {} | undefined; "erreur.autre": {} | undefined; "erreur.lienRetour": {} | undefined; "seo.article.title": {} | undefined; "seo.article.description": {} | undefined; "seo.projet.title": {} | undefined; "seo.projet.description": {} | undefined; "seo.code.title": {} | undefined; "seo.code.description": {} | undefined; "index.articles.pageName": {} | undefined; "index.articles.subtitle": {} | undefined; "index.fragments.pageName": {} | undefined; "index.fragments.subtitle": {} | undefined; "index.title": {} | undefined; "index.subtitle": {} | undefined; "index.quoi": {} | undefined; "index.comment": {} | undefined; "index.opensource": {} | undefined; "index.writing": {} | undefined; "index.latestProjects": {} | undefined; "index.latestArticles": {} | undefined; "index.allProjects": {} | undefined; "index.allArticles": {} | undefined; "index.latestSnippets": {} | undefined; "index.allSnippets": {} | undefined; "index.toc": {} | undefined; "contact.contenuVide": {} | undefined; }

17
astro.config.mjs
View File

@ -6,14 +6,29 @@ import i18n from "astro-i18n";
// https://astro.build/config
import image from "@astrojs/image";
import mdx from "@astrojs/mdx";
import sitemap from "@astrojs/sitemap";
// https://astro.build/config
export default defineConfig({
site: "https://www.nardu.in",
experimental: {
contentCollections: true,
},
markdown: {
syntaxHighlight: "prism",
},
integrations: [i18n(), image(), mdx()],
integrations: [
i18n(),
image(),
mdx(),
sitemap({
i18n: {
defaultLocale: "fr", // All urls that don't contain `en`
locales: {
fr: "fr-FR", // The `defaultLocale` value must present in `locales` keys
en: "en-US",
},
},
}),
],
});

1
astro.i18n.config.ts
View File

@ -12,6 +12,7 @@ export default defineAstroI18nConfig({
en: {
"sci-hub-blocage": "sci-hub-unblock",
fragments: "snippets",
"plan-du-site": "sitemap",
},
},
});

3
package.json
View File

@ -15,6 +15,7 @@
"dependencies": {
"@astrojs/image": "^0.12.1",
"@astrojs/mdx": "^0.13.0",
"@astrojs/sitemap": "^1.0.0",
"astro": "1.7.2",
"astro-i18n": "^1.4.5"
},
@ -23,6 +24,6 @@
"postcss": "^8.4.20"
},
"engines": {
"node": "16.18.1"
"node": "16.19.0"
}
}

38
pnpm-lock.yaml
View File

@ -3,6 +3,7 @@ lockfileVersion: 5.4
specifiers:
'@astrojs/image': ^0.12.1
'@astrojs/mdx': ^0.13.0
'@astrojs/sitemap': ^1.0.0
astro: 1.7.2
astro-i18n: ^1.4.5
autoprefixer: ^10.4.13
@ -11,6 +12,7 @@ specifiers:
dependencies:
'@astrojs/image': 0.12.1
'@astrojs/mdx': 0.13.0
'@astrojs/sitemap': 1.0.0
astro: 1.7.2
astro-i18n: 1.4.5
@ -153,6 +155,13 @@ packages:
prismjs: 1.29.0
dev: false
/@astrojs/sitemap/1.0.0:
resolution: {integrity: sha512-42GxuF5FP7RaKXZrwGLBLOX3hPv+Wl7ExJC43O0J5e34ojJkLeKf7QfwN1UwrJlqH0Ywi0Fm4/xGe482G09+wg==}
dependencies:
sitemap: 7.1.1
zod: 3.20.2
dev: false
/@astrojs/telemetry/1.0.1:
resolution: {integrity: sha512-SJVfZHp00f8VZsT1fsx1+6acJGUNt/84xZytV5znPzzNE8RXjlE0rv03llgTsEeUHYZc6uJah91jNojS7RldFg==}
engines: {node: ^14.18.0 || >=16.12.0}
@ -677,6 +686,10 @@ packages:
'@types/unist': 2.0.6
dev: false
/@types/node/17.0.45:
resolution: {integrity: sha512-w+tIMs3rq2afQdsPJlODhoUEKzFP1ayaoyl1CcnwtIlsVe7K7bA1NGm4s3PraqTLlXnbIN84zuBlxBWo1u9BLw==}
dev: false
/@types/parse5/6.0.3:
resolution: {integrity: sha512-SuT16Q1K51EAVPz1K29DJ/sXjhSQ0zjvsypYJ6tlwVsRV9jwW5Adq2ch8Dq8kDBCkYnELS7N7VNCSB5nC56t/g==}
dev: false
@ -685,6 +698,12 @@ packages:
resolution: {integrity: sha512-60BCwRFOZCQhDncwQdxxeOEEkbc5dIMccYLwbxsS4TUNeVECQ/pBJ0j09mrHOl/JJvpRPGwO9SvE4nR2Nb/a4Q==}
dev: false
/@types/sax/1.2.4:
resolution: {integrity: sha512-pSAff4IAxJjfAXUG6tFkO7dsSbTmf8CtUpfhhZ5VhkRpC4628tJhh3+V6H1E+/Gs9piSzYKT5yzHO5M4GG9jkw==}
dependencies:
'@types/node': 17.0.45
dev: false
/@types/unist/2.0.6:
resolution: {integrity: sha512-PBjIUxZHOuj0R15/xuwJYjFi+KZdNFrehocChv4g5hu6aFroHue8m0lBP0POdK2nKzbw0cgV1mws8+V/JAcEkQ==}
dev: false
@ -757,6 +776,10 @@ packages:
engines: {node: '>=12'}
dev: false
/arg/5.0.2:
resolution: {integrity: sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==}
dev: false
/argparse/1.0.10:
resolution: {integrity: sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==}
dependencies:
@ -3166,6 +3189,10 @@ packages:
suf-log: 2.5.3
dev: false
/sax/1.2.4:
resolution: {integrity: sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==}
dev: false
/section-matter/1.0.0:
resolution: {integrity: sha512-vfD3pmTzGpufjScBh50YHKzEu2lxBWhVEHsNGoEXmCmn2hKGfeNLYMzCJpe8cD7gqX7TJluOVpBkAequ6dgMmA==}
engines: {node: '>=4'}
@ -3235,6 +3262,17 @@ packages:
resolution: {integrity: sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==}
dev: false
/sitemap/7.1.1:
resolution: {integrity: sha512-mK3aFtjz4VdJN0igpIJrinf3EO8U8mxOPsTBzSsy06UtjZQJ3YY3o3Xa7zSc5nMqcMrRwlChHZ18Kxg0caiPBg==}
engines: {node: '>=12.0.0', npm: '>=5.6.0'}
hasBin: true
dependencies:
'@types/node': 17.0.45
'@types/sax': 1.2.4
arg: 5.0.2
sax: 1.2.4
dev: false
/slash/4.0.0:
resolution: {integrity: sha512-3dOsAHXXUkQTpOYcoAxLIorMTp4gIQr5IW3iVb7A7lFIp0VHhnynm9izx6TssdrIcVIESAlVjtnO2K8bg+Coew==}
engines: {node: '>=12'}

15
src/components/LangSwitcher.astro
View File

@ -7,6 +7,19 @@ const availableLocales = astroI18n.langCodes.filter(
);
// current path
const currentRoute = Astro.url.pathname;
function localeName(locale) {
let localeName = "";
switch (locale) {
case "fr":
localeName = "Français";
break;
case "en":
localeName = "English";
break;
}
return localeName;
}
---
<ul role="list">
@ -18,7 +31,7 @@ const currentRoute = Astro.url.pathname;
href={l(currentRoute as any, {}, locale as any)}
class="clean-link nice-link"
>
{locale}
{localeName(locale)}
</a>
</li>
))

4
src/components/Navigation.astro
View File

@ -11,10 +11,6 @@ import LanguageSwitcher from "./LangSwitcher.astro";
>
<span aria-hidden="true">&middot;</span>
</li>
<li>
<a href={l("/")} class="clean-link nice-link">{t("projet.titre")}</a>
<span aria-hidden="true">&middot;</span>
</li>
<li>
<a href={l("/fragments")} class="clean-link nice-link"
>{t("fragments.titre")}</a

3
src/content/articles/en/faq.md
View File

@ -3,9 +3,10 @@ title: Accessibility and sobriety
subtitle: Translation in progress, stay tuned ;)
lang: en
slug: "faq"
draft: true
excerpt: Why, how et and especially what.
tags: ["Freelance"]
createdAt: "2022-06-22T15:34:45.000Z"
---
[Go back to available articles](/en/articles/)
[Go back to available articles](/en/articles)

3
src/content/articles/en/gratuiste.md
View File

@ -3,9 +3,10 @@ title: Gratuiste
subtitle: Translation in progress, stay tuned ;)
lang: en
slug: "gratuiste"
draft: true
excerpt: Translation in progress, stay tuned ;)
tags: ["Design", "Freelance"]
createdAt: "2017-05-27T07:47:36.000Z"
---
[Go back to available articles](/en/articles/)
[Go back to available articles](/en/articles)

2
src/content/articles/en/the-day-I-jamd.mdx
View File

@ -65,7 +65,7 @@ No more Apollo client and graphQL query, only markdown and a few promises.
Don’t get me wrong, I really like working with Strapi and its graphQL capabilities but for the purpose of this website, nuxt content does it (extremely well).
I’m still using Strapi as a way to upload, store and manage images, videos, gifs, etc. It might be too much for this use case but I like to know that I can still go back to it if I want to! Also, I spent quite a bit of time setting it up with OpenLiteSpeed and I’m still too attached to this accomplishment to let it go. I wrote [an article on Strapi running with OpenLiteSpeed](/en/articles/strapi-openlitespeed) if you’re into that kind of stuff.
I’m still using Strapi as a way to upload, store and manage images, videos, gifs, etc. It might be too much for this use case but I like to know that I can still go back to it if I want to! Also, I spent quite a bit of time setting it up with OpenLiteSpeed and I’m still too attached to this accomplishment to let it go.
## In the end

39
src/content/articles/en/video-compression.md → src/content/articles/en/video-compression.mdx
View File

@ -10,11 +10,11 @@ updatedAt: "2022-06-08T14:24:06.000Z"
---
import AstroImage from "../../../components/AstroImage.astro";
export const premiereExport = "https://assets.nardu.in/wordpress_8ee6f54b98.jpeg";
export const premiereExport = "https://assets.nardu.in/video-premiere-1.jpeg";
export const handbrakeBase = "https://assets.nardu.in/video-handbrake-1.jpeg";
export const handbrakeVideo = "https://assets.nardu.in/video-handbrake-2.jpeg";
export const handbrakeAudio = "https://assets.nardu.in/video-handbrake-3.jpeg";
export const handbrakeWeb = "https://assets.nardu.in/video-handbrake-4.jpeg";
export const handbrakeWeb = "https://assets.nardu.in/video-handbrake-4.jpg";
## Let's play.
@ -30,12 +30,7 @@ With a good connection, users will not see the difference. But if we go down tha
Let's say we exported​ a 1920x1080 video from Premiere Pro with these basic settings:
<AstroImage
src={premiereExport}
width="673"
height="800"
alt=""
/>
<AstroImage src={premiereExport} width="673" height="800" alt="" />
It's gorgeous, it's Full HD, it's 1:30 minute of excellent editing but it's 50mb… What a shame.
@ -56,12 +51,7 @@ While it's not as nice as Premiere Pro, it has way more exporting capabilities.
1. Check Web Optimized
1. Keep MPEG-4 as the format
<AstroImage
src={handbrakeBase}
width="728"
height="337"
alt=""
/>
<AstroImage src={handbrakeBase} width="728" height="337" alt="" />
### Video screen
@ -70,12 +60,7 @@ While it's not as nice as Premiere Pro, it has way more exporting capabilities.
1. Choose Peak Framerate. If you don't know the framerate, keep the default setting
1. Choose the type of video you are encoding (film, animation…)
<AstroImage
src={handbrakeVideo}
width="728"
height="337"
alt=""
/>
<AstroImage src={handbrakeVideo} width="728" height="337" alt="" />
### Audio screen
@ -86,12 +71,7 @@ If you have an audio channel, these settings are great and will not influence th
1. Samplerate 44.1
1. Bitrate 192 to 256 (your choice)
<AstroImage
src={handbrakeAudio}
width="728"
height="337"
alt=""
/>
<AstroImage src={handbrakeAudio} width="728" height="337" alt="" />
### Export!
@ -112,12 +92,7 @@ Webm is an html video format and VP9 is its latest codec.
Using Handbrake and webm/VP9, we can achieve really great compression without losing too much quality (or none at all depending on the settings). I was able to divide by 4 the size of a video using these presets:
<AstroImage
src={handbrakeWeb}
width="728"
height="313"
alt=""
/>
<AstroImage src={handbrakeWeb} width="728" height="313" alt="" />
The only down side is that it takes some time to encode. It will depend on the video length and your computing power.

3
src/content/articles/fr/after-effects-expressions.md
View File

@ -2,10 +2,11 @@
title: After Effects Expressions
subtitle: En cours de traduction, revenez bientôt ;)
lang: fr
draft: true
slug: "after-effects-expressions"
excerpt: En cours de traduction, revenez bientôt ;)
tags: ["Design"]
createdAt: "2019-04-24T09:00:00.000Z"
---
[Retour aux articles](/articles/)
[Retour aux articles](/articles)

3
src/content/articles/fr/video-compression.md
View File

@ -2,6 +2,7 @@
title: Compression vidéo
subtitle: En cours de traduction, revenez bientôt ;)
lang: fr
draft: true
slug: "video-compression"
excerpt: Pas encore traduit
tags: ["Design"]
@ -9,4 +10,4 @@ createdAt: "2021-05-05T09:00:00.000Z"
updatedAt: "2022-06-08T14:24:06.000Z"
---
[Retour aux articles](/articles/)
[Retour aux articles](/articles)

2
src/content/config.ts
View File

@ -14,6 +14,7 @@ const articles = defineCollection({
.transform((str) => new Date(str))
.optional(),
code: z.boolean().optional() || false,
draft: z.boolean().optional() || false,
},
});
@ -31,6 +32,7 @@ const fragments = defineCollection({
.transform((str) => new Date(str))
.optional(),
code: z.boolean().optional() || false,
draft: z.boolean().optional() || false,
},
});

1
src/content/fragments/en/buttons.md
View File

@ -3,6 +3,7 @@ title: Buttons hover
subtitle: Simple, but nice.
lang: en
slug: "buttons"
draft: true
excerpt: Easy to grab and use hover effects.
tags: ["CSS"]
code: true

3
src/content/fragments/en/image-full.md → src/content/fragments/en/image-full.mdx
View File

@ -2,10 +2,11 @@
title: Full width image
subtitle: Translation in progress, stay tuned ;)
lang: en
draft: true
slug: "image-full"
createdAt: "2020-09-15T09:00:00.000Z"
updatedAt: "2022-06-08T14:24:06.000Z"
tags: ["CSS"]
---
[Go back to available snippets](/en/snippets/)
[Go back to available snippets](/en/snippets)

3
src/content/fragments/fr/array-vs-array.md
View File

@ -2,10 +2,11 @@
title: Filtrer un array avec un autre array
subtitle: En cours de traduction.
lang: fr
draft: true
slug: "array-vs-array"
createdAt: "2022-06-08T14:24:06.000Z"
excerpt: En cours de traduction.
tags: ["nuxt.js"]
---
[Voir les fragments disponibles](/fragments/)
[Voir les fragments disponibles](/fragments)

9
src/content/fragments/fr/buttons.md → src/content/fragments/fr/buttons.mdx
View File

@ -3,6 +3,7 @@ title: "Effets de survol de boutons"
subtitle: "Simples mais efficaces."
lang: fr
slug: "buttons"
draft: true
excerpt: Quelques effets de survol faciles à récupérer et utiliser.
tags: ["CSS"]
code: true
@ -41,7 +42,7 @@ Tous les boutons présents utilisent ces styles comme base en guise de «&nbsp;r
## Ajout d'icône
<button role="none" class="btn btn-icon">
<span>Icône</span>
<span>Icône</span>
</button>
```css
@ -80,7 +81,7 @@ Tous les boutons présents utilisent ces styles comme base en guise de «&nbsp;r
## Double volet
<button role="none" class="btn btn-rideau">
<span>Volet</span>
<span>Volet</span>
</button>
```css
@ -127,7 +128,7 @@ Tous les boutons présents utilisent ces styles comme base en guise de «&nbsp;r
## Dégradé animé
<button role="none" class="btn btn-gradient">
<span>Dégradé</span>
<span>Dégradé</span>
</button>
```css
@ -162,7 +163,7 @@ Tous les boutons présents utilisent ces styles comme base en guise de «&nbsp;r
## Échelle non desctructrice
<button role="none" class="btn btn-scale">
<span>Échelle</span>
<span>Échelle</span>
</button>
```css

0
src/content/fragments/fr/image-full.md → src/content/fragments/fr/image-full.mdx
View File

3
src/content/fragments/fr/toulouse-fun.md
View File

@ -2,10 +2,11 @@
title: Toulouse yourself
subtitle: En cours de traduction.
lang: fr
draft: true
slug: "toulouse-fun"
createdAt: "2022-06-22T15:34:45.000Z"
excerpt: En cours de traduction.
tags: ["lifestyle"]
---
[Voir les fragments disponibles](/fragments/)
[Voir les fragments disponibles](/fragments)

16
src/content/types.generated.d.ts vendored
View File

@ -85,8 +85,8 @@ declare module 'astro:content' {
collection: "articles",
data: InferEntrySchema<"articles">
},
"en/video-compression.md": {
id: "en/video-compression.md",
"en/video-compression.mdx": {
id: "en/video-compression.mdx",
slug: "en/video-compression",
body: string,
collection: "articles",
@ -164,8 +164,8 @@ declare module 'astro:content' {
collection: "fragments",
data: InferEntrySchema<"fragments">
},
"en/image-full.md": {
id: "en/image-full.md",
"en/image-full.mdx": {
id: "en/image-full.mdx",
slug: "en/image-full",
body: string,
collection: "fragments",
@ -206,15 +206,15 @@ declare module 'astro:content' {
collection: "fragments",
data: InferEntrySchema<"fragments">
},
"fr/buttons.md": {
id: "fr/buttons.md",
"fr/buttons.mdx": {
id: "fr/buttons.mdx",
slug: "fr/buttons",
body: string,
collection: "fragments",
data: InferEntrySchema<"fragments">
},
"fr/image-full.md": {
id: "fr/image-full.md",
"fr/image-full.mdx": {
id: "fr/image-full.mdx",
slug: "fr/image-full",
body: string,
collection: "fragments",

2
src/data/HP/en/03-about.md
View File

@ -23,4 +23,4 @@ In order to strengthen my skills, I have completed the following training and ce
I try to contribute to [open source projects](https://git.nardu.in/explore/repos) that I enjoy.
Oh and I write [articles!](/en/articles/) Articles about design and the web in general.
Oh and I write [articles!](/en/articles) Articles about design and the web in general.

2
src/data/HP/fr/03-about.md
View File

@ -23,4 +23,4 @@ Afin de solidifier mes compétences, j'ai suivi les formations et passé les cer
J’essaie de contribuer à des [projets open source](https://git.nardu.in/explore/repos) qui me tiennent à cœur et je m'engage localement avec le collectif [good-it!](https://www.good-it.org/)
Ah et j’écris [des articles](/articles/) aussi&nbsp;! Des articles sur le design, le développement web et l’informatique.
Ah et j’écris [des articles](/articles) aussi&nbsp;! Des articles sur le design, le développement web et l’informatique.

2
src/pages/articles/index.astro
View File

@ -9,7 +9,7 @@ import BaseLayout from "../../layouts/BaseLayout.astro";
import ListCards from "../../components/ListCards.astro";
const localizedPost = await getCollection("articles", ({ data }) => {
return data.lang === astroI18n.langCode;
return data.lang === astroI18n.langCode && !data.draft;
});
// sort articles by descending publication date
const sortedArticles = localizedPost.sort(

7
src/pages/en/sitemap.astro Normal file
View File

@ -0,0 +1,7 @@
---
import Page from "../plan-du-site.astro"
const { props } = Astro
---
<Page {...props} />

2
src/pages/fragments/index.astro
View File

@ -9,7 +9,7 @@ import BaseLayout from "../../layouts/BaseLayout.astro";
import ListCards from "../../components/ListCards.astro";
const localizedPost = await getCollection("fragments", ({ data }) => {
return data.lang === astroI18n.langCode;
return data.lang === astroI18n.langCode && !data.draft;
});
// sort snippets by descending publication date
const sortedPosts = localizedPost.sort(

2
src/pages/i18n/en.json
View File

@ -4,7 +4,7 @@
"quoi": "I design <strong>websites</strong> and <strong>web applications</strong> following <a href='https://www.a11yproject.com/' title='A11y project’s website (new window)' target='_blank' rel='noreferer noopener' >accessibility</a> best practices.",
"comment": "More precisely, I create web and mobile interfaces. From UX to UI, from development to deployment. I put digital accessibility standards, for which I have obtained the <a href='https://directory.opquast.com/fr/certificat/CTQSKP/' title='My Opquast certificate (new window)' target='_blank' rel='noreferer noopener'>Opquast certification</a>, forwards. I also keep <a href='https://en.wikipedia.org/wiki/Ecological_design' title='eco-design definition (new window)' target='_blank' rel='noreferer noopener'>eco-design</a> in mind when working.",
"opensource": "I try to contribute to <a class='u-nice-links' href='https://git.nardu.in/explore/repos' title='Open source projects I worked on (new window)' target='_blank' rel='noreferer noopener'>open source projects</a> that I enjoy.",
"writing": "Oh and I write <a class='u-nice-links' href='/en/articles/'>articles!</a> Articles about design and the web in general.",
"writing": "Oh and I write <a class='u-nice-links' href='/en/articles'>articles!</a> Articles about design and the web in general.",
"latestProjects": "Latest projects",
"latestArticles": "Latest articles",
"allProjects": "All projects",

4
src/pages/i18n/fr.json
View File

@ -1,10 +1,10 @@
{
"title": "Création de <span class='highlight'>sites&nbsp;web</span> <a href='/articles/faq' clean-link>sobres et accessibles</a>",
"title": "Création de <span class='highlight'>sites&nbsp;web</span> <a href='/articlesfaq' clean-link>sobres et accessibles</a>",
"subtitle": "Apprenez-en plus sur…",
"quoi": "Je crée des <strong>sites</strong> et des <strong>applications web</strong> en suivant les bonnes pratiques <a href='https://access42.net/decouvrir-accessibilite' title='Définition selon Access42 (nouvelle fenêtre)' target='_blank' rel='noreferer noopener' >d’accessibilités</a>.",
"comment": "Plus précisément, je crée des interfaces web et mobiles. De l’ergonomie jusqu’au design final, de l’intégration jusqu’à la mise en ligne. Je mets en avant les standards d’accessibilité numérique, pour lesquels j’ai obtenu la <a href='https://directory.opquast.com/fr/certificat/CTQSKP/' title='Certificat Opquast personnel (nouvelle fenêtre)' target='_blank' rel='noreferer noopener'>certification Opquast</a>. Je m’inscris également dans une démarche <a href='https://www.ademe.fr/expertises/consommer-autrement/passer-a-laction/ameliorer-pratiques/lecoconception' title='Définition de l’ADEME (nouvelle fenêtre)' rel='noopener noreferer'>d’éco-conception</a> des services que je propose.",
"opensource": "J’essaie de contribuer à des <a href='https://git.nardu.in/explore/repos' title='Projets sur lesquels j’ai travaillé (nouvelle fenêtre)' target='_blank' rel='noreferer noopener'>projets open source</a> qui me tiennent à cœur.",
"writing": "Ah et j’écris <a href='/articles/'>des articles</a> aussi&nbsp;! Des articles sur le graphisme et l’informatique.",
"writing": "Ah et j’écris <a href='/articles'>des articles</a> aussi&nbsp;! Des articles sur le graphisme et l’informatique.",
"latestProjects": "Derniers projets",
"latestArticles": "Derniers articles",
"allProjects": "Tous les projets",

4
src/pages/index.astro
View File

@ -21,7 +21,7 @@ const localizedSections = allSections.filter((section) => {
import { getCollection } from "astro:content";
// Only return posts with correct lang in the frontmatter
const localizedArticles = await getCollection("articles", ({ data }) => {
return data.lang === astroI18n.langCode;
return data.lang === astroI18n.langCode && !data.draft;
});
// sort articles by descending publication date
const sortedArticles = localizedArticles.sort(
@ -29,7 +29,7 @@ const sortedArticles = localizedArticles.sort(
);
// Only return snippets with correct lang in the frontmatter
const localizedSnippets = await getCollection("fragments", ({ data }) => {
return data.lang === astroI18n.langCode;
return data.lang === astroI18n.langCode && !data.draft;
});
// sort articles by descending publication date
const sortedSnippets = localizedSnippets.sort(

82
src/pages/plan-du-site.astro Normal file
View File

@ -0,0 +1,82 @@
---
// init i18n
import { l, t, astroI18n } from "astro-i18n";
astroI18n.init(Astro);
import BaseLayout from "../layouts/BaseLayout.astro";
// New astro content collections
import { getCollection } from "astro:content";
// get all articles
const localizedArticles = await getCollection("articles", ({ data }) => {
return data.lang === astroI18n.langCode && !data.draft;
});
// get all snippets
const localizedFragments = await getCollection("fragments", ({ data }) => {
return data.lang === astroI18n.langCode && !data.draft;
});
const pageTitle = t("sitemap");
---
<BaseLayout pageTitle={pageTitle}>
<section class="region">
<h1>{t("sitemap")}</h1>
<ul class="flow sitemap" role="list">
<li>
<h2>
<a href={l("/")}>{t("accueil")}</a>
</h2>
</li>
<li>
<h2>
<a href={l("/articles")}>{t("article.titre")}</a>
</h2>
<ul>
{
localizedArticles.map((article) => (
<li>
<a href={l("/articles/[slug]", { slug: article.data.slug })}>
{article.data.title}
</a>
</li>
))
}
</ul>
</li>
<li>
<h2>
<a href={l("/fragments")}>{t("fragments.titre")}</a>
</h2>
<ul>
{
localizedFragments.map((fragment) => (
<li>
<a href={l("/fragments/[slug]", { slug: fragment.data.slug })}>
{fragment.data.title}
</a>
</li>
))
}
</ul>
</li>
</ul>
</section>
</BaseLayout>
<style>
/* :link {
text-decoration: underline;
}
:link:hover {
text-decoration: none;
} */
h2 {
text-transform: capitalize;
}
.sitemap * + * {
margin-block-start: 20px;
}
</style>

129
src/styles/editorial/buttons.css Normal file
View File

@ -0,0 +1,129 @@
.btn {
padding: 12px 26px;
position: relative;
display: inline-block;
overflow: hidden;
cursor: pointer;
color: white;
border: none;
background-color: transparent;
transition: background-color 0.3s ease;
}
.btn-icon {
background-color: hotpink;
}
.btn-icon::before {
content: url('~assets/svg/arrow-right-white.svg');
position: absolute;
width: 20px;
top: 50%;
right: 0;
transform: translate(40px, -50%);
transition: transform ease 0.3s;
}
.btn-icon:hover,
.btn-icon:focus {
background-color: darkorchid;
}
.btn-icon:hover::before,
.btn-icon:focus::before {
transform: translate(-10px, -50%);
}
.btn-icon > span {
display: inline-block;
width: 100%;
height: 100%;
transition: transform 0.3s ease;
}
.btn-icon:hover > span,
.btn-icon:focus > span {
transform: translateX(-10px);
}
.btn-rideau {
border: 2px solid var(--dark);
color: var(--dark);
background-color: transparent;
transition: color 0.3s ease, border-color 0.3s ease;
}
.btn-rideau:hover {
color: white;
border-color: darkorchid;
}
.btn-rideau::before {
background: hotpink;
}
.btn-rideau::after {
background: darkorchid;
}
.btn-rideau::before,
.btn-rideau::after {
content: '';
position: absolute;
height: 100%;
width: 100%;
bottom: 100%;
left: 0;
z-index: -1;
transition: transform 0.3s;
transition-timing-function: ease;
transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.btn-rideau:hover::before,
.btn-rideau:hover::after,
.btn-rideau:focus::before,
.btn-rideau:focus::after {
transform: translateY(100%);
}
.btn-rideau:hover::after,
.btn-rideau:focus::after {
transition-delay: 0.175s;
}
.btn-gradient {
background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
background-size: 400% 400%;
background-position: 0% 50%;
animation: GradientReverse 0.5s ease 1 normal forwards;
}
.btn-gradient:hover,
.btn-gradient:focus {
animation: Gradient 0.5s ease 1 normal forwards;
}
@keyframes Gradient {
0% {
background-position: 0% 50%;
}
100% {
background-position: 100% 100%;
}
}
@keyframes GradientReverse {
0% {
background-position: 100% 100%;
}
100% {
background-position: 0% 50%;
}
}
.btn-scale {
overflow: visible;
color: #10113a;
background-color: transparent;
}
.btn-scale::after {
content: '';
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 100%;
border: 2px solid #10113a;
border-radius: 2px;
transition: transform 0.3s ease;
}
.btn-scale:hover::after,
.btn-scale:focus::after {
transform: scale(1.1);
}