109 changed files with 2154 additions and 3499 deletions
--- a/.astro-i18n/generated.d.ts
+++ b/.astro-i18n/generated.d.ts
@ -1,21 +1,19 @@
 type DefaultLangCode = "fr"
 type SupportedLangCode = "en"
 type LangCode = DefaultLangCode | SupportedLangCode
-type RouteUri = | "/articles/[slug]" | "/articles" | "/agments/[slug]" | "/agments" | "/references" | "/veille" | "/" | "/plan-du-site" 
-type RouteParams = {"/articles/[slug]": { "slug": string; }; "/articles": undefined; "/agments/[slug]": { "slug": string; }; "/agments": undefined; "/references": undefined; "/veille": 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" | "references.titre" | "references.slug" | "references.cta" | "references.tagline" | "veille.titre" | "veille.tagline" | "erreur.introuvable" | "erreur.autre" | "erreur.lienRetour" | "seo.meta.description" | "seo.article.title" | "seo.article.description" | "seo.code.title" | "seo.code.description" | "seo.references.title" | "seo.references.description" | "index.articles.pageName" | "index.articles.subtitle" | "index.fragments.pageName" | "index.fragments.subtitle" | "index.references.pageName" | "index.references.subtitle" | "index.veille.pageName" | "index.veille.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; "references.titre": {} | undefined; "references.slug": {} | undefined; "references.cta": {} | undefined; "references.tagline": {} | undefined; "veille.titre": {} | undefined; "veille.tagline": {} | undefined; "erreur.introuvable": {} | undefined; "erreur.autre": {} | undefined; "erreur.lienRetour": {} | undefined; "seo.meta.description": {} | undefined; "seo.article.title": {} | undefined; "seo.article.description": {} | undefined; "seo.code.title": {} | undefined; "seo.code.description": {} | undefined; "seo.references.title": {} | undefined; "seo.references.description": {} | undefined; "index.articles.pageName": {} | undefined; "index.articles.subtitle": {} | undefined; "index.fragments.pageName": {} | undefined; "index.fragments.subtitle": {} | undefined; "index.references.pageName": {} | undefined; "index.references.subtitle": {} | undefined; "index.veille.pageName": {} | undefined; "index.veille.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; }
+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; }

 declare module "astro-i18n" {
 	export * from "astro-i18n/"
 	
 	export function l<Uri extends RouteUri>(
 		route: Uri | string & {},
-		...args: Uri extends keyof RouteParams
-			? undefined extends RouteParams[Uri]
-				? [params?: Record<string, string>, targetLangCode?: LangCode, routeLangCode?: LangCode]
-				: [params: RouteParams[Uri], targetLangCode?: LangCode, routeLangCode?: LangCode]
-			: [params?: Record<string, string>, targetLangCode?: LangCode, routeLangCode?: LangCode]
+		...args: keyof RouteParams extends Uri
+			? [params?: Record<string, string>, targetLangCode?: LangCode, routeLangCode?: LangCode]
+			: [params: RouteParams[Uri], targetLangCode?: LangCode, routeLangCode?: LangCode]
 	): string
 	
 	export function t<Path extends TranslationPath>(
--- a/.astro/types.d.ts
+++ b/.astro/types.d.ts
@ -1,483 +1,273 @@
-declare module 'astro:content' {
-	interface Render {
-		'.mdx': Promise<{
-			Content: import('astro').MarkdownInstance<{}>['Content'];
-			headings: import('astro').MarkdownHeading[];
-			remarkPluginFrontmatter: Record<string, any>;
-		}>;
-	}
-}
-
-declare module 'astro:content' {
-	interface Render {
-		'.md': Promise<{
-			Content: import('astro').MarkdownInstance<{}>['Content'];
-			headings: import('astro').MarkdownHeading[];
-			remarkPluginFrontmatter: Record<string, any>;
-		}>;
-	}
-}
-
 declare module 'astro:content' {
 	export { z } from 'astro/zod';
-
-	type Flatten<T> = T extends { [K: string]: infer U } ? U : never;
-
-	export type CollectionKey = keyof AnyEntryMap;
-	export type CollectionEntry<C extends CollectionKey> = Flatten<AnyEntryMap[C]>;
-
-	export type ContentCollectionKey = keyof ContentEntryMap;
-	export type DataCollectionKey = keyof DataEntryMap;
-
-	// This needs to be in sync with ImageMetadata
-	export type ImageFunction = () => import('astro/zod').ZodObject<{
-		src: import('astro/zod').ZodString;
-		width: import('astro/zod').ZodNumber;
-		height: import('astro/zod').ZodNumber;
-		format: import('astro/zod').ZodUnion<
-			[
-				import('astro/zod').ZodLiteral<'png'>,
-				import('astro/zod').ZodLiteral<'jpg'>,
-				import('astro/zod').ZodLiteral<'jpeg'>,
-				import('astro/zod').ZodLiteral<'tiff'>,
-				import('astro/zod').ZodLiteral<'webp'>,
-				import('astro/zod').ZodLiteral<'gif'>,
-				import('astro/zod').ZodLiteral<'svg'>,
-				import('astro/zod').ZodLiteral<'avif'>,
-			]
-		>;
-	}>;
+	export type CollectionEntry<C extends keyof typeof entryMap> =
+		(typeof entryMap)[C][keyof (typeof entryMap)[C]] & Render;

 	type BaseSchemaWithoutEffects =
 		| import('astro/zod').AnyZodObject
-		| import('astro/zod').ZodUnion<[BaseSchemaWithoutEffects, ...BaseSchemaWithoutEffects[]]>
+		| import('astro/zod').ZodUnion<import('astro/zod').AnyZodObject[]>
 		| import('astro/zod').ZodDiscriminatedUnion<string, import('astro/zod').AnyZodObject[]>
-		| import('astro/zod').ZodIntersection<BaseSchemaWithoutEffects, BaseSchemaWithoutEffects>;
+		| import('astro/zod').ZodIntersection<
+				import('astro/zod').AnyZodObject,
+				import('astro/zod').AnyZodObject
+		  >;

 	type BaseSchema =
 		| BaseSchemaWithoutEffects
 		| import('astro/zod').ZodEffects<BaseSchemaWithoutEffects>;

-	export type SchemaContext = { image: ImageFunction };
-
-	type DataCollectionConfig<S extends BaseSchema> = {
-		type: 'data';
-		schema?: S | ((context: SchemaContext) => S);
+	type BaseCollectionConfig<S extends BaseSchema> = {
+		schema?: S;
+		slug?: (entry: {
+			id: CollectionEntry<keyof typeof entryMap>['id'];
+			defaultSlug: string;
+			collection: string;
+			body: string;
+			data: import('astro/zod').infer<S>;
+		}) => string | Promise<string>;
 	};
-
-	type ContentCollectionConfig<S extends BaseSchema> = {
-		type?: 'content';
-		schema?: S | ((context: SchemaContext) => S);
-	};
-
-	type CollectionConfig<S> = ContentCollectionConfig<S> | DataCollectionConfig<S>;
-
 	export function defineCollection<S extends BaseSchema>(
-		input: CollectionConfig<S>
-	): CollectionConfig<S>;
+		input: BaseCollectionConfig<S>
+	): BaseCollectionConfig<S>;

+	type EntryMapKeys = keyof typeof entryMap;
 	type AllValuesOf<T> = T extends any ? T[keyof T] : never;
-	type ValidContentEntrySlug<C extends keyof ContentEntryMap> = AllValuesOf<
-		ContentEntryMap[C]
-	>['slug'];
+	type ValidEntrySlug<C extends EntryMapKeys> = AllValuesOf<(typeof entryMap)[C]>['slug'];

 	export function getEntryBySlug<
-		C extends keyof ContentEntryMap,
-		E extends ValidContentEntrySlug<C> | (string & {}),
+		C extends keyof typeof entryMap,
+		E extends ValidEntrySlug<C> | (string & {})
 	>(
 		collection: C,
 		// Note that this has to accept a regular string too, for SSR
 		entrySlug: E
-	): E extends ValidContentEntrySlug<C>
+	): E extends ValidEntrySlug<C>
 		? Promise<CollectionEntry<C>>
 		: Promise<CollectionEntry<C> | undefined>;
-
-	export function getDataEntryById<C extends keyof DataEntryMap, E extends keyof DataEntryMap[C]>(
-		collection: C,
-		entryId: E
-	): Promise<CollectionEntry<C>>;
-
-	export function getCollection<C extends keyof AnyEntryMap, E extends CollectionEntry<C>>(
+	export function getCollection<C extends keyof typeof entryMap, E extends CollectionEntry<C>>(
 		collection: C,
 		filter?: (entry: CollectionEntry<C>) => entry is E
 	): Promise<E[]>;
-	export function getCollection<C extends keyof AnyEntryMap>(
+	export function getCollection<C extends keyof typeof entryMap>(
 		collection: C,
 		filter?: (entry: CollectionEntry<C>) => unknown
 	): Promise<CollectionEntry<C>[]>;

-	export function getEntry<
-		C extends keyof ContentEntryMap,
-		E extends ValidContentEntrySlug<C> | (string & {}),
-	>(entry: {
-		collection: C;
-		slug: E;
-	}): E extends ValidContentEntrySlug<C>
-		? Promise<CollectionEntry<C>>
-		: Promise<CollectionEntry<C> | undefined>;
-	export function getEntry<
-		C extends keyof DataEntryMap,
-		E extends keyof DataEntryMap[C] | (string & {}),
-	>(entry: {
-		collection: C;
-		id: E;
-	}): E extends keyof DataEntryMap[C]
-		? Promise<DataEntryMap[C][E]>
-		: Promise<CollectionEntry<C> | undefined>;
-	export function getEntry<
-		C extends keyof ContentEntryMap,
-		E extends ValidContentEntrySlug<C> | (string & {}),
-	>(
-		collection: C,
-		slug: E
-	): E extends ValidContentEntrySlug<C>
-		? Promise<CollectionEntry<C>>
-		: Promise<CollectionEntry<C> | undefined>;
-	export function getEntry<
-		C extends keyof DataEntryMap,
-		E extends keyof DataEntryMap[C] | (string & {}),
-	>(
-		collection: C,
-		id: E
-	): E extends keyof DataEntryMap[C]
-		? Promise<DataEntryMap[C][E]>
-		: Promise<CollectionEntry<C> | undefined>;
-
-	/** Resolve an array of entry references from the same collection */
-	export function getEntries<C extends keyof ContentEntryMap>(
-		entries: {
-			collection: C;
-			slug: ValidContentEntrySlug<C>;
-		}[]
-	): Promise<CollectionEntry<C>[]>;
-	export function getEntries<C extends keyof DataEntryMap>(
-		entries: {
-			collection: C;
-			id: keyof DataEntryMap[C];
-		}[]
-	): Promise<CollectionEntry<C>[]>;
-
-	export function reference<C extends keyof AnyEntryMap>(
-		collection: C
-	): import('astro/zod').ZodEffects<
-		import('astro/zod').ZodString,
-		C extends keyof ContentEntryMap
-			? {
-					collection: C;
-					slug: ValidContentEntrySlug<C>;
-			  }
-			: {
-					collection: C;
-					id: keyof DataEntryMap[C];
-			  }
-	>;
-	// Allow generic `string` to avoid excessive type errors in the config
-	// if `dev` is not running to update as you edit.
-	// Invalid collection names will be caught at build time.
-	export function reference<C extends string>(
-		collection: C
-	): import('astro/zod').ZodEffects<import('astro/zod').ZodString, never>;
-
-	type ReturnTypeOrOriginal<T> = T extends (...args: any[]) => infer R ? R : T;
-	type InferEntrySchema<C extends keyof AnyEntryMap> = import('astro/zod').infer<
-		ReturnTypeOrOriginal<Required<ContentConfig['collections'][C]>['schema']>
+	type InferEntrySchema<C extends keyof typeof entryMap> = import('astro/zod').infer<
+		Required<ContentConfig['collections'][C]>['schema']
 	>;

-	type ContentEntryMap = {
+	type Render = {
+		render(): Promise<{
+			Content: import('astro').MarkdownInstance<{}>['Content'];
+			headings: import('astro').MarkdownHeading[];
+			remarkPluginFrontmatter: Record<string, any>;
+		}>;
+	};
+
+	const entryMap: {
 		"articles": {
 "en/2022.md": {
-	id: "en/2022.md";
-  slug: "en/2022";
-  body: string;
-  collection: "articles";
+  id: "en/2022.md",
+  slug: "2022",
+  body: string,
+  collection: "articles",
  data: InferEntrySchema<"articles">
-} & { render(): Render[".md"] };
-"en/2023.md": {
-	id: "en/2023.md";
-  slug: "en/2023";
-  body: string;
-  collection: "articles";
-  data: InferEntrySchema<"articles">
-} & { render(): Render[".md"] };
+},
 "en/after-effects-expressions.mdx": {
-	id: "en/after-effects-expressions.mdx";
-  slug: "en/after-effects-expressions";
-  body: string;
-  collection: "articles";
+  id: "en/after-effects-expressions.mdx",
+  slug: "after-effects-expressions",
+  body: string,
+  collection: "articles",
  data: InferEntrySchema<"articles">
-} & { render(): Render[".mdx"] };
+},
 "en/faq.md": {
-	id: "en/faq.md";
-  slug: "en/faq";
-  body: string;
-  collection: "articles";
+  id: "en/faq.md",
+  slug: "faq",
+  body: string,
+  collection: "articles",
  data: InferEntrySchema<"articles">
-} & { render(): Render[".md"] };
+},
 "en/gratuiste.md": {
-	id: "en/gratuiste.md";
-  slug: "en/gratuiste";
-  body: string;
-  collection: "articles";
+  id: "en/gratuiste.md",
+  slug: "gratuiste",
+  body: string,
+  collection: "articles",
  data: InferEntrySchema<"articles">
-} & { render(): Render[".md"] };
+},
 "en/sci-hub-blocage.mdx": {
-	id: "en/sci-hub-blocage.mdx";
-  slug: "en/sci-hub-blocage";
-  body: string;
-  collection: "articles";
+  id: "en/sci-hub-blocage.mdx",
+  slug: "sci-hub-unblock",
+  body: string,
+  collection: "articles",
  data: InferEntrySchema<"articles">
-} & { render(): Render[".mdx"] };
+},
 "en/the-day-I-jamd.mdx": {
-	id: "en/the-day-I-jamd.mdx";
-  slug: "en/the-day-i-jamd";
-  body: string;
-  collection: "articles";
+  id: "en/the-day-I-jamd.mdx",
+  slug: "the-day-I-jamd",
+  body: string,
+  collection: "articles",
  data: InferEntrySchema<"articles">
-} & { render(): Render[".mdx"] };
+},
 "en/video-compression.mdx": {
-	id: "en/video-compression.mdx";
-  slug: "en/video-compression";
-  body: string;
-  collection: "articles";
+  id: "en/video-compression.mdx",
+  slug: "video-compression",
+  body: string,
+  collection: "articles",
  data: InferEntrySchema<"articles">
-} & { render(): Render[".mdx"] };
+},
 "fr/2022.md": {
-	id: "fr/2022.md";
-  slug: "fr/2022";
-  body: string;
-  collection: "articles";
+  id: "fr/2022.md",
+  slug: "2022",
+  body: string,
+  collection: "articles",
  data: InferEntrySchema<"articles">
-} & { render(): Render[".md"] };
-"fr/2023.md": {
-	id: "fr/2023.md";
-  slug: "fr/2023";
-  body: string;
-  collection: "articles";
-  data: InferEntrySchema<"articles">
-} & { render(): Render[".md"] };
+},
 "fr/after-effects-expressions.md": {
-	id: "fr/after-effects-expressions.md";
-  slug: "fr/after-effects-expressions";
-  body: string;
-  collection: "articles";
+  id: "fr/after-effects-expressions.md",
+  slug: "after-effects-expressions",
+  body: string,
+  collection: "articles",
  data: InferEntrySchema<"articles">
-} & { render(): Render[".md"] };
+},
 "fr/faq.md": {
-	id: "fr/faq.md";
-  slug: "fr/faq";
-  body: string;
-  collection: "articles";
+  id: "fr/faq.md",
+  slug: "faq",
+  body: string,
+  collection: "articles",
  data: InferEntrySchema<"articles">
-} & { render(): Render[".md"] };
+},
 "fr/gratuiste.md": {
-	id: "fr/gratuiste.md";
-  slug: "fr/gratuiste";
-  body: string;
-  collection: "articles";
+  id: "fr/gratuiste.md",
+  slug: "gratuiste",
+  body: string,
+  collection: "articles",
  data: InferEntrySchema<"articles">
-} & { render(): Render[".md"] };
+},
 "fr/sci-hub-blocage.mdx": {
-	id: "fr/sci-hub-blocage.mdx";
-  slug: "fr/sci-hub-blocage";
-  body: string;
-  collection: "articles";
+  id: "fr/sci-hub-blocage.mdx",
+  slug: "sci-hub-blocage",
+  body: string,
+  collection: "articles",
  data: InferEntrySchema<"articles">
-} & { render(): Render[".mdx"] };
+},
 "fr/the-day-I-jamd.mdx": {
-	id: "fr/the-day-I-jamd.mdx";
-  slug: "fr/the-day-i-jamd";
-  body: string;
-  collection: "articles";
+  id: "fr/the-day-I-jamd.mdx",
+  slug: "the-day-I-jamd",
+  body: string,
+  collection: "articles",
  data: InferEntrySchema<"articles">
-} & { render(): Render[".mdx"] };
+},
 "fr/video-compression.md": {
-	id: "fr/video-compression.md";
-  slug: "fr/video-compression";
-  body: string;
-  collection: "articles";
+  id: "fr/video-compression.md",
+  slug: "video-compression",
+  body: string,
+  collection: "articles",
  data: InferEntrySchema<"articles">
-} & { render(): Render[".md"] };
-};
+},
+},
 "fragments": {
 "en/acme-sh-tls-cert.md": {
-	id: "en/acme-sh-tls-cert.md";
-  slug: "en/acme-sh-tls-cert";
-  body: string;
-  collection: "fragments";
+  id: "en/acme-sh-tls-cert.md",
+  slug: "acme-sh-tls-cert",
+  body: string,
+  collection: "fragments",
  data: InferEntrySchema<"fragments">
-} & { render(): Render[".md"] };
+},
 "en/array-vs-array.md": {
-	id: "en/array-vs-array.md";
-  slug: "en/array-vs-array";
-  body: string;
-  collection: "fragments";
+  id: "en/array-vs-array.md",
+  slug: "array-vs-array",
+  body: string,
+  collection: "fragments",
  data: InferEntrySchema<"fragments">
-} & { render(): Render[".md"] };
+},
 "en/buttons.md": {
-	id: "en/buttons.md";
-  slug: "en/buttons";
-  body: string;
-  collection: "fragments";
+  id: "en/buttons.md",
+  slug: "buttons",
+  body: string,
+  collection: "fragments",
  data: InferEntrySchema<"fragments">
-} & { render(): Render[".md"] };
+},
 "en/image-full.mdx": {
-	id: "en/image-full.mdx";
-  slug: "en/image-full";
-  body: string;
-  collection: "fragments";
+  id: "en/image-full.mdx",
+  slug: "image-full",
+  body: string,
+  collection: "fragments",
  data: InferEntrySchema<"fragments">
-} & { render(): Render[".mdx"] };
+},
 "en/nuxt-graphql-static.md": {
-	id: "en/nuxt-graphql-static.md";
-  slug: "en/nuxt-graphql-static";
-  body: string;
-  collection: "fragments";
+  id: "en/nuxt-graphql-static.md",
+  slug: "nuxt-graphql-static",
+  body: string,
+  collection: "fragments",
  data: InferEntrySchema<"fragments">
-} & { render(): Render[".md"] };
-"en/super-cookies.mdx": {
-	id: "en/super-cookies.mdx";
-  slug: "en/super-cookies";
-  body: string;
-  collection: "fragments";
+},
+"en/super-cookies.md": {
+  id: "en/super-cookies.md",
+  slug: "super-cookies",
+  body: string,
+  collection: "fragments",
  data: InferEntrySchema<"fragments">
-} & { render(): Render[".mdx"] };
+},
 "en/toulouse-fun.md": {
-	id: "en/toulouse-fun.md";
-  slug: "en/toulouse-fun";
-  body: string;
-  collection: "fragments";
+  id: "en/toulouse-fun.md",
+  slug: "toulouse-fun",
+  body: string,
+  collection: "fragments",
  data: InferEntrySchema<"fragments">
-} & { render(): Render[".md"] };
-"en/visited-links.md": {
-	id: "en/visited-links.md";
-  slug: "en/visited-links";
-  body: string;
-  collection: "fragments";
-  data: InferEntrySchema<"fragments">
-} & { render(): Render[".md"] };
+},
 "fr/acme-sh-tls-cert.md": {
-	id: "fr/acme-sh-tls-cert.md";
-  slug: "fr/acme-sh-tls-cert";
-  body: string;
-  collection: "fragments";
+  id: "fr/acme-sh-tls-cert.md",
+  slug: "acme-sh-tls-cert",
+  body: string,
+  collection: "fragments",
  data: InferEntrySchema<"fragments">
-} & { render(): Render[".md"] };
+},
 "fr/array-vs-array.md": {
-	id: "fr/array-vs-array.md";
-  slug: "fr/array-vs-array";
-  body: string;
-  collection: "fragments";
+  id: "fr/array-vs-array.md",
+  slug: "array-vs-array",
+  body: string,
+  collection: "fragments",
  data: InferEntrySchema<"fragments">
-} & { render(): Render[".md"] };
+},
 "fr/buttons.mdx": {
-	id: "fr/buttons.mdx";
-  slug: "fr/buttons";
-  body: string;
-  collection: "fragments";
+  id: "fr/buttons.mdx",
+  slug: "buttons",
+  body: string,
+  collection: "fragments",
  data: InferEntrySchema<"fragments">
-} & { render(): Render[".mdx"] };
+},
 "fr/image-full.mdx": {
-	id: "fr/image-full.mdx";
-  slug: "fr/image-full";
-  body: string;
-  collection: "fragments";
+  id: "fr/image-full.mdx",
+  slug: "image-full",
+  body: string,
+  collection: "fragments",
  data: InferEntrySchema<"fragments">
-} & { render(): Render[".mdx"] };
+},
 "fr/nuxt-graphql-static.md": {
-	id: "fr/nuxt-graphql-static.md";
-  slug: "fr/nuxt-graphql-static";
-  body: string;
-  collection: "fragments";
+  id: "fr/nuxt-graphql-static.md",
+  slug: "nuxt-graphql-static",
+  body: string,
+  collection: "fragments",
  data: InferEntrySchema<"fragments">
-} & { render(): Render[".md"] };
-"fr/super-cookies.mdx": {
-	id: "fr/super-cookies.mdx";
-  slug: "fr/super-cookies";
-  body: string;
-  collection: "fragments";
+},
+"fr/super-cookies.md": {
+  id: "fr/super-cookies.md",
+  slug: "super-cookies",
+  body: string,
+  collection: "fragments",
  data: InferEntrySchema<"fragments">
-} & { render(): Render[".mdx"] };
+},
 "fr/toulouse-fun.md": {
-	id: "fr/toulouse-fun.md";
-  slug: "fr/toulouse-fun";
-  body: string;
-  collection: "fragments";
+  id: "fr/toulouse-fun.md",
+  slug: "toulouse-fun",
+  body: string,
+  collection: "fragments",
  data: InferEntrySchema<"fragments">
-} & { render(): Render[".md"] };
-"fr/visited-links.md": {
-	id: "fr/visited-links.md";
-  slug: "fr/visited-links";
-  body: string;
-  collection: "fragments";
-  data: InferEntrySchema<"fragments">
-} & { render(): Render[".md"] };
-};
-"references": {
-"en/3w.md": {
-	id: "en/3w.md";
-  slug: "en/3w";
-  body: string;
-  collection: "references";
-  data: InferEntrySchema<"references">
-} & { render(): Render[".md"] };
-"en/natureo.md": {
-	id: "en/natureo.md";
-  slug: "en/natureo";
-  body: string;
-  collection: "references";
-  data: InferEntrySchema<"references">
-} & { render(): Render[".md"] };
-"en/parole-expression.md": {
-	id: "en/parole-expression.md";
-  slug: "en/parole-expression";
-  body: string;
-  collection: "references";
-  data: InferEntrySchema<"references">
-} & { render(): Render[".md"] };
-"en/rose-primaire.md": {
-	id: "en/rose-primaire.md";
-  slug: "en/rose-primaire";
-  body: string;
-  collection: "references";
-  data: InferEntrySchema<"references">
-} & { render(): Render[".md"] };
-"fr/3w.md": {
-	id: "fr/3w.md";
-  slug: "fr/3w";
-  body: string;
-  collection: "references";
-  data: InferEntrySchema<"references">
-} & { render(): Render[".md"] };
-"fr/natureo.md": {
-	id: "fr/natureo.md";
-  slug: "fr/natureo";
-  body: string;
-  collection: "references";
-  data: InferEntrySchema<"references">
-} & { render(): Render[".md"] };
-"fr/parole-expression.md": {
-	id: "fr/parole-expression.md";
-  slug: "fr/parole-expression";
-  body: string;
-  collection: "references";
-  data: InferEntrySchema<"references">
-} & { render(): Render[".md"] };
-"fr/rose-primaire.md": {
-	id: "fr/rose-primaire.md";
-  slug: "fr/rose-primaire";
-  body: string;
-  collection: "references";
-  data: InferEntrySchema<"references">
-} & { render(): Render[".md"] };
-};
+},
+},

 	};

-	type DataEntryMap = {
-		
-	};
-
-	type AnyEntryMap = ContentEntryMap & DataEntryMap;
-
 	type ContentConfig = typeof import("../src/content/config");
 }
--- a/astro.config.mjs
+++ b/astro.config.mjs
@ -4,21 +4,19 @@ import { defineConfig } from "astro/config";
 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",
-	image: {
-		domains: ["assets.nardu.in"],
-		remotePatterns: [{ protocol: "https" }],
-	},
 	markdown: {
 		syntaxHighlight: "prism",
 	},
 	integrations: [
 		i18n(),
+		image(),
 		mdx(),
 		sitemap({
 			i18n: {
--- a/astro.i18n.config.ts
+++ b/astro.i18n.config.ts
@ -4,7 +4,6 @@ export default defineAstroI18nConfig({
 	defaultLangCode: "fr",
 	supportedLangCodes: ["en"],
 	showDefaultLangCode: false,
-	trailingSlash: "never",
 	translations: {
 		fr: "src/i18n/fr.json",
 		en: "src/i18n/en.json",
@ -14,7 +13,6 @@ export default defineAstroI18nConfig({
 			"sci-hub-blocage": "sci-hub-unblock",
 			fragments: "snippets",
 			"plan-du-site": "sitemap",
-			references: "work",
 		},
 	},
 });
--- a/package.json
+++ b/package.json
@ -13,15 +13,17 @@
 		"i18n:sync": "astro-i18n sync"
 	},
 	"dependencies": {
-		"@astrojs/mdx": "^1.1.0",
-		"@astrojs/rss": "^3.0.0",
-		"@astrojs/sitemap": "^3.0.0",
-		"astro": "3.1.1",
-		"astro-i18n": "1.8.1",
-		"sharp": "^0.32.6"
+		"@astrojs/image": "^0.14.0",
+		"@astrojs/mdx": "^0.16.0",
+		"@astrojs/sitemap": "^1.0.1",
+		"astro": "2.0.6",
+		"astro-i18n": "^1.6.4"
 	},
 	"devDependencies": {
 		"autoprefixer": "^10.4.13",
 		"postcss": "^8.4.20"
+	},
+	"engines": {
+		"node": "16.19.0"
 	}
 }
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/public/assets/images/home/offre-1.2.svg
+++ b/public/assets/images/home/offre-1.2.svg
@ -1,20 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" clip-rule="evenodd" viewBox="0 0 400 479">
-  <path fill="none" d="M0 0h400v478.049H0z"/>
-  <clipPath id="a">
-    <path d="M0 0h400v478.049H0z"/>
-  </clipPath>
-  <g clip-path="url(#a)">
-    <path fill="#162e57" d="M29.269 268.293h29.268v209.756H29.269zm39.024 0h29.268v209.756H68.293z"/>
-    <path fill="#ff826c" d="M43.903 29.268h43.902v53.659H43.903zm0-29.268h58.537v29.268H43.903z"/>
-    <path fill="#d4ebf2" d="M0 82.927h43.903v185.366H0z"/>
-    <path fill="#d4ebf2" fill-rule="nonzero" d="M165.854 175.6v-24.39h-29.268v-29.27h-24.39V82.917h-24.39v185.376h24.39V175.6h24.39v29.278h48.78V175.6h-19.512Z"/>
-    <path fill="#ff826c" d="M43.903 82.927h43.902v185.366H43.903zM9.415 258.536h29.61v34.147H9.415z"/>
-    <path fill="#162e57" d="M360.976 478.039h-29.268V268.283h29.268zm-39.024 0h-29.269V268.283h29.269z"/>
-    <path fill="#ff826c" d="M346.342 82.917H302.44V9.747h43.902z"/>
-    <path fill="#ff826c" fill-rule="nonzero" d="M400 121.941h-9.756V82.917H278.05v39.024h-24.39v29.269h-29.268v24.39H204.88v29.278h48.78V175.6h24.39v92.693h112.195v-14.635h9.757V121.941Z"/>
-    <path fill="#ff826c" d="M400 292.673h-29.61v-39.024H400zm-200-73.171h-29.268v-29.268h29.269z"/>
-    <path fill="#d4ebf2" d="M321.952 199.56h-14.498V82.918h14.498z"/>
-    <path fill="#162e57" d="M346.342 48.77h-24.39V24.38h24.39z"/>
-    <path fill="#ff826c" fill-rule="nonzero" d="M214.635 190.234h-34.147v9.756H200v19.522h14.635v-29.278Z"/>
-  </g>
-</svg>
--- a/public/assets/images/home/offre-1.3.svg
+++ b/public/assets/images/home/offre-1.3.svg
@ -1,24 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" clip-rule="evenodd" viewBox="0 0 547 260">
-  <g transform="translate(-176.96 -424.18)">
-    <path fill="none" d="M176.96 424.18h546.08v260H176.96z"/>
-    <clipPath id="a">
-      <path d="M176.96 424.18h546.08v260H176.96z"/>
-    </clipPath>
-    <g clip-path="url(#a)">
-      <path fill="#ff826c" fill-rule="nonzero" d="M699 439.36h-15v15h-10v-15h-15v15h-10v-15h-15v35h10v15h45v-15h10v-35Z"/>
-      <path fill="#d4ebf2" fill-rule="nonzero" d="M674 539.36v-50h-15v20h-15v20h15v65h15v-30h20v-25h-20Z"/>
-      <path fill="#ff826c" fill-rule="nonzero" d="M404.42 579.36v25h15v80h85v-80h15v-25h-115Zm-211.5 0v25h15v80h85v-80h15v-25h-115Zm416.08 0v25h15v80h85v-80h15v-25H609Z"/>
-      <path fill="#d4ebf2" fill-rule="nonzero" d="M524.42 524.36h-35v-75h-60v90h15v40h45v-35h7.31v10h27.69v-30Z"/>
-      <path fill="#10113a" d="M470.11 464.36h9.31v10h-9.31zm-25.35 20h9.31v10h-9.31zm20.35 20h9.31v10h-9.31zm20 20h9.31v10h-9.31zm-25.35 15h9.31v10h-9.31z"/>
-      <path fill="#d4ebf2" d="M444.42 564.36h4.31v10h-4.31z"/>
-      <path fill="#10113a" d="M429.42 459.36h4.31v10h-4.31zm-171.5 15h10v105h-10z"/>
-      <path fill="#ff826c" fill-rule="nonzero" d="M292.92 434.36h-10v-10h-40v10h-10v30h10v10h40v-10h10v-30Z"/>
-      <path fill="#d4ebf2" d="M227.92 484.36h30v25h-30zm40 25h30v30h-30zm-15-70h20v20h-20z"/>
-      <path fill="#ff826c" d="M177.92 499.36h20v20h-20z"/>
-      <path fill="#d4ebf2" fill-rule="nonzero" d="M247.92 529.36v30h-10v10h-30v10h50v-50h-10Z"/>
-      <path fill="#d4ebf2" fill-rule="nonzero" d="M237.92 529.36h-10v10h-10v10h-10v10h30v-30Z"/>
-      <path fill="#d4ebf2" d="M207.92 529.36h10v10h-10zm-10-10h10v10h-10z"/>
-      <path fill="#d4ebf2" fill-rule="nonzero" d="M187.92 509.36h-5v10h15v-15h-10v5Z"/>
-    </g>
-  </g>
-</svg>
--- a/public/assets/images/home/offre-1.1.svg
+++ b/public/assets/images/home/offre-1.1.svg
--- a/public/robots.txt
+++ b/public/robots.txt
@ -1,2 +1,2 @@
 User-agent: *
-Allow: /
+Disallow: /
--- a/src/components/AstroImage.astro
+++ b/src/components/AstroImage.astro
@ -1,44 +1,15 @@
 ---
-import { Image, getImage } from "astro:assets";
+import { Picture } from "@astrojs/image/components";

 const { src, alt, width, height, ...attrs } = Astro.props;
-
-// if h/w attributes are declared, use them. If not, use from the source file
-const imgHeight = height ? height : src.height;
-const imgWidth = width ? width : src.width;
-
-// compute avif and webp format in order to use inside a <picture> element
-const imgAvif = await getImage({
-	src: src,
-	format: "avif",
-	width: Number(imgWidth),
-	height: Number(imgHeight),
-});
-const imgWebp = await getImage({
-	src: src,
-	format: "webp",
-	width: Number(imgWidth),
-	height: Number(imgHeight),
-});
 ---

-<picture>
-	<source
-		srcset={imgAvif.src}
-		sizes={`(max-inline-size: ${imgWidth}px) 100vw, ${imgHeight}px`}
-		type="image/avif"
-	/>
-	<source
-		srcset={imgWebp.src}
-		sizes={`(max-inline-size: ${imgWidth}px) 100vw, ${imgHeight}px`}
-		type="image/webp"
-	/>
-	<Image
-		src={src}
-		width={Number(imgWidth)}
-		height={Number(imgHeight)}
-		format="jpg"
-		alt={alt ? alt : ""}
-		{...attrs}
-	/>
-</picture>
+<Picture
+	src={src}
+	widths={[320, 640, 768]}
+	aspectRatio={`${width}:${height}`}
+	sizes={`(max-inline-size: ${width}px) 100vw, ${width}px`}
+	formats={["avif", "webp"]}
+	alt={alt ? alt : ""}
+	{...attrs}
+/>
--- a/src/components/CardEditorial.astro
+++ b/src/components/CardEditorial.astro
@ -1,61 +1,38 @@
 ---
 import ListTags from "./ListTags.astro";
-import { l, t } from "astro-i18n";
-
 const { item, routeName } = Astro.props;
-
-// no link on references cards
-const isReference = routeName === t("references.slug");
 ---

-<div class:list={["card", { "card--link": !isReference }]}>
-	<h3>
-		{
-			!isReference ? (
-				<a
-					class="clean-link card__link"
-					href={`${l(`/${routeName}`)}/${item.data.permalink}`}
-				>
-					{item.data.title}
-				</a>
-			) : (
-				<span>{item.data.title}</span>
-			)
-		}
-	</h3>
-	<h4>{item.data.subtitle}</h4>
-	<ListTags list={item.data.tags} />
-	{
-		isReference && (
-			<a href={item.data.url} rel="noopener noreferer">
-				{t("references.cta")}
-				<span class="sr-only"> {item.data.title}</span>
-			</a>
-		)
-	}
+<div class="card">
+	<div>
+		<h3>
+			<a class="clean-link card__link" href={`${routeName}/${item.slug}`}
+				>{item.data.title}</a
+			>
+		</h3>
+		<h4>{item.data.subtitle}</h4>
+		<ListTags list={item.data.tags} />
+	</div>
 </div>

-<style define:vars={{ permalink: item.data.permalink }}>
+<style scoped>
 	.card {
 		padding: var(--space-s-m) var(--space-xs-s);
 		position: relative;
 		display: block;
 		block-size: 100%;
 		overflow: hidden;
+		cursor: pointer;
 		box-shadow: var(--shadow-elevation-medium);
 		background-color: white;
 	}
-	/*
-	* to be replaced with .card:has(a)
-	* when firefox supports it
-	*/
-	.card--link:hover {
+	.card:hover {
 		box-shadow: var(--shadow-elevation-high);
 	}
-	.card--link:focus-within {
+	.card:focus-within {
 		box-shadow: var(--shadow-elevation-high);
 	}
-	.card--link::after {
+	.card::after {
 		content: "";
 		position: absolute;
 		inline-size: 30px;
@ -69,19 +46,19 @@ const isReference = routeName === t("references.slug");
 		background-size: contain;
 		transform: translateX(1rem);
 	}
-	.card--link:hover::after,
-	.card--link:focus-within::after {
+	.card:hover::after,
+	.card:focus-within::after {
 		transform: translateX(0);
 		opacity: 1;
 	}
-	.card--link:hover h3 a {
+	.card:hover h3 a {
 		text-decoration: underline;
 	}
-	.card--link:hover h3 a,
-	.card--link:focus-within h3 a {
+	.card:hover h3 a,
+	.card:focus-within h3 a {
 		color: var(--color-brique);
 	}
-	.card--link::before {
+	.card::before {
 		content: "";
 		position: absolute;
 		top: 0;
@ -93,8 +70,8 @@ const isReference = routeName === t("references.slug");
 		transform-origin: bottom;
 		background-color: var(--color-brique);
 	}
-	.card--link:hover::before,
-	.card--link:focus-within::before {
+	.card:hover::before,
+	.card:focus-within::before {
 		transform: scaleY(1);
 		transform-origin: top;
 	}
@ -123,9 +100,6 @@ const isReference = routeName === t("references.slug");
 		.card::after {
 			transition: opacity ease 0.2s, transform ease 0.2s;
 		}
-		.card--link {
-			view-transition-name: var(--permalink);
-		}
 		h3 a {
 			transition: color ease 0.2s;
 		}
--- a/src/components/EditorialContent.astro
+++ b/src/components/EditorialContent.astro
@ -1,17 +1,17 @@
 ---
-// import { renderContent } from "astro-i18n";
 import MetaDate from "./MetaDate.astro";
 import TOC from "./TOC.astro";

 const { content } = Astro.props;
 const { Content, headings } = await content.render();
-// const { html, headings } = await renderContent(Astro, content);

 const toc = headings.map((heading) => {
 	return heading;
 });

-import "../styles/vendor/one-dark-pro.css";
+if (content.data.code) {
+	import "../styles/vendor/one-dark-pro.css";
+}
 ---

 <div class="sidebar region">
@ -20,17 +20,13 @@ import "../styles/vendor/one-dark-pro.css";
 		<h1>{content.data.title}</h1>
 		<p class="h3">{content.data.subtitle}</p>
 		<MetaDate item={content.data} />
-		<!-- <div class="flow content" set:html={html}> -->
-		<Content />
+		<div class="flow content">
+			<Content />
+		</div>
 	</article>
 </div>

-<style define:vars={{ permalink: content.data.permalink }}>
-	@media (prefers-reduced-motion: no-preference) {
-		article {
-			view-transition-name: var(--permalink);
-		}
-	}
+<style>
 	.sidebar {
 		--gutter: var(--space-xs-m);
 	}
@ -53,7 +49,4 @@ import "../styles/vendor/one-dark-pro.css";
 	.editorial :global(picture) {
 		margin: var(--space-s-m) 0;
 	}
-	.content :global(p + p) {
-		margin-block-start: var(--space-s);
-	}
 </style>
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@ -15,9 +15,7 @@ import { l, t } from "astro-i18n";
 			<li>
 				<a href="tel:+33749464239" title={t("contact.tel")}>+337 49 46 42 39</a>
 			</li>
-			<li><a href={l("/veille")}>{t("veille.titre")}</a></li>
 			<li><a href={l("/plan-du-site")}>{t("sitemap")}</a></li>
-			<li><a href={`${l("/")}rss.xml`}>RSS</a></li>
 		</ul>
 	</section>
 </footer>
--- a/src/components/Head.astro
+++ b/src/components/Head.astro
@ -1,17 +0,0 @@
---
-import { t } from "astro-i18n";
-const { pageTitle } = Astro.props;
---
-
-<head>
-	<meta charset="utf-8" />
-	<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
-	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
-	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
-	<title>{pageTitle} - Nicolas Arduin</title>
-	<meta name="description" content={t("seo.meta.description")} />
-	<meta name="robots" content="index,follow." />
-	<meta name="author" content="Nicolas Arduin" />
-	<meta name="subject" content="Développement de sites web, accessibilité." />
-	<meta name="view-transition" content="same-origin" />
-</head>
--- a/src/components/MetaDate.astro
+++ b/src/components/MetaDate.astro
@ -17,38 +17,21 @@ function rawDate(date) {
 ---

 <div class="meta">
-	{
-		!!item.createdAt && (
-			<p class="meta__date">
-				{t("meta.publication")}&nbsp;:
-				<time datetime={rawDate(item.createdAt)}>
-					{formatDate(item.createdAt)}
-				</time>
-			</p>
-		)
-	}
+	<p class="meta__date">
+		{t("meta.publication")}&nbsp;:
+		<time datetime={rawDate(item.createdAt)}>{formatDate(item.createdAt)}</time>
+	</p>
 	{
 		formatDate(item.createdAt) != formatDate(item.updatedAt) &&
-			!!item.createdAt &&
 			!!item.updatedAt && (
 				<p class="meta__date">
 					{t("meta.modification")}&nbsp;:
-					<time datetime={rawDate(item.updatedAt)}>
+					<time datetime={rawDate(item.createdAt)}>
 						{formatDate(item.updatedAt)}
 					</time>
 				</p>
 			)
 	}
-	{
-		!item.createdAt && !!item.updatedAt && (
-			<p class="meta__date">
-				{t("meta.modification")}&nbsp;:
-				<time datetime={rawDate(item.updatedAt)}>
-					{formatDate(item.updatedAt)}
-				</time>
-			</p>
-		)
-	}
 </div>

 <style>
--- a/src/components/Navigation.astro
+++ b/src/components/Navigation.astro
@ -17,12 +17,6 @@ import LanguageSwitcher from "./LangSwitcher.astro";
 			>
 			<span aria-hidden="true">&middot;</span>
 		</li>
-		<li>
-			<a href={l("/references")} class="clean-link nice-link"
-				>{t("references.titre")}</a
-			>
-			<span aria-hidden="true">&middot;</span>
-		</li>
 		<li>
 			<a
 				href="mailto:contact@nardu.in"
--- a/src/components/QuickAccessCard.astro
+++ b/src/components/QuickAccessCard.astro
@ -34,7 +34,7 @@ const { item } = Astro.props;
 		text-align: center;
 		gap: var(--space-xs);
 		cursor: pointer;
-		background-color: var(--color-white);
+		background-color: var(--color-light-blue);
 		transform: translateY(0);
 	}
 	.card:focus-within {
--- a/src/components/TOC.astro
+++ b/src/components/TOC.astro
@ -10,26 +10,24 @@ const { toc } = Astro.props;
 			<ol class="table-of-content__list" role="list">
 				{
 					// loop over the toc
-					toc.map(
-						(
-							heading
-							// if h2, set as a li
-						) =>
-							heading.depth === 2 ? (
+					toc.map((heading) =>
+						// if h2, set as a li
+						heading.depth === 2 ? (
+							<li>
+								<a href={`#${heading.slug}`} class="toc-2">
+									{heading.text}
+								</a>
+							</li>
+						) : // if h3, set as inner ol > li
+						heading.depth === 3 ? (
+							<ol role="list">
 								<li>
-									<a href={`#${heading.slug}`} class="toc-2">
+									<a href={`#${heading.slug}`} class="toc-3">
 										{heading.text}
 									</a>
-								</li> // if h3, set as inner ol > li
-							) : heading.depth === 3 ? (
-								<ol role="list">
-									<li>
-										<a href={`#${heading.slug}`} class="toc-3">
-											{heading.text}
-										</a>
-									</li>
-								</ol>
-							) : null
+								</li>
+							</ol>
+						) : null
 					)
 				}
 			</ol>
@ -70,18 +68,15 @@ const { toc } = Astro.props;
 	}

 	.table-of-content__list a::before {
-		content: "";
+		content: "·";
 		position: absolute;
-		top: 50%;
+		top: 0;
 		left: 0;
-		inline-size: 2px;
-		block-size: 2px;
-		border-radius: 4px;
 		transform: translate(-6px, 0);
-		background-color: var(--color-grey);
+		color: var(--color-grey);
 	}
 	.table-of-content__list a:visited::before {
-		background-color: white;
+		color: white;
 	}

 	.table-of-content__list a:focus,
--- a/src/content/articles/en/2022.md
+++ b/src/content/articles/en/2022.md
@ -2,10 +2,9 @@
 title: Nico v2.0
 subtitle: 2022 update of many things.
 lang: en
-permalink: "2022"
+slug: "2022"
 excerpt: Changes in my services, the website and myself.
 tags: ["Freelance"]
-type: articles
 createdAt: "2022-06-08T14:24:06.000Z"
 ---

--- a/src/content/articles/en/2023.md
+++ b/src/content/articles/en/2023.md
@ -1,57 +0,0 @@
---
-title: Nico v2.5
-subtitle: Update 2023.
-lang: en
-permalink: "2023"
-excerpt: New changes.
-tags: ["Freelance"]
-type: articles
-createdAt: "2023-02-03T17:41:00.000Z"
-updatedAt: "2023-05-17T17:41:00.000Z"
---
-
-This article will be updated when I have something new to share during the year 2023.
-
-## The website
-
-### Technologies
-
-Oops... I (re)did it again.
-
-I have completely redeveloped my site with <a href="https://astro.build/" rel="noopener noreferer" hreflang="en">Astro</a>, as predicted by myself [in 2022&nbsp;!](/en/articles/2022/#the-website)
-
-I will definitely do an article or two about Astro and the extensions I used. It was a great experience. Nuxt v2 is not really up to date anymore, so the performance was not good. Astro has completely fixed that.
-
-My <a href="https://pagespeed.web.dev/analysis/https-nardu-in/06as4el7ed?form_factor=mobile" rel="noopener noreferer">PageSpeed</a> performance score had dropped to 77/100. Thanks to Astro I'm back to a solid **95/100** without any particular optimization. With some small efforts, I've reached the good old 100/100.
-
-I then did a work of modernization of the codebase. Hello CSS variables and goodbye `media queries`. In no particular order, here are some of the improvements I made:
-
- `flexbox` and `grid` to adapt the layout to different screen sizes;
- CSS variables for colors, font sizes and margins;
- some `container queries`, just to try;
- logical CSS properties (`inline` and `block` instead of `width` and `height` for example).
-
-I took this opportunity to publish [the source code](https://git.nardu.in/nardu.in/website-astro) on my git repository.
-
-**Update #1:** I've added [an RSS feed](/en/rss.xml) as I find myself using it more and more on other websites.
-
-### Analytics
-
-I removed the tracking on my pages. I was using <a href="https://umami.is/" rel="noopener noreferer">umami</a> hosted on my own server. No personal data was collected and I rarely consulted the reports.
-
-It's nice to see that your site is consulted, but if there is no other purpose behind it, it's an extra resource loaded for nothing by visitors. Maybe I'll reactivate the tracking when I have a use for it (other than flattering my ego).
-
-Previous visit reports can be found at [this link.](https://stat.nardu.in/share/nJSt1tfS/nardu.in)
-
-### Content
-
- I've added a [work](/en/work/) page to list some of my projects.
- I've also added [a page](/en/veille/) where I list some interesting things from around the web.
-
-## Additional projects
-
-I'm still teaching web development this year. In order to expand my course materials, I have set up a mini documentation site available at [3-w.fr](https://3-w.fr/) (an address I am very proud of).
-
-I have to update it more regularly but I hope that the platform will help students progress!
-
-**More to come soon!**
--- a/src/content/articles/en/after-effects-expressions.mdx
+++ b/src/content/articles/en/after-effects-expressions.mdx
@ -2,15 +2,17 @@
 title: After Effects Expressions
 subtitle: Animation on steroïds.
 lang: en
-permalink: "after-effects-expressions"
+slug: "after-effects-expressions"
 excerpt: Expressions in After Effects have always been blurry for me. I know they exist, I know they're powerful, I know it could save a lot of time and clean complex keyframe filled compositions but… They are hard to learn!
 tags: ["Design"]
-type: articles
 createdAt: "2019-04-24T09:00:00.000Z"
 code: true
 ---

 import AstroImage from "../../../components/AstroImage.astro";
+export const basicExpression =
+	"https://assets.nardu.in/basic_expression_d81b12f1ac.jpeg";
+export const shortcut = "https://assets.nardu.in/shortcut_39cc19d383.jpeg";

 ## An ever lasting battle

@ -22,7 +24,7 @@ So the last time I had to do a complex animation, **I took the damn time!**
 Everyone uses expressions whether they know it or not. Most of the time it's a rather transparent process for the animator. For example: when parenting a property to another one, After Effects creates an expression for us.

 <AstroImage
-	src="https://assets.nardu.in/basic_expression_d81b12f1ac.jpeg"
+	src={basicExpression}
 	width="728"
 	height="80"
 	alt="Parenting the position of the form to a null creates an expression."
@ -33,7 +35,7 @@ Over the last updates, Adobe has made an effort to make expressions more accessi
 Those custom functions can be called through a menu once you enabled the expressions on a property. It offers organized shortcut and proper syntax to all of AE native functions and a bunch of JavaScript standard ones.

 <AstroImage
-	src="https://assets.nardu.in/shortcut_39cc19d383.jpeg"
+	src={shortcut}
 	width="728"
 	height="322"
 	alt="Alt + Click the stopwatch to access the shortcuts."
--- a/src/content/articles/en/faq.md
+++ b/src/content/articles/en/faq.md
@ -2,11 +2,10 @@
 title: Accessibility and sobriety
 subtitle: Translation in progress, stay tuned ;)
 lang: en
-permalink: "faq"
+slug: "faq"
 draft: true
 excerpt: Why, how et and especially what.
 tags: ["Freelance"]
-type: articles
 createdAt: "2022-06-22T15:34:45.000Z"
 ---

--- a/src/content/articles/en/gratuiste.md
+++ b/src/content/articles/en/gratuiste.md
@ -2,11 +2,10 @@
 title: Gratuiste
 subtitle: Translation in progress, stay tuned ;)
 lang: en
-permalink: "gratuiste"
+slug: "gratuiste"
 draft: true
 excerpt: Translation in progress, stay tuned ;)
 tags: ["Design", "Freelance"]
-type: articles
 createdAt: "2017-05-27T07:47:36.000Z"
 ---

--- a/src/content/articles/en/sci-hub-blocage.mdx
+++ b/src/content/articles/en/sci-hub-blocage.mdx
@ -2,16 +2,22 @@
 title: "Access blocked Sci-hub"
 subtitle: "The science of sharing."
 lang: en
-permalink: "sci-hub-unblock"
+slug: "sci-hub-unblock"
 key: "scihub"
 excerpt: "In March 2019, the Paris Regional Court ruled in favour of the publishers of scientific articles Elsevier and Springer Nature by ordering internet service providers to block access to these two websites. Here is how to access them if they are blocked in your country anyway."
 tags: ["Internet", "Science"]
-type: articles
 createdAt: "2019-03-31T07:47:36.000Z"
 updatedAt: "2022-12-27T12:08:00.000Z"
 ---

 import AstroImage from "../../../components/AstroImage.astro";
+export const macOs =
+	"https://assets.nardu.in/ef5a4b8e82a046e6a466c73c2fd9e99e.jpg";
+export const windowsSettings = "https://assets.nardu.in/sci-hub-settings.jpg";
+export const windowsNetwork = "https://assets.nardu.in/sci-hub-network.jpg";
+export const windowsAdapter = "https://assets.nardu.in/sci-hub-adapter.jpg";
+export const windowsAdapterSettings =
+	"https://assets.nardu.in/sci-hub-adapter-settings.jpg";

 The current sci-hub address is: <a href="https://sci-hub.se" rel="noreferer noopener">sci-hub.se</a>

@ -46,7 +52,7 @@ Go to:
 From there, you can add DNS servers by clicking the + icon. Click ok and apply the new settings. You might need to restart your computer for the changes to work.

 <AstroImage
-	src="https://assets.nardu.in/ef5a4b8e82a046e6a466c73c2fd9e99e.jpg"
+	src={macOs}
 	width="728"
 	height="1060"
 	alt="MacOS network and DNS settings"
@ -67,28 +73,28 @@ Go to:
 From there, you can add DNS servers. Click save. You might need to restart your computer for the changes to work.

 <AstroImage
-	src="https://assets.nardu.in/sci-hub-settings.jpg"
+	src={windowsSettings}
 	width="728"
 	height="319"
 	alt="Windows system settings"
 />

 <AstroImage
-	src="https://assets.nardu.in/sci-hub-network.jpg"
+	src={windowsNetwork}
 	width="728"
 	height="803"
 	alt="Windows network settings"
 />

 <AstroImage
-	src="https://assets.nardu.in/sci-hub-adapter.jpg"
+	src={windowsAdapter}
 	width="728"
 	height="327"
 	alt="Windows network connections settings"
 />

 <AstroImage
-	src="https://assets.nardu.in/sci-hub-adapter-settings.jpg"
+	src={windowsAdapterSettings}
 	width="728"
 	height="434"
 	alt="Windows network adapter settings"
--- a/src/content/articles/en/the-day-I-jamd.mdx
+++ b/src/content/articles/en/the-day-I-jamd.mdx
@ -2,15 +2,16 @@
 title: The day I Jam’d
 subtitle: A story of unusual tools and fun gambles.
 lang: en
-permalink: "the-day-I-jamd"
+slug: "the-day-I-jamd"
 excerpt: Ooh, yeah! All right! We’re jammin’
 tags: ["Dev", "Jamstack"]
-type: articles
 createdAt: "2020-10-08T09:00:00.000Z"
 updatedAt: "2022-12-27T15:40:06.000Z"
 ---

 import AstroImage from "../../../components/AstroImage.astro";
+export const wordpress = "https://assets.nardu.in/wordpress_8ee6f54b98.jpeg";
+export const strapi11ty = "https://assets.nardu.in/static_2c0d9f1eb8.jpeg";

 ## The not so easy choice

@ -31,7 +32,7 @@ Boy did they exceed my expectations! With almost no optimization on the static s
 ### wordpress

 <AstroImage
-	src="https://assets.nardu.in/wordpress_8ee6f54b98.jpeg"
+	src={wordpress}
 	width="728"
 	height="412"
 	alt="Performance score of 53/100 on Wordpress."
@ -42,7 +43,7 @@ Despite a lot of efforts I could not do better. I’m no expert in caching, do n
 ### 11ty + strapi

 <AstroImage
-	src="https://assets.nardu.in/static_2c0d9f1eb8.jpeg"
+	src={strapi11ty}
 	width="728"
 	height="412"
 	alt="Performance score of 97/100 on jamstack."
--- a/src/content/articles/en/video-compression.mdx
+++ b/src/content/articles/en/video-compression.mdx
@ -2,15 +2,19 @@
 title: Video compression
 subtitle: Encode like you mean it.
 lang: en
-permalink: "video-compression"
+slug: "video-compression"
 excerpt: How to gain precious weight when encoding videos.
 tags: ["Design"]
-type: articles
 createdAt: "2021-05-05T09:00:00.000Z"
 updatedAt: "2022-06-08T14:24:06.000Z"
 ---

 import AstroImage from "../../../components/AstroImage.astro";
+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.jpg";

 ## Let's play.

@ -26,11 +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="https://assets.nardu.in/video-premiere-1.jpeg"
-	width="673"
-	height="800"
-/>
+<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.

@ -51,11 +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="https://assets.nardu.in/video-handbrake-1.jpeg"
-	width="728"
-	height="337"
-/>
+<AstroImage src={handbrakeBase} width="728" height="337" alt="" />

 ### Video screen

@ -64,11 +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="https://assets.nardu.in/video-handbrake-2.jpeg"
-	width="728"
-	height="337"
-/>
+<AstroImage src={handbrakeVideo} width="728" height="337" alt="" />

 ### Audio screen

@ -79,11 +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="https://assets.nardu.in/video-handbrake-3.jpeg"
-	width="728"
-	height="337"
-/>
+<AstroImage src={handbrakeAudio} width="728" height="337" alt="" />

 ### Export!

@ -104,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="https://assets.nardu.in/video-handbrake-4.jpg"
-	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.

--- a/src/content/articles/fr/2022.md
+++ b/src/content/articles/fr/2022.md
@ -2,10 +2,9 @@
 title: Nico v2.0
 subtitle: Mise à jour 2022 de plein de trucs.
 lang: fr
-permalink: "2022"
+slug: "2022"
 excerpt: Évolution des services, du site et de moi-même.
 tags: ["Freelance"]
-type: articles
 createdAt: "2022-06-08T14:24:06.000Z"
 ---

--- a/src/content/articles/fr/2023.md
+++ b/src/content/articles/fr/2023.md
@ -1,57 +0,0 @@
---
-title: Nico v2.5
-subtitle: Mise à jour 2023.
-lang: fr
-permalink: "2023"
-excerpt: Suite des évolutions.
-tags: ["Freelance"]
-type: articles
-createdAt: "2023-02-03T17:41:00.000Z"
-updatedAt: "2023-05-17T17:41:00.000Z"
---
-
-Cet article sera mis à jour lorsque j'aurai des nouveautés à partager au cours de l'année 2023.
-
-## Le site
-
-### Technologies
-
-Oups… je l'ai encore (re)fait.
-
-J'ai entièrement re-développé mon site avec <a href="https://astro.build/" rel="noopener noreferer" hreflang="en">Astro</a>, comme prédit par moi-même [en 2022&nbsp;!](/articles/2022/#le-site)
-
-Je ferai certainement un ou deux articles/fragments sur Astro et les extensions que j'ai utilisées. En tout cas c'était super comme expérience. Nuxt v2 n'étant plus vraiment à jour, les performances n'étaient plus au rendez-vous. Astro a complètement corrigé ça.
-
-Mon score de performance <a href="https://pagespeed.web.dev/analysis/https-nardu-in/06as4el7ed?form_factor=mobile" rel="noopener noreferer" hreflang="en" lang="en">PageSpeed</a> était tombé à 77/100. Grâce à Astro je retrouve un solide **95/100** sans optimisation particulière. Avec quelques efforts sur le poids des ressources, je retrouve ce bon vieux 100/100.
-
-J'ai ensuite fait un travail de modernisation du code. Bonjour variables CSS et au-revoir les `media queries`. En vrac, voici certaines améliorations que j'ai mises en place&nbsp;:
-
- `flexbox` et `grid` pour adapter la mise en page aux différentes tailles d'écran&nbsp;;
- variables CSS pour les couleurs, les tailles de polices et les marges&nbsp;;
- quelques <span lang="en">`container queries`</span> pour essayer&nbsp;;
- propriétés logiques CSS (<span lang="en">`inline`</span> et <span lang="en">`block`</span> à la place de <span lang="en">`width`</span> et <span lang="en">`height`</span> par exemple).
-
-J'en ai profité pour publier [le code source](https://git.nardu.in/nardu.in/website-astro) sur mon dépôt git.
-
-**Mise à jour #1&nbsp;:** J'ai ajouté [un flux RSS](/rss.xml) car j'utilise de plus en plus le RSS sur d'autres sites web.
-
-### Suivi des visites
-
-J’ai supprimé le suivi des visites. J’utilisais <a href="https://umami.is/" rel="noopener noreferer" hreflang="en">umami</a> hébergé sur mon propre serveur. Aucune donnée personnelle n'était collectée et je consultais rarement les rapports.
-
-C'est sympa de voir que son site est visité, mais s'il n'y a aucun autre but derrière, c'est une ressource supplémentaire chargée pour rien par les visiteurs. Peut-être que je réactiverai le suivi lorsque j'en aurai l'utilité (autre que flatter mon égo).
-
-Les rapports de visites précédents sont consultables sur [ce lien.](https://stat.nardu.in/share/nJSt1tfS/nardu.in)
-
-### Contenu
-
- J'ai ajouté une page [références](/references/) pour lister certains de mes projets.
- J'ai également ajouté [une page](/veille/) où je répertorie des choses intéressantes trouvées sur le web.
-
-## Projets annexes
-
-Je continue d'enseigner le développement web cette année. Afin d'étoffer mes supports de cours, j'ai mis en place un mini site de documentation disponible à l'adresse [3-w.fr](https://3-w.fr/) (adresse dont je suis très fier).
-
-Il faut que j'arrive à être plus régulier dans sa mise à jour mais j'ai bon espoir que la plateforme aide les élèves à progresser&nbsp;!
-
-**Plus de trucs bientôt!**
--- a/src/content/articles/fr/after-effects-expressions.md
+++ b/src/content/articles/fr/after-effects-expressions.md
@ -3,10 +3,9 @@ title: After Effects Expressions
 subtitle: En cours de traduction, revenez bientôt ;)
 lang: fr
 draft: true
-permalink: "after-effects-expressions"
+slug: "after-effects-expressions"
 excerpt: En cours de traduction, revenez bientôt ;)
 tags: ["Design"]
-type: articles
 createdAt: "2019-04-24T09:00:00.000Z"
 ---

--- a/src/content/articles/fr/faq.md
+++ b/src/content/articles/fr/faq.md
@ -2,10 +2,9 @@
 title: Accessibilité, sobriété et F.A.Q.
 subtitle: Explications sur ma vision et mon fonctionnement.
 lang: fr
-permalink: "faq"
+slug: "faq"
 excerpt: Pourquoi, comment et surtout quèsaco.
 tags: ["Freelance"]
-type: articles
 createdAt: "2022-06-22T15:34:45.000Z"
 ---

--- a/src/content/articles/fr/gratuiste.md
+++ b/src/content/articles/fr/gratuiste.md
@ -2,10 +2,9 @@
 title: "Gratuiste"
 subtitle: "Ou le travail gratuit."
 lang: fr
-permalink: "gratuiste"
+slug: "gratuiste"
 excerpt: "J’ai cherché un moyen de mettre mes compétences au service d’autrui et je pense avoir trouvé: je vais travailler gratuitement pour des associations."
 tags: ["Graphisme", "Freelance"]
-type: articles
 createdAt: "2017-05-27T07:47:36.000Z"
 updatedAt: "2022-12-27T15:36:06.000Z"
 ---
--- a/src/content/articles/fr/sci-hub-blocage.mdx
+++ b/src/content/articles/fr/sci-hub-blocage.mdx
@ -2,15 +2,21 @@
 title: "Sci-hub bloqué, comment contourner"
 subtitle: "La science du partage."
 lang: fr
-permalink: "sci-hub-blocage"
+slug: "sci-hub-blocage"
 excerpt: "Le tribunal de grande instance de Paris a ordonné aux fournisseurs d’accès à internet de bloquer l’accès à sci-hub. Voici comment contourner les blocages mis en place."
 tags: ["Internet", "Science"]
-type: articles
 createdAt: "2019-03-31T07:47:36.000Z"
 updatedAt: "2022-12-27T12:08:00.000Z"
 ---

 import AstroImage from "../../../components/AstroImage.astro";
+export const macOs =
+	"https://assets.nardu.in/ef5a4b8e82a046e6a466c73c2fd9e99e.jpg";
+export const windowsSettings = "https://assets.nardu.in/sci-hub-settings.jpg";
+export const windowsNetwork = "https://assets.nardu.in/sci-hub-network.jpg";
+export const windowsAdapter = "https://assets.nardu.in/sci-hub-adapter.jpg";
+export const windowsAdapterSettings =
+	"https://assets.nardu.in/sci-hub-adapter-settings.jpg";

 L'adresse actuelle de sci-hub est&nbsp;: [sci-hub.se](https://sci-hub.se)

@ -49,7 +55,7 @@ Ouvrez&nbsp;:
 De là, vous pouvez ajouter des serveurs DNS en cliquant sur l'icône +. Cliquez sur ok et appliquez les nouveaux paramètres. Vous devrez peut-être redémarrer votre ordinateur pour que les changements fonctionnent.

 <AstroImage
-	src="https://assets.nardu.in/ef5a4b8e82a046e6a466c73c2fd9e99e.jpg"
+	src={macOs}
 	width="728"
 	height="1060"
 	alt="MacOS réglages réseau et DNS"
@ -68,28 +74,28 @@ Ouvrez&nbsp;:
 1. Utiliser l’adresse de serveur DNS suivante

 <AstroImage
-	src="https://assets.nardu.in/sci-hub-settings.jpg"
+	src={windowsSettings}
 	width="728"
 	height="319"
 	alt="Réglages windows"
 />

 <AstroImage
-	src="https://assets.nardu.in/sci-hub-network.jpg"
+	src={windowsNetwork}
 	width="728"
 	height="803"
 	alt="Windows réglages réseaux"
 />

 <AstroImage
-	src="https://assets.nardu.in/sci-hub-adapter.jpg"
+	src={windowsAdapter}
 	width="728"
 	height="327"
 	alt="Windows régalges connections réseaux"
 />

 <AstroImage
-	src="https://assets.nardu.in/sci-hub-adapter-settings.jpg"
+	src={windowsAdapterSettings}
 	width="728"
 	height="434"
 	alt="Windows options adaptateur réseau"
--- a/src/content/articles/fr/the-day-I-jamd.mdx
+++ b/src/content/articles/fr/the-day-I-jamd.mdx
@ -2,15 +2,16 @@
 title: The day I Jam’d
 subtitle: Des paris, des outils et du fun.
 lang: fr
-permalink: "the-day-I-jamd"
+slug: "the-day-I-jamd"
 excerpt: Ooh, yeah! All right! We’re jammin’
 tags: ["Dev", "Jamstack"]
-type: articles
 createdAt: "2020-10-08T07:47:36.000Z"
 updatedAt: "2022-12-27T15:40:06.000Z"
 ---

 import AstroImage from "../../../components/AstroImage.astro";
+export const wordpress = "https://assets.nardu.in/wordpress_8ee6f54b98.jpeg";
+export const strapi11ty = "https://assets.nardu.in/static_2c0d9f1eb8.jpeg";

 ## La solution de non facilité

@ -31,7 +32,7 @@ J’en suis resté pantois&nbsp;! Quasiment sans optimisation du côté statique
 ### wordpress

 <AstroImage
-	src="https://assets.nardu.in/wordpress_8ee6f54b98.jpeg"
+	src={wordpress}
 	width="728"
 	height="412"
 	alt="Score de performance de 53/100 sur Wordpress."
@ -42,7 +43,7 @@ Malgré beaucoup d’efforts, je n’ai pas pu faire mieux. Je ne suis pas un ex
 ### 11ty + strapi

 <AstroImage
-	src="https://assets.nardu.in/static_2c0d9f1eb8.jpeg"
+	src={strapi11ty}
 	width="728"
 	height="412"
 	alt="Score de performance de 97/100 en Jamstack."
--- a/src/content/articles/fr/video-compression.md
+++ b/src/content/articles/fr/video-compression.md
@ -3,10 +3,9 @@ title: Compression vidéo
 subtitle: En cours de traduction, revenez bientôt ;)
 lang: fr
 draft: true
-permalink: "video-compression"
+slug: "video-compression"
 excerpt: Pas encore traduit
 tags: ["Design"]
-type: articles
 createdAt: "2021-05-05T09:00:00.000Z"
 updatedAt: "2022-06-08T14:24:06.000Z"
 ---
--- a/src/content/config.ts
+++ b/src/content/config.ts
@ -6,8 +6,6 @@ const articles = defineCollection({
 		subtitle: z.string(),
 		lang: z.enum(["fr", "en"]),
 		tags: z.array(z.string()), // An array of strings
-		type: z.string(),
-		permalink: z.string(),
 		// Parse pubDate as a browser-standard `Date` object
 		createdAt: z.string().transform((str) => new Date(str)),
 		updatedAt: z
@ -25,27 +23,6 @@ const fragments = defineCollection({
 		subtitle: z.string(),
 		lang: z.enum(["fr", "en"]),
 		tags: z.array(z.string()), // An array of strings
-		type: z.string(),
-		permalink: z.string(),
-		// Parse pubDate as a browser-standard `Date` object
-		createdAt: z.string().transform((str) => new Date(str)),
-		updatedAt: z
-			.string()
-			.transform((str) => new Date(str))
-			.optional(),
-		code: z.boolean().optional() || false,
-		draft: z.boolean().optional() || false,
-	}),
-});
-
-const references = defineCollection({
-	schema: z.object({
-		title: z.string(),
-		subtitle: z.string(),
-		url: z.string(),
-		lang: z.enum(["fr", "en"]),
-		permalink: z.string(),
-		tags: z.array(z.string()), // An array of strings
 		// Parse pubDate as a browser-standard `Date` object
 		createdAt: z.string().transform((str) => new Date(str)),
 		updatedAt: z
@ -61,5 +38,4 @@ export const collections = {
 	// Don't forget 'quotes' for collection names containing dashes
 	articles,
 	fragments,
-	references,
 };
--- a/src/content/fragments/en/acme-sh-tls-cert.md
+++ b/src/content/fragments/en/acme-sh-tls-cert.md
@ -2,11 +2,10 @@
 title: Strong TLS certificates with acme.sh
 subtitle: 384-bit of https
 lang: en
-permalink: "acme-sh-tls-cert"
+slug: "acme-sh-tls-cert"
 createdAt: "2022-06-08T14:24:06.000Z"
 excerpt: Real cert have curves.
 tags: ["security"]
-type: snippets
 ---

 ## Disclaimer
--- a/src/content/fragments/en/array-vs-array.md
+++ b/src/content/fragments/en/array-vs-array.md
@ -2,11 +2,10 @@
 title: Filter an array against another array
 subtitle: Array vs Array.
 lang: en
-permalink: "array-vs-array"
+slug: "array-vs-array"
 createdAt: "2022-06-08T14:24:06.000Z"
 excerpt: My peak javascript
 tags: ["nuxt.js"]
-type: snippets
 ---

 ## Context
--- a/src/content/fragments/en/buttons.md
+++ b/src/content/fragments/en/buttons.md
@ -2,12 +2,11 @@
 title: Buttons hover
 subtitle: Simple, but nice.
 lang: en
-permalink: "buttons"
+slug: "buttons"
 draft: true
 excerpt: Easy to grab and use hover effects.
 tags: ["CSS"]
 code: true
-type: snippets
 createdAt: "2020-10-08T09:00:00.000Z"
 ---

--- a/src/content/fragments/en/image-full.mdx
+++ b/src/content/fragments/en/image-full.mdx
@ -3,11 +3,10 @@ title: Full width image
 subtitle: Translation in progress, stay tuned ;)
 lang: en
 draft: true
-permalink: "image-full"
+slug: "image-full"
 createdAt: "2020-09-15T09:00:00.000Z"
 updatedAt: "2022-06-08T14:24:06.000Z"
 tags: ["CSS"]
-type: snippets
 ---

 [Go back to available snippets](/en/snippets)
--- a/src/content/fragments/en/nuxt-graphql-static.md
+++ b/src/content/fragments/en/nuxt-graphql-static.md
@ -2,12 +2,11 @@
 title: Static website and GraphQL queries with Nuxt.js
 subtitle: Graphql client is king.
 lang: en
-permalink: "nuxt-graphql-static"
+slug: "nuxt-graphql-static"
 createdAt: "2022-06-08T14:24:06.000Z"
 updatedAt: "2022-09-08T13:43:33.000Z"
 excerpt: When the most used gql module doesn't work…
 tags: ["nuxt.js"]
-type: snippets
 ---

 ## The problem
@ -131,7 +130,7 @@ export default {
    const locale = app.i18n.localeProperties.iso
    const data = await $graphql.default.request(articleQuery, {
      code: locale,
-      permalink: params.slug,
+      slug: params.slug,
    })
    return { data }
  },
--- a/src/content/fragments/en/super-cookies.mdx
+++ b/src/content/fragments/en/super-cookies.mdx
@ -2,15 +2,12 @@
 title: The best cookies
 subtitle: Consentless biscuits.
 lang: en
-permalink: "super-cookies"
+slug: "super-cookies"
 createdAt: "2022-06-08T14:24:06.000Z"
 excerpt: It's a real recipe, not a joke about annoying files.
 tags: ["food"]
-type: snippets
 ---

-import AstroImage from "../../../components/AstroImage.astro";
-
 ## Vegetalian version

 ### Ingredients
@ -73,15 +70,5 @@ Chocolate can be replaced by anything like nuts, raisins, legos... (don't eat le

 ## Figures

-<AstroImage
-	src="https://assets.nardu.in/cookies-fig-1.jpg"
-	width="753"
-	height="1248"
-	alt="All ingredients mixed together to form a brown paste."
-/>
-<AstroImage
-	src="https://assets.nardu.in/cookies-fig-2.jpg"
-	width="753"
-	height="1248"
-	alt="The cookies are round and soft after baking."
-/>
+![Fig.1 - All ingredients mixed together to form a brown paste.](https://assets.nardu.in/cookies-fig-1.jpg)
+![Fig.2 - Baked cookies are very soft.](https://assets.nardu.in/cookies-fig-2.jpg)
--- a/src/content/fragments/en/toulouse-fun.md
+++ b/src/content/fragments/en/toulouse-fun.md
@ -2,10 +2,9 @@
 title: Toulouse yourself
 subtitle: Only the bestest
 lang: en
-permalink: "toulouse-fun"
+slug: "toulouse-fun"
 excerpt: Gonna have to trust me on this ¯\_(ツ)_/¯
 tags: ["lifestyle"]
-type: snippets
 createdAt: "2022-06-22T15:34:45.000Z"
 ---

--- a/src/content/fragments/en/visited-links.md
+++ b/src/content/fragments/en/visited-links.md
@ -1,13 +0,0 @@
---
-title: Visited links and visuel aid
-subtitle: Translation in progress, stay tuned ;)
-lang: en
-draft: true
-permalink: "visited-links"
-excerpt: Petit hack CSS
-tags: ["Front-end"]
-type: snippets
-createdAt: "2023-06-06T18:34:00.000Z"
---
-
-[Go back to available snippets](/en/snippets)
--- a/src/content/fragments/fr/acme-sh-tls-cert.md
+++ b/src/content/fragments/fr/acme-sh-tls-cert.md
@ -2,11 +2,10 @@
 title: Certificates TLS robustes avec acme.sh
 subtitle: 384-bit de https
 lang: fr
-permalink: "acme-sh-tls-cert"
+slug: "acme-sh-tls-cert"
 createdAt: "2022-06-08T14:24:06.000Z"
 excerpt: La sécurité avec des courbes.
 tags: ["sécurité"]
-type: fragments
 ---

 ## Attention
--- a/src/content/fragments/fr/array-vs-array.md
+++ b/src/content/fragments/fr/array-vs-array.md
@ -3,11 +3,10 @@ title: Filtrer un array avec un autre array
 subtitle: En cours de traduction.
 lang: fr
 draft: true
-permalink: "array-vs-array"
+slug: "array-vs-array"
 createdAt: "2022-06-08T14:24:06.000Z"
 excerpt: En cours de traduction.
 tags: ["nuxt.js"]
-type: fragments
 ---

 [Voir les fragments disponibles](/fragments)
--- a/src/content/fragments/fr/buttons.mdx
+++ b/src/content/fragments/fr/buttons.mdx
@ -2,11 +2,10 @@
 title: "Effets de survol de boutons"
 subtitle: "Simples mais efficaces."
 lang: fr
-permalink: "buttons"
+slug: "buttons"
 draft: true
 excerpt: Quelques effets de survol faciles à récupérer et utiliser.
 tags: ["CSS"]
-type: fragments
 code: true
 createdAt: "2020-10-08T09:00:00.000Z"
 ---
@ -51,7 +50,7 @@ Tous les boutons présents utilisent ces styles comme base en guise de «&nbsp;r
 	background-color: hotpink;
 }
 .btn-icon::before {
-	content: url("./assets/svg/arrow-right-white.svg");
+	content: url("~assets/svg/arrow-right-white.svg");
 	position: absolute;
 	width: 20px;
 	top: 50%;
--- a/src/content/fragments/fr/image-full.mdx
+++ b/src/content/fragments/fr/image-full.mdx
@ -2,25 +2,18 @@
 title: Image pleine largeur
 subtitle: Casser le conteneur.
 lang: fr
-permalink: "image-full"
+slug: "image-full"
 createdAt: "2020-09-15T09:00:00.000Z"
 updatedAt: "2022-06-08T14:24:06.000Z"
 excerpt: Faire déborder une image de son conteneur sans tout casser.
 tags: ["CSS"]
-type: fragments
 ---

-import AstroImage from "../../../components/AstroImage.astro";
-
 ## Image inline

 On est parfois obligé d'utiliser des images dans des balises `img` plutôt que dans un `background` en css. Comment faire alors pour que l'image sorte de son conteneur pour en faire une bannière&nbsp;? Exemple pratique à partir de ce même site.

-<AstroImage
-	src="https://assets.nardu.in/image_bleed_container_9e3939b3ae.jpeg"
-	width="320"
-	height="568"
-/>
+[![](https://assets.nardu.in/image_bleed_container_9e3939b3ae.jpeg "Cliquer pour agrandir")](https://assets.nardu.in/image_bleed_container_9e3939b3ae.jpeg)

 ### Contexte

@ -49,11 +42,7 @@ img {
 }
 ```

-<AstroImage
-	src="https://assets.nardu.in/image_bleed_original_d49f0d11bf.jpeg"
-	width="320"
-	height="568"
-/>
+[![](https://assets.nardu.in/image_bleed_original_d49f0d11bf.jpeg "Cliquer pour agrandir")](https://assets.nardu.in/image_bleed_original_d49f0d11bf.jpeg)

 ### Déborder du conteneur

@ -67,11 +56,7 @@ Afin de faire prendre à l'image toute la largeur, on agit sur son conteneur&nbs
 }
 ```

-<AstroImage
-	src="https://assets.nardu.in/image_bleed_full_2a902f9539.jpeg"
-	width="320"
-	height="568"
-/>
+[![](https://assets.nardu.in/image_bleed_full_2a902f9539.jpeg "Cliquer pour agrandir")](https://assets.nardu.in/image_bleed_full_2a902f9539.jpeg)

 ### Faire une bannière

@ -86,11 +71,7 @@ On peut alors réduire la hauteur du conteneur pour obtenir une bannière plutô
 }
 ```

-<AstroImage
-	src="https://assets.nardu.in/image_bleed_height_81b4ce969a.jpeg"
-	width="320"
-	height="568"
-/>
+[![](https://assets.nardu.in/image_bleed_height_81b4ce969a.jpeg "Cliquer pour agrandir")](https://assets.nardu.in/image_bleed_height_81b4ce969a.jpeg)

 Il faut ensuite forcer l'image à prendre toute la largeur du conteneur&nbsp;:

@ -100,11 +81,7 @@ Il faut ensuite forcer l'image à prendre toute la largeur du conteneur&nbsp;:
 }
 ```

-<AstroImage
-	src="https://assets.nardu.in/image_bleed_deformed_479046d2cb.jpeg"
-	width="320"
-	height="568"
-/>
+[![](https://assets.nardu.in/image_bleed_deformed_479046d2cb.jpeg "Cliquer pour agrandir")](https://assets.nardu.in/image_bleed_deformed_479046d2cb.jpeg)

 Pas top…

@ -119,11 +96,7 @@ Pas top…
 }
 ```

-<AstroImage
-	src="https://assets.nardu.in/image_bleed_6c164e82b3.jpeg"
-	width="320"
-	height="568"
-/>
+[![](https://assets.nardu.in/image_bleed_6c164e82b3.jpeg "Cliquer pour agrandir")](https://assets.nardu.in/image_bleed_6c164e82b3.jpeg)

 Cette technique s'apparente à l'utilisation d'une image de background mais en dur 😁

--- a/src/content/fragments/fr/nuxt-graphql-static.md
+++ b/src/content/fragments/fr/nuxt-graphql-static.md
@ -2,12 +2,11 @@
 title: Site statique et requêtes GraphQL avec Nuxt.js
 subtitle: Le client graphql est roi.
 lang: fr
-permalink: "nuxt-graphql-static"
+slug: "nuxt-graphql-static"
 createdAt: "2022-06-08T14:24:06.000Z"
 updatedAt: "2022-09-08T13:43:33.000Z"
 excerpt: Quand le module gql le plus utilisé ne fonctionne pas…
 tags: ["nuxt.js"]
-type: fragments
 ---

 ## Le problème
@ -131,7 +130,7 @@ export default {
    const locale = app.i18n.localeProperties.iso
    const data = await $graphql.default.request(articleQuery, {
      code: locale,
-      permalink: params.slug,
+      slug: params.slug,
    })
    return { data }
  },
--- a/src/content/fragments/fr/super-cookies.mdx
+++ b/src/content/fragments/fr/super-cookies.mdx
@ -2,15 +2,12 @@
 title: Les meilleurs cookies
 subtitle: Des gâteaux sans consentement.
 lang: fr
-permalink: "super-cookies"
+slug: "super-cookies"
 createdAt: "2022-06-08T14:24:06.000Z"
 excerpt: C'est vraiment une recette hein, pas une blague sur les fichiers temporaires.
 tags: ["cuisine"]
-type: fragments
 ---

-import AstroImage from "../../../components/AstroImage.astro";
-
 ## Version végétalienne

 ### Ingrédients
@ -73,15 +70,5 @@ Le chocolat peut-être remplacé par n'importe quoi comme des noix, des raisins

 ## Figures

-<AstroImage
-	src="https://assets.nardu.in/cookies-fig-1.jpg"
-	width="753"
-	height="1248"
-	alt="Tous les ingrédients mélangés forment une pâte marron."
-/>
-<AstroImage
-	src="https://assets.nardu.in/cookies-fig-2.jpg"
-	width="753"
-	height="1248"
-	alt="Les cookies cuits sont bombés et très moelleux."
-/>
+![Fig.1 - Tous les ingrédients mélangés forment une pâte marron.](https://assets.nardu.in/cookies-fig-1.jpg)
+![Fig.2 - Les cookies cuits sont très moelleux.](https://assets.nardu.in/cookies-fig-2.jpg)
--- a/src/content/fragments/fr/toulouse-fun.md
+++ b/src/content/fragments/fr/toulouse-fun.md
@ -3,11 +3,10 @@ title: Toulouse yourself
 subtitle: En cours de traduction.
 lang: fr
 draft: true
-permalink: "toulouse-fun"
+slug: "toulouse-fun"
 createdAt: "2022-06-22T15:34:45.000Z"
 excerpt: En cours de traduction.
 tags: ["lifestyle"]
-type: fragments
 ---

 [Voir les fragments disponibles](/fragments)
--- a/src/content/fragments/fr/visited-links.md
+++ b/src/content/fragments/fr/visited-links.md
@ -1,83 +0,0 @@
---
-title: Liens visités et indication visuelle
-subtitle: Comment différencier les liens déjà cliqués
-lang: fr
-draft: false
-permalink: "visited-links"
-excerpt: Petit hack CSS
-tags: ["Front-end"]
-type: snippets
-createdAt: "2023-06-06T18:34:00.000Z"
---
-
-## La théorie
-
-Il est possible sur le web d'appliquer un style différent aux liens déjà visités par un utilisateur. Par défaut, un lien non visité est bleu tandis qu'un lien visité est violet.
-
-Généralement, ces styles sont modifiés, voire supprimés dans le cas des liens visités. L'information qu'un lien a déjà été visité ne semble pas indispensable à la navigation. C'est sûrement vrai, mais personnellement, je suis assez content d'avoir un rappel des pages que j'ai déjà consultées lorsque je navigue.
-
-Une information uniquement communiquée par la couleur est faillible, car certaines personnes ne distinguent pas les couleurs correctement. J'ai alors cherché un moyen d'ajouter un élément graphique supplémentaire aux liens visités/non visités. La solution démontrée ici n'est certainement pas idéale, elle se rapproche plus d'une expérience, à priori inoffensive pour l'internaute.
-
-## La spécification
-
-Quand je me suis intéressé à ce qu'il était possible de faire avec les liens déjà visités, j'ai découvert qu'extrêmement peu de propriétés <abbr>CSS</abbr> étaient autorisées. En effet, seulement des changements de couleurs sont disponibles. Ceci est dû au fait qu'il était possible de récupérer l'historique de navigation d'un utilisateur grâce aux styles des liens visités. Le sélecteur `:visited` a donc été restreint par les navigateurs afin de lutter contre cette brèche de la vie privée. [Plus d'informations dans cet article.](https://developer.mozilla.org/fr/docs/Web/CSS/Privacy_and_the_:visited_selector)
-
-## La pratique
-
-Que faire alors, en terme de style, quand on ne peut changer que des couleurs&nbsp;?
-
-D'après MDN, les propriétés suivantes sont modifiables&nbsp;:
-
- `color`
- `background-color`
- `border-color` (et les propriétés détaillées associées),
- `column-rule-color`
- `outline-color`
- `text-decoration-color`
- `text-emphasis-color`
- Les composantes de couleur liées aux attributs SVG `fill` et `stroke`.
-
-Changer la couleur d'un lien visité ne sera pas compris par les internautes, à moins de garder une colorimétrie proche de celle par défaut (bleu et violet).
-
-En revanche, il est possible de "&nbsp;masquer&nbsp;" un élément en modifiant sa couleur pour qu'elle corresponde à la couleur du fond de la page ou de l'élément parent. On pourrait ainsi imaginer masquer une `border` ou un `outline`.
-
-J'ai personnellement choisi de faire différemment. J'ai décidé d'utiliser un pseudo-élément `::before` sur l'état non visité du lien puis de le masquer quand celui-ci devient visité.
-
-### Le code
-
-```css
-a {
-	position: relative;
-	text-decoration: none;
-}
-a::before {
-	content: "";
-	position: absolute;
-	top: 50%;
-	left: 0;
-	inline-size: 2px;
-	block-size: 2px;
-	border-radius: 4px;
-	transform: translate(-6px, 0);
-	background-color: grey;
-}
-a:visited::before {
-	background-color: white;
-}
-```
-
-Ces règles, utilisées dans la table des matières de mes articles, ajoutent une sorte de petite puce ou pastille au début du lien. Cette puce est ensuite passée en blanc sur fond blanc une fois que le lien est visité, ce qui la masque visuellement.
-
-### Accessibilité
-
-On pourrait simplifier la règle et utiliser le caractère de puce directement dans la propriété `content` mais les lecteurs d'écran annonceront alors ce caractère lors de leur retranscription du lien. De plus, les lecteurs d'écrans annoncent déjà si un lien est visité avant de lire son intitulé.
-
-## Aller plus loin
-
-Afin de pousser l'expérience un peu plus loin, j'ai tenté d'utiliser des éléments plus explicites pour signifier l'état visité du lien. Bien qu'encore assez imparfait, il est possible de créer un indicateur plus complet de lien visité.
-
-L'idée est d'avoir un `::before` et un `::after`, chacun contenant une icône en base 64 blanche en tant qu'image de fond. Quand le lien est non visité, le `::before` contient un fond coloré qui fait apparaître l'icône. Quand le lien passe en visité, le fond du `::before` devient blanc et celui du `::after` devient coloré, ce qui masque la première icône et affiche la deuxième.
-
-Il est nécessaire de positionner les icônes côte à côte sinon elles se retrouveront l'une sur l'autre.
-
-[Voir la démo sur codepen.](https://codepen.io/narduin/pen/VwVwmrO)
--- a/src/content/references/en/3w.md
+++ b/src/content/references/en/3w.md
@ -1,10 +0,0 @@
---
-title: 3w
-subtitle: I wrote the doc!
-url: https://3-w.fr
-lang: en
-permalink: "3w"
-excerpt: Développement web et compagnie.
-tags: ["Front-end", "docs"]
-createdAt: "2022-10-19T18:02:00.000Z"
---
--- a/src/content/references/en/natureo.md
+++ b/src/content/references/en/natureo.md
@ -1,10 +0,0 @@
---
-title: Nature en Occitanie
-subtitle: Sobriety is only natural.
-url: https://www.natureo.org/
-lang: en
-permalink: "natureo"
-excerpt: Développement web et compagnie.
-tags: ["Front-end", "accessibility", "sobriety", "CMS"]
-createdAt: "2023-04-19T18:02:00.000Z"
---
--- a/src/content/references/en/parole-expression.md
+++ b/src/content/references/en/parole-expression.md
@ -1,10 +0,0 @@
---
-title: Parole Expression
-subtitle: A new website for the association.
-url: https://www.paroleexpression.fr/
-lang: en
-permalink: "parole-expression"
-excerpt: Développement web et compagnie.
-tags: ["Front-end", "sobriety", "CMS"]
-createdAt: "2022-04-19T17:11:00.000Z"
---
--- a/src/content/references/en/rose-primaire.md
+++ b/src/content/references/en/rose-primaire.md
@ -1,10 +0,0 @@
---
-title: Rose Primaire
-subtitle: An agency we love.
-url: https://roseprimaire.com/
-lang: en
-permalink: "rose-primaire"
-excerpt: Web dev and other things.
-tags: ["Front-end", "accessibility", "sobriety", "CMS"]
-createdAt: "2023-04-19T17:11:00.000Z"
---
--- a/src/content/references/fr/3w.md
+++ b/src/content/references/fr/3w.md
@ -1,10 +0,0 @@
---
-title: 3w
-subtitle: J'ai fait de la doc!
-url: https://3-w.fr
-lang: fr
-permalink: "3w"
-excerpt: Développement web et compagnie.
-tags: ["Front-end", "documentation"]
-createdAt: "2022-10-19T18:02:00.000Z"
---
--- a/src/content/references/fr/natureo.md
+++ b/src/content/references/fr/natureo.md
@ -1,10 +0,0 @@
---
-title: Nature en Occitanie
-subtitle: La sobriété au naturel.
-url: https://www.natureo.org/
-lang: fr
-permalink: "natureo"
-excerpt: Développement web et compagnie.
-tags: ["Front-end", "accessibilité", "éco-conception", "CMS"]
-createdAt: "2023-04-19T18:02:00.000Z"
---
--- a/src/content/references/fr/parole-expression.md
+++ b/src/content/references/fr/parole-expression.md
@ -1,10 +0,0 @@
---
-title: Parole Expression
-subtitle: Un nouveau site pour l'association.
-url: https://www.paroleexpression.fr/
-lang: fr
-permalink: parole-expression
-excerpt: Développement web et compagnie.
-tags: ["Front-end", "éco-conception", "CMS"]
-createdAt: "2022-04-19T17:11:00.000Z"
---
--- a/src/content/references/fr/rose-primaire.md
+++ b/src/content/references/fr/rose-primaire.md
@ -1,10 +0,0 @@
---
-title: Rose Primaire
-subtitle: Une agence comme on l'aime.
-url: https://roseprimaire.com/
-lang: fr
-permalink: "rose-primaire"
-excerpt: Développement web et compagnie.
-tags: ["Front-end", "accessibilité", "éco-conception", "CMS"]
-createdAt: "2023-04-19T17:11:00.000Z"
---
--- a/src/data/HP/en/01-offre.md
+++ b/src/data/HP/en/01-offre.md
@ -2,28 +2,29 @@
 type: section
 id: offre
 lang: en
-image: /assets/images/home/offre-1.1.svg
+slug:
+createdAt:
+image: /assets/images/home/offres.svg
 order: 1
 quickTitle: My offers
 quickImage: /assets/images/home/icon-desktop.svg
 ---

-## Full website offer
+## Full website offer.

 ### Small website, blog, landing page…

 Whether it's a creation or a redesign, I can handle everything:

- custom development;
- configuration of a content management system (if needed);
- hosting and deploying;
- maintenance.
+- graphic design,
+- custom development,
+- configuration of a content management system (if needed),
+- hosting and deploying
+- maintenance

-### Bigger websites, e-commerce
+### Bigger websites, e-commerce.

 When the project is larger, I call on talented partners who share the same values:

- [Rose Primaire](https://roseprimaire.com/) for the monitoring and management of the project;
- [Sylvain Plantier](https://jedessinebien.com/) and/or [Benoît Etchevery](http://ben-etche.com/) for illustration and art direction.
-
-[See some work here!](/en/work/)
+- [Rose Primaire](https://roseprimaire.com/) for the monitoring and management of the project,
+- [Sylvain Plantier](https://jedessinebien.com/) and/or [Benoît Etchevery](http://ben-etche.com/) for illustration and art direction
--- a/src/data/HP/en/02-methodo.md
+++ b/src/data/HP/en/02-methodo.md
@ -2,28 +2,30 @@
 type: section
 id: methodology
 lang: en
+slug:
+createdAt:
 image: /assets/images/home/methodo.svg
 order: 2
 quickTitle: My methodology
 quickImage: /assets/images/home/icon-methodo.svg
 ---

-## Methodology
+## Methodology.

-### Accessibility by default
+### Accessibility by default.

 Committed to a more accessible web, I create **websites** relying on the [french General Accessibility Guidelines (RGAA)](https://www.numerique.gouv.fr/publications/rgaa-accessibilite/) as well as the [Opquast recommandations.](https://www.opquast.com/en/making-the-web-better/)

-### Sobriety by choice
+### Sobriety by choice.

 I specialize in the development of **static websites**, adopting an [eco-design](https://en.wikipedia.org/wiki/Ecological_design) approach.  
 It means that the website is designed to only include the necessary functionalities for its use.

 This methodology has **many advantages:**

- great performances;
- enhanced security;
- reduced costs;
- easier maintenance.
+- great performances
+- enhanced security
+- reduced costs
+- easier maintenance

 When the project requires it, I set up a content management system (CMS) decoupled from the interface. This ensures that **the website stays online** even if the CMS stops working.
--- a/src/data/HP/en/03-about.md
+++ b/src/data/HP/en/03-about.md
@ -2,26 +2,24 @@
 type: section
 id: about
 lang: en
+slug:
+createdAt:
 image: /assets/images/home/about.svg
 order: 3
 quickTitle: Me
 quickImage: /assets/images/home/icon-heart.svg
 ---

-## About
+## About.

-### Trainings myself
+### Trainings and certifications.

 In order to strengthen my skills, I have completed the following training and certifications:

- [Opquast](https://directory.opquast.com/en/certificat/CTQSKP/) - Mastering Web Quality Assurance;
- Access42 - Developing and coding accessible websites (cert number: 696fa2e0-cc67-11ec-88d2-9dabf3f992d4).
+- [Opquast](https://directory.opquast.com/en/certificat/CTQSKP/) - Mastering Web Quality Assurance
+- [Access42](https://certification.access42.pro/) - Developing and coding accessible websites (cert number: 696fa2e0-cc67-11ec-88d2-9dabf3f992d4)

-### Trainings others
-
-For several years, I have been teaching web development courses on various campuses.
-
-### Free time
+### Free time.

 I try to contribute to [open source projects](https://git.nardu.in/explore/repos) that I enjoy.

--- a/src/data/HP/fr/01-offre.md
+++ b/src/data/HP/fr/01-offre.md
@ -0,0 +1,30 @@
+---
+type: section
+id: offre
+lang: fr
+slug:
+createdAt:
+image: /assets/images/home/offres.svg
+order: 1
+quickTitle: Mes offres en freelance
+quickImage: /assets/images/home/icon-desktop.svg
+---
+
+## Offres site web.
+
+### Petit site vitrine, blog, landing page.
+
+Qu'il s'agisse d'une création ou d'une refonte, je m'occupe de tout&nbsp;:
+
+- propositions graphiques,
+- développement sur-mesure,
+- configuration d'un outil de gestion des contenus (si pertinent),
+- hébergement et mise en ligne
+- maintenance
+
+### Plus gros site, e-commerce.
+
+Lorsque le projet est plus volumineux, je fais appel à des partenaires talentueux partageant les mêmes valeurs&nbsp;:
+
+- [Rose Primaire](https://roseprimaire.com/) pour le conseil et l'accompagnement du projet,
+- [Sylvain Plantier](https://jedessinebien.com/) et/ou [Benoît Etchevery](http://ben-etche.com/) pour l'illustration et la direction artistique
--- a/src/data/HP/fr/01.1-offre.md
+++ b/src/data/HP/fr/01.1-offre.md
@ -1,19 +0,0 @@
---
-type: section
-id: offre
-lang: fr
-createdAt:
-image: /assets/images/home/offre-1.1.svg
-order: 1
-quickTitle: Mes offres en freelance
-quickImage: /assets/images/home/icon-desktop.svg
-reference: parole-expression
---
-
-## L'offre site web classique
-
-Cette offre est destinée à un public souhaitant **se doter d'un site web**, sans forcément intégrer l'accessibilité au cœur du projet. Le site sera malgré tout développé au plus proche des règles du [référentiel général d'amélioration de l'accessibilité](https://accessibilite.numerique.gouv.fr/) (<abbr>RGAA</abbr>).
-
-L'objectif principal de cette offre étant d'**établir une présence en ligne** pour le client. Que cette dernière ait un but informatif et/ou éditorial.
-
-<!-- <a href="/offres/web-classique" class="btn">L'offre classique en détails</a> -->
--- a/src/data/HP/fr/01.2-offre.md
+++ b/src/data/HP/fr/01.2-offre.md
@ -1,17 +0,0 @@
---
-type: section
-lang: fr
-image: /assets/images/home/offre-1.2.svg
-reference: rose-primaire
---
-
-## L'offre accessibilité avancée
-
-Cette offre s'adresse plus spécifiquement aux entités pour lesquelles **l'accessibilité du site est un critère majeur.** Qu'il s'agisse d'une création ou d'une mise en conformité après un audit d'accessibilité.
-
-Lorsque le projet le nécessite, je fais appel à des partenaires talentueux partageant les mêmes valeurs&nbsp;:
-
- [Rose Primaire](https://roseprimaire.com/) pour le conseil et l'accompagnement du projet&nbsp;;
- [Sylvain Plantier](https://jedessinebien.com/) et/ou [Benoît Etchevery](http://ben-etche.com/) pour l'illustration et la direction artistique.
-
-<!-- <a href="/offres/accessibilite" class="btn">L'offre accessibilité en détails</a> -->
--- a/src/data/HP/fr/01.3-offre.md
+++ b/src/data/HP/fr/01.3-offre.md
@ -1,9 +0,0 @@
---
-type: section
-lang: fr
-image: /assets/images/home/offre-1.3.svg
---
-
-## Et l'éco-conception alors&nbsp;?
-
-Je ne conçois pas l'éco-conception comme une offre. C'est plutôt une façon de travailler, voire même une vision de mon métier. On fait rarement de l'éco-conception sans accessibilité, j'applique donc ces méthodologies quelque soit le projet&nbsp;!
--- a/src/data/HP/fr/02-methodo.md
+++ b/src/data/HP/fr/02-methodo.md
@ -10,22 +10,22 @@ quickTitle: Ma méthodologie
 quickImage: /assets/images/home/icon-methodo.svg
 ---

-## Méthodologie
+## Méthodologie.

-### Accessibilité par défaut
+### Accessibilité par défaut.

 Engagé pour un web plus accessible, je crée des **sites web** en m'appuyant sur le [référentiel général d'amélioration de l'accessibilité (RGAA)](https://www.numerique.gouv.fr/publications/rgaa-accessibilite/) ainsi que sur les bonnes pratiques [Opquast.](https://www.opquast.com/rendre-le-web-meilleur/)

-### Sobriété par choix
+### Sobriété par choix.

 Je privilégie le développement de **sites statiques** en adoptant une approche [d'éco-conception numérique.](https://eco-conception.designersethiques.org/guide/fr/)  
 C'est-à-dire que le site est pensé pour n'embarquer que les fonctionnalités nécessaires à son utilisation.

 Cette approche présente de **nombreux avantages&nbsp;:**

- chargement rapide des pages&nbsp;;
- sécurité renforcée&nbsp;;
- coûts serveur réduits&nbsp;;
- maintenance facilitée.
+- chargement rapide des pages
+- sécurité renforcée
+- coûts serveur réduits
+- maintenance facilitée

 Lorsque le projet le demande, je mets en place un outil de gestion des contenus (CMS) découplé de l'interface. Cela permet de garantir que **le site reste en ligne** même si le CMS venait à ne plus fonctionner.
--- a/src/data/HP/fr/03-about.md
+++ b/src/data/HP/fr/03-about.md
@ -10,20 +10,16 @@ quickTitle: Moi
 quickImage: /assets/images/home/icon-heart.svg
 ---

-## À propos
+## À propos.

-### Formations personnelles
+### Formations et certifications.

 Afin de solidifier mes compétences, j'ai suivi les formations et passé les certifications suivantes&nbsp;:

- [Opquast](https://directory.opquast.com/fr/certificat/CTQSKP/) - Maîtrise de la qualité en projet web&nbsp;;
- Access42 - Développer et coder des sites accessibles (certificat numéro&nbsp;: 696fa2e0-cc67-11ec-88d2-9dabf3f992d4).
+- [Opquast](https://directory.opquast.com/fr/certificat/CTQSKP/) - Maîtrise de la qualité en projet web
+- [Access42](https://certification.access42.pro/) - Développer et coder des sites accessibles (certificat numéro&nbsp;: 696fa2e0-cc67-11ec-88d2-9dabf3f992d4)

-### Formations des autres
-
-Depuis plusieurs années, j'interviens dans différents campus afin de dispenser des cours de développement web.
-
-### Temps libre
+### Temps libre.

 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/)

--- a/src/data/veille/en/2023.md
+++ b/src/data/veille/en/2023.md
@ -1,29 +0,0 @@
---
-lang: en
-title: 2023
-updatedAt: "2023-04-20T17:12:06.000Z"
---
-
- [mmm.page](https://build.mmm.page/) - Dead simple, drag & drop websites for anything
- [Color.io](https://www.color.io/) - Online Raw Editor & Color Grading App.
- [Addy's toolkit](https://toolkit.addy.codes/) - Tools & resources for web designers & developers.
- [3D in CSS](https://garden.bradwoods.io/notes/css/3d) – Explanations et examples of 3D in CSS.
- [Fable](https://fable.app) – Motion design app.
- [Rive](https://rive.app) – Motion design app.
- [Cake Desk](https://cakedesk.app/) – Invoicing application.
- [Smooth CSS shadow](https://shadows.brumm.af/) – Generator.
- [Smol CSS](https://smolcss.dev/) – CSS snippets.
- [Optical adjustment](https://marvelapp.com/blog/optical-adjustment-logic-vs-designers/) – Optical vs logical alignment.
- [Datawrapper](https://blog.datawrapper.de/category/datavis-dos-and-donts/) – Advice on data visualization.
- [Assistivlabs](https://assistivlabs.com/) – Test accessibility with real softwares.
- [`time` input done right](https://adamsilver.io/blog/designing-a-time-input-backed-by-research/) – Article.
- [Tabby](https://tabby.sh) – An alternative terminal app.
- [Newglyph](https://newglyph.com/) – Independant foundry.
- [Headless UI](https://headlessui.com/vue/dialog) – LUI librairy in vue and react.
- [Sexy privacy](https://privacy.sexy) – Privacy tools for windows and macos.
- [33 JavaScript concepts](https://github.com/leonardomso/33-js-concepts) – Articles.
- [Formbricks](https://formbricks.com/) – Open source alternative to google form/typeform.
- [SVG loader](https://github.com/n3r4zzurr0/svg-spinners) – Collection.
- [a11yphant](https://a11yphant.com/) – Code challenges to learn accessibility.
- [Modern CSS](https://moderncss.dev/) – CSS snippets.
- [Moderne CSS container](https://twitter.com/KevinJPowell/status/1501555193799925761) – Tweet from Kevin Powell ❤️
--- a/src/data/veille/fr/2023.md
+++ b/src/data/veille/fr/2023.md
@ -1,34 +0,0 @@
---
-lang: fr
-title: 2023
-updatedAt: "2023-04-20T17:12:06.000Z"
---
-
- [mmm.page](https://build.mmm.page/) - Éditeur de sites web très simples, en glisser-déposer, pour n'importe quoi.
- [Color.io](https://www.color.io/) - Éditeur photo en ligne.
- [Addy's toolkit](https://toolkit.addy.codes/) - Outils et ressources pour les designers et développeurs sites web.
- [L’accessibilité n’est pas une variable d’ajustement](https://www.sophie-drouvroy.com/blog/laccessibilite-nest-pas-une-variable-dajustement/) — Sophie Drouvroy, intégratrice front-end, partage son quotidien en tant que personne sourde dans notre société.
-  > L’accessibilité doit être au cœur du projet et pas une cerise sur le gâteau.
- [3D en CSS (english)](https://garden.bradwoods.io/notes/css/3d) – Explications et exemples des propriétés 3D en CSS.
- [Climat&nbsp;: Comment ne pas déprimer&nbsp;?](https://www.lemonde.fr/podcasts/article/2022/06/21/climat-comment-ne-pas-deprimer_6131347_5463015.html) – Podcast.
- [Fable (english)](https://fable.app) – Application de motion design.
- [Rive (english)](https://rive.app) – Application de motion design.
- [Cake Desk](https://cakedesk.app/) – Application de facturation.
- [Ombre fluide en CSS](https://shadows.brumm.af/) – Générateur.
- [Smol CSS](https://smolcss.dev/) – Collection de fragments CSS.
- [Ajustement optique](https://marvelapp.com/blog/optical-adjustment-logic-vs-designers/) (english) – Aligner visuellement plutôt que techniquement.
- [Datawrapper](https://blog.datawrapper.de/category/datavis-dos-and-donts/) (english) – Conseils pour montrer de la donnée.
- [Assistivlabs](https://assistivlabs.com/) (english) – Service de test des technologies d'assistance (browserstack mais pour l'accessibilité).
- [Les caractères fantaisistes et l'accessibilité](https://www.lalutineduweb.fr/detournement-unicode-emojis-accessibilite/) – Explications et exemples de l'enfer que sont les caractères Unicode pour les technologies d'assistance.
- [Créer un champ `time` sur le web](https://adamsilver.io/blog/designing-a-time-input-backed-by-research/) (english) – Article.
- [La cascade](https://la-cascade.io) – Collection d'articles sur le CSS.
- [Tabby](https://tabby.sh) (english) – An alternative terminal app.
- [Newglyph](https://newglyph.com/) – Fonderie indépendante.
- [<span lang="en">Headless UI</span>](https://headlessui.com/vue/dialog) (english) – Librairie de composants vue et react.
- [Vie privée sexy](https://privacy.sexy) (english) – Outils de confidentialité pour windows et macos.
- [33 concepts JavaScript](https://github.com/leonardomso/33-js-concepts) (english) – Articles.
- [Formbricks](https://formbricks.com/) (english) – Alternative open source à google form/typeform.
- [Animations de chargement SVG](https://github.com/n3r4zzurr0/svg-spinners) – Collection.
- [a11yphant](https://a11yphant.com/) (english) – Challenges de code pour apprendre l'accessibilité.
- [CSS moderne](https://moderncss.dev/) (english) – Fragments CSS.
- [Conteneur moderne en CSS](https://twitter.com/KevinJPowell/status/1501555193799925761) (english) – Tweet de Kevin Powell ❤️
--- a/src/env.d.ts
+++ b/src/env.d.ts
@ -1,4 +1,4 @@
 /// <reference path="../.astro/types.d.ts" />
-/// <reference types="astro/client" />
+/// <reference types="@astrojs/image/client" />

 /// <reference path="../.astro-i18n/generated.d.ts" />
--- a/src/fonts/recoleta/Recoleta-Bold.woff2
+++ b/src/fonts/recoleta/Recoleta-Bold.woff2
--- a/src/fonts/recoleta/Recoleta-SemiBold.woff2
+++ b/src/fonts/recoleta/Recoleta-SemiBold.woff2
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@ -1,6 +1,6 @@
 {
 	"accueil": "home",
-	"tagline": "Freelance web developer specialized in accessibility.",
+	"tagline": "Freelance web designer and front-end developer.",
 	"copyright": "(re)Made with Astro",
 	"contact": {
 		"title": "contact",
@ -33,15 +33,12 @@
 		"titre": "snippets",
 		"tagline": "School with Nicool."
 	},
-	"references": {
-		"titre": "work",
-		"slug": "work",
+	"projet": {
+		"titre": "projects",
+		"tagline": "Freelance work",
 		"cta": "Visit website",
-		"tagline": "Some work."
-	},
-	"veille": {
-		"titre": "Around the web",
-		"tagline": "Some links that interested me."
+		"lienTitle": "Website of",
+		"fenetre": "(new window)"
 	},
 	"erreur": {
 		"introuvable": "Sorry, page not found.",
@ -49,20 +46,17 @@
 		"lienRetour": "Back to the home page"
 	},
 	"seo": {
-		"meta": {
-			"description": "Web developer specialized in accessibility and eco-design in Toulouse, France. Development of custom websites, RGAA compliance, maintenance, etc."
-		},
 		"article": {
 			"title": "Articles",
 			"description": "A few articles about graphic design and front-end development."
 		},
+		"projet": {
+			"title": "Projects",
+			"description": "Some of my work as a freelance web designer and developer."
+		},
 		"code": {
 			"title": "Snippets",
 			"description": "Snippets of fresh, easy and accessible code."
-		},
-		"references": {
-			"title": "Work",
-			"description": "A few case studies I worked on as a front-end developer."
 		}
 	}
 }
--- a/src/i18n/fr.json
+++ b/src/i18n/fr.json
@ -1,6 +1,6 @@
 {
 	"accueil": "accueil",
-	"tagline": "Développeur web spécialisé en accessibilité.",
+	"tagline": "Designer et developpeur web freelance à Toulouse.",
 	"copyright": "(re)Fait avec Astro",
 	"contact": {
 		"title": "contact",
@ -33,15 +33,12 @@
 		"titre": "fragments",
 		"tagline": "Les tutos de Nico mdr."
 	},
-	"references": {
-		"titre": "références",
-		"slug": "references",
+	"projet": {
+		"titre": "projets",
+		"tagline": "Mon travail en freelance",
 		"cta": "Consulter le site",
-		"tagline": "Quelques références."
-	},
-	"veille": {
-		"titre": "veille",
-		"tagline": "Des liens, en vrac."
+		"lienTitle": "Site web de",
+		"fenetre": "(nouvelle fenêtre)"
 	},
 	"erreur": {
 		"introuvable": "Page introuvable",
@ -49,20 +46,17 @@
 		"lienRetour": "Retour à l’accueil"
 	},
 	"seo": {
-		"meta": {
-			"description": "Développeur web spécialisé en accessibilité numérique et éco-conception à Toulouse. Création de sites web sur mesure, mise en conformité RGAA, maintenance, etc."
-		},
 		"article": {
 			"title": "Articles",
-			"description": "Quelques articles sur le développement web front-end et l'informatique à Toulouse."
+			"description": "Quelques articles en tant que graphiste et développeur front-end à Toulouse."
+		},
+		"projet": {
+			"title": "Projets",
+			"description": "Mon travail en tant que graphiste et développeur front-end à Toulouse."
 		},
 		"code": {
 			"title": "Fragments",
 			"description": "Fragments de codes stylés, faciles et accessibles."
-		},
-		"references": {
-			"title": "Références",
-			"description": "Quelques travaux réalisés en tant que et développeur web front-end à Toulouse."
 		}
 	}
 }
--- a/src/layouts/BaseLayout.astro
+++ b/src/layouts/BaseLayout.astro
@ -4,15 +4,19 @@ astroI18n.init(Astro);

 import "../styles/style.css";

-import Head from "../components/Head.astro";
 import Header from "../components/Header.astro";
 import Footer from "../components/Footer.astro";

-const { pageTitle } = Astro.props;
+const { pageTitle, titleColor } = Astro.props;
 ---

 <html lang={astroI18n.langCode} dir="ltr">
-	<Head pageTitle={pageTitle} />
+	<head>
+		<meta charset="utf-8" />
+		<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+		<meta name="viewport" content="width=device-width" />
+		<title>{pageTitle} - Nicolas Arduin</title>
+	</head>
 	<body>
 		<div class="wrapper">
 			<Header />
@ -22,4 +26,9 @@ const { pageTitle } = Astro.props;
 		</div>
 		<Footer />
 	</body>
+	<style define:vars={{ titleColor }}>
+		h1 {
+			color: var(--titleColor);
+		}
+	</style>
 </html>
--- a/src/pages/articles/[slug].astro
+++ b/src/pages/articles/[slug].astro
@ -1,30 +1,21 @@
 ---
-import { createStaticPaths } from "astro-i18n";
+import { l, t, astroI18n } from "astro-i18n";
+astroI18n.init(Astro);

 import { getCollection } from "astro:content";
-
 import EditorialContent from "../../components/EditorialContent.astro";
+
 import BaseLayout from "../../layouts/BaseLayout.astro";

-export const getStaticPaths = createStaticPaths(async ({ langCode }) => {
+export async function getStaticPaths() {
 	const articles = await getCollection("articles", ({ data }) => {
-		return data.lang === langCode;
+		return data.lang === astroI18n.langCode;
 	});
 	return articles.map((article) => ({
-		params: { slug: article.data.permalink },
+		params: { slug: article.slug },
 		props: { article },
 	}));
-}, import.meta.url);
-
-// export async function getStaticPaths() {
-// 	const articles = await getCollection("articles", ({ data }) => {
-// 		return data.lang === astroI18n.langCode;
-// 	});
-// 	return articles.map((article) => ({
-// 		params: { slug: article.slug },
-// 		props: { article },
-// 	}));
-// }
+}

 const { article } = Astro.props;
 ---
--- a/src/pages/en/articles/[slug].astro
+++ b/src/pages/en/articles/[slug].astro
@ -1,13 +1,7 @@
 ---
 import Page from "../../articles/[slug].astro"
-import { getStaticPaths as proxyGetStaticPaths } from "../../articles/[slug].astro"
-import { extractRouteLangCode } from "astro-i18n"

-/* @ts-ignore */
-export const getStaticPaths = (props) => proxyGetStaticPaths({
-	...props,
-	langCode: extractRouteLangCode(import.meta.url),
-})
+export { getStaticPaths } from "../../articles/[slug].astro"

 const { props } = Astro
 ---
--- a/src/pages/en/articles/index.astro
+++ b/src/pages/en/articles/index.astro
@ -1,5 +1,6 @@
 ---
 import Page from "../../articles/index.astro"
+
 const { props } = Astro
 ---

--- a/src/pages/en/index.astro
+++ b/src/pages/en/index.astro
@ -1,5 +1,6 @@
 ---
 import Page from "../index.astro"
+
 const { props } = Astro
 ---

--- a/src/pages/en/rss.xml.js
+++ b/src/pages/en/rss.xml.js
@ -1,34 +0,0 @@
-import rss from "@astrojs/rss";
-import { getCollection } from "astro:content";
-
-export async function get(context) {
-	const articles = await getCollection("articles", ({ data }) => {
-		return data.lang === "en" && !data.draft;
-	});
-	const fragments = await getCollection("fragments", ({ data }) => {
-		return data.lang === "en" && !data.draft;
-	});
-	const posts = articles.concat(fragments);
-	return rss({
-		// `<title>` field in output xml
-		title: "Nicolas Arduin",
-		// `<description>` field in output xml
-		description: "Articles from nardu.in",
-		// Pull in your project "site" from the endpoint context
-		// https://docs.astro.build/en/reference/api-reference/#contextsite
-		site: context.site,
-		// Array of `<item>`s in output xml
-		// See "Generating items" section for examples using content collections and glob imports
-		items: posts.map((post) => ({
-			title: post.data.title,
-			pubDate: post.data.createdAt,
-			description: post.data.subtitle,
-			lang: post.data.lang,
-			// Compute RSS link from post `slug`
-			// This example assumes all posts are rendered as `/blog/[slug]` routes
-			link: `/en/${post.data.type}/${post.data.permalink}/`,
-		})),
-		// (optional) inject custom xml
-		customData: `<language>en-us</language>`,
-	});
-}
--- a/src/pages/en/sitemap.astro
+++ b/src/pages/en/sitemap.astro
@ -1,5 +1,6 @@
 ---
 import Page from "../plan-du-site.astro"
+
 const { props } = Astro
 ---

--- a/src/pages/en/snippets/[slug].astro
+++ b/src/pages/en/snippets/[slug].astro
@ -1,13 +1,7 @@
 ---
 import Page from "../../fragments/[slug].astro"
-import { getStaticPaths as proxyGetStaticPaths } from "../../fragments/[slug].astro"
-import { extractRouteLangCode } from "astro-i18n"

-/* @ts-ignore */
-export const getStaticPaths = (props) => proxyGetStaticPaths({
-	...props,
-	langCode: extractRouteLangCode(import.meta.url),
-})
+export { getStaticPaths } from "../../fragments/[slug].astro"

 const { props } = Astro
 ---
--- a/src/pages/en/snippets/index.astro
+++ b/src/pages/en/snippets/index.astro
@ -1,5 +1,6 @@
 ---
 import Page from "../../fragments/index.astro"
+
 const { props } = Astro
 ---

--- a/src/pages/en/tags/[tag].astro
+++ b/src/pages/en/tags/[tag].astro
@ -0,0 +1,9 @@
+---
+import Page from "../../tags/[tag].astro"
+
+export { getStaticPaths } from "../../tags/[tag].astro"
+
+const { props } = Astro
+---
+
+<Page {...props} />
--- a/src/pages/en/tags/index.astro
+++ b/src/pages/en/tags/index.astro
@ -0,0 +1,7 @@
+---
+import Page from "../../tags/index.astro"
+
+const { props } = Astro
+---
+
+<Page {...props} />
--- a/src/pages/en/veille/index.astro
+++ b/src/pages/en/veille/index.astro
@ -1,6 +0,0 @@
---
-import Page from "../../veille/index.astro"
-const { props } = Astro
---
-
-<Page {...props} />
--- a/src/pages/en/work/index.astro
+++ b/src/pages/en/work/index.astro
@ -1,6 +0,0 @@
---
-import Page from "../../references/index.astro"
-const { props } = Astro
---
-
-<Page {...props} />
--- a/src/pages/fragments/[slug].astro
+++ b/src/pages/fragments/[slug].astro
@ -1,30 +1,21 @@
 ---
-import { createStaticPaths } from "astro-i18n";
+import { l, t, astroI18n } from "astro-i18n";
+astroI18n.init(Astro);

 import { getCollection } from "astro:content";
 import EditorialContent from "../../components/EditorialContent.astro";

 import BaseLayout from "../../layouts/BaseLayout.astro";

-export const getStaticPaths = createStaticPaths(async ({ langCode }) => {
+export async function getStaticPaths() {
 	const snippets = await getCollection("fragments", ({ data }) => {
-		return data.lang === langCode;
+		return data.lang === astroI18n.langCode;
 	});
 	return snippets.map((snippet) => ({
-		params: { slug: snippet.data.permalink },
+		params: { slug: snippet.slug },
 		props: { snippet },
 	}));
-}, import.meta.url);
-
-// export async function getStaticPaths() {
-// 	const snippets = await getCollection("fragments", ({ data }) => {
-// 		return data.lang === astroI18n.langCode;
-// 	});
-// 	return snippets.map((snippet) => ({
-// 		params: { slug: snippet.slug },
-// 		props: { snippet },
-// 	}));
-// }
+}

 const { snippet } = Astro.props;
 ---
--- a/src/pages/i18n/en.json
+++ b/src/pages/i18n/en.json
@ -1,5 +1,5 @@
 {
-	"title": "Crafting  <a href='#methodology' class='clean-link'>sober and accessible</a> <span class='highlight'>websites</span>",
+	"title": "Crafting  <a href='#methodology' clean-link>sober and accessible</a> <span class='highlight'>websites</span>",
 	"subtitle": "Learn more about…",
 	"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.",
--- a/src/pages/i18n/fr.json
+++ b/src/pages/i18n/fr.json
@ -1,5 +1,5 @@
 {
-	"title": "Création de <span class='highlight'>sites&nbsp;web</span> <a href='/articles/faq' class='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.",
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@ -35,9 +35,6 @@ const localizedSnippets = await getCollection("fragments", ({ data }) => {
 const sortedSnippets = localizedSnippets.sort(
 	(a, b) => b.data.createdAt - a.data.createdAt
 );
-const localizedReferences = await getCollection("references", ({ data }) => {
-	return data.lang === astroI18n.langCode && !data.draft;
-});
 ---

 <BaseLayout pageTitle={pageTitle}>
@ -47,14 +44,11 @@ const localizedReferences = await getCollection("references", ({ data }) => {
 			<h2 class="intro__subtitle">{t("index.subtitle")}</h2>
 			<ul class="quick-access__list" role="list">
 				{
-					localizedSections.map(
-						(section) =>
-							section.frontmatter.id && (
-								<li>
-									<QuickAccessCard item={section.frontmatter} />
-								</li>
-							)
-					)
+					localizedSections.map((section) => (
+						<li>
+							<QuickAccessCard item={section.frontmatter} />
+						</li>
+					))
 				}
 			</ul>
 		</section>
@ -66,16 +60,6 @@ const localizedReferences = await getCollection("references", ({ data }) => {
 				<div class="section__container">
 					<div class="flow section__content">
 						<section.Content />
-						{section.frontmatter.reference && (
-							<div class="section__reference">
-								<ListCards
-									list={localizedReferences.filter((ref) => {
-										return ref.data.permalink === section.frontmatter.reference;
-									})}
-									routeName={t("references.slug")}
-								/>
-							</div>
-						)}
 					</div>
 					<div class="section__image">
 						<img
@ -165,7 +149,6 @@ const localizedReferences = await getCollection("references", ({ data }) => {

 	/* SECTIONS */
 	.section {
-		--region-space: var(--space-l-3xl);
 		container-name: section;
 		container-type: inline-size;
 	}
@ -173,7 +156,7 @@ const localizedReferences = await getCollection("references", ({ data }) => {
 		display: flex;
 		flex-direction: column;
 		align-items: center;
-		gap: var(--space-m-xl);
+		gap: var(--space-m-l);
 	}

 	.section :global(h2) {
@ -194,33 +177,20 @@ const localizedReferences = await getCollection("references", ({ data }) => {

 	@container section (min-width: 50rem) {
 		.section__container {
-			position: relative;
 			flex-direction: row;
 			align-items: flex-start;
 		}
 		.section__image {
 			order: 1;
 			position: sticky;
-			top: var(--space-3xl);
+			top: 20px;
 			flex-grow: 1;
 			flex-basis: 18rem;
 		}
 		.section__content {
 			order: 2;
 			flex-basis: 0;
-			min-inline-size: 32ch;
-			font-size: var(--size-1);
-		}
-		.section__content :global(h2) {
-			font-size: var(--size-5);
-			line-height: 1.2;
-		}
-		.section__reference {
-			margin-block-start: 50vh;
-			padding-block-end: var(--space-3xl);
-		}
-		.section__reference :global(.card a) {
-			font-size: var(--size-0);
+			min-inline-size: 40ch;
 		}
 	}
 </style>
--- a/src/pages/plan-du-site.astro
+++ b/src/pages/plan-du-site.astro
@ -61,21 +61,17 @@ const pageTitle = t("sitemap");
 					}
 				</ul>
 			</li>
-			<li>
-				<h2>
-					<a href={l("/references")}>{t("references.titre")}</a>
-				</h2>
-			</li>
-			<li>
-				<h2>
-					<a href={l("/veille")}>{t("veille.titre")}</a>
-				</h2>
-			</li>
 		</ul>
 	</section>
 </BaseLayout>

 <style>
+	/* :link {
+  text-decoration: underline;
+}
+:link:hover {
+  text-decoration: none;
+} */
 	h2 {
 		text-transform: capitalize;
 	}
--- a/src/pages/references/i18n/en.json
+++ b/src/pages/references/i18n/en.json
@ -1,4 +0,0 @@
-{
-	"pageName": "Work",
-	"subtitle": "Some fine websites right here."
-}
--- a/src/pages/references/i18n/fr.json
+++ b/src/pages/references/i18n/fr.json
@ -1,4 +0,0 @@
-{
-	"pageName": "Références",
-	"subtitle": "Des sites web de qualité."
-}
--- a/src/pages/references/index.astro
+++ b/src/pages/references/index.astro
@ -1,44 +0,0 @@
---
-import { l, t, astroI18n } from "astro-i18n";
-astroI18n.init(Astro);
-
-// New astro content collections
-import { getCollection } from "astro:content";
-
-import BaseLayout from "../../layouts/BaseLayout.astro";
-import ListCards from "../../components/ListCards.astro";
-
-const localizedPost = await getCollection("references", ({ data }) => {
-	return data.lang === astroI18n.langCode && !data.draft;
-});
-// sort references by descending publication date
-const sortedReferences = localizedPost.sort(
-	(a, b) => b.data.createdAt - a.data.createdAt
-);
-
-const pageTitle = t("index.references.pageName");
---
-
-<BaseLayout pageTitle={pageTitle}>
-	<section class="region flow">
-		<h1>{t("index.references.pageName")}</h1>
-		<h2>{t("index.references.subtitle")}</h2>
-		<ListCards list={sortedReferences} routeName={t("references.slug")} />
-	</section>
-</BaseLayout>
-
-<style>
-	.flow h2 + :global(*) {
-		margin-block-start: var(--space-m-l);
-	}
-	h1 {
-		text-transform: capitalize;
-	}
-	h1,
-	h2 {
-		padding-inline-start: var(--space-xs-s);
-	}
-	h2 {
-		color: var(--color-brique);
-	}
-</style>
--- a/src/pages/rss.xml.js
+++ b/src/pages/rss.xml.js
@ -1,34 +0,0 @@
-import rss from "@astrojs/rss";
-import { getCollection } from "astro:content";
-
-export async function get(context) {
-	const articles = await getCollection("articles", ({ data }) => {
-		return data.lang === "fr" && !data.draft;
-	});
-	const fragments = await getCollection("fragments", ({ data }) => {
-		return data.lang === "fr" && !data.draft;
-	});
-	const posts = articles.concat(fragments);
-	return rss({
-		// `<title>` field in output xml
-		title: "Nicolas Arduin",
-		// `<description>` field in output xml
-		description: "Articles publiés sur nardu.in",
-		// Pull in your project "site" from the endpoint context
-		// https://docs.astro.build/en/reference/api-reference/#contextsite
-		site: context.site,
-		// Array of `<item>`s in output xml
-		// See "Generating items" section for examples using content collections and glob imports
-		items: posts.map((post) => ({
-			title: post.data.title,
-			pubDate: post.data.createdAt,
-			description: post.data.subtitle,
-			lang: post.data.lang,
-			// Compute RSS link from post `slug`
-			// This example assumes all posts are rendered as `/blog/[slug]` routes
-			link: `/${post.data.type}/${post.data.permalink}/`,
-		})),
-		// (optional) inject custom xml
-		customData: `<language>fr-fr</language>`,
-	});
-}
--- a/src/pages/tags/[tag].astro
+++ b/src/pages/tags/[tag].astro
@ -0,0 +1,30 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+
+export async function getStaticPaths({}) {
+	const allPosts = await Astro.glob("../../content/**/*.mdx");
+	const uniqueTags = [
+		...new Set(allPosts.map((post) => post.frontmatter.tags).flat()),
+	];
+
+	return uniqueTags.map((tag) => {
+		const filteredPosts = allPosts.filter((post) =>
+			post.frontmatter.tags.includes(tag)
+		);
+		return {
+			params: { tag },
+			props: { posts: filteredPosts },
+		};
+	});
+}
+
+const { tag } = Astro.params;
+const { posts } = Astro.props;
+---
+
+<BaseLayout pageTitle={tag}>
+	<p>Posts tagged with {tag}</p>
+	<ul>
+		{posts.map((post) => <li>{post.frontmatter.title}</li>)}
+	</ul>
+</BaseLayout>
--- a/src/pages/tags/index.astro
+++ b/src/pages/tags/index.astro
@ -0,0 +1,20 @@
+---
+import BaseLayout from "../../layouts/BaseLayout.astro";
+
+const pageTitle = "Tag Index";
+const allPosts = await Astro.glob("../../content/**/*.mdx");
+const tags = [...new Set(allPosts.map((post) => post.frontmatter.tags).flat())];
+---
+
+<BaseLayout pageTitle={pageTitle}>
+	<h2>All the categories</h2>
+	<ul>
+		{
+			tags.map((tag) => (
+				<li>
+					<a href={`/tags/${tag}`}>{tag}</a>
+				</li>
+			))
+		}
+	</ul>
+</BaseLayout>
--- a/Show More
+++ b/Show More