i18n updates + HP + components

This commit is contained in:
Nico 2022-12-22 11:01:52 +01:00
parent 1ab35db47d
commit 23c79e579c
67 changed files with 1355 additions and 542 deletions

View File

@ -1,10 +1,10 @@
type DefaultLangCode = "fr"
type SupportedLangCode = "en"
type LangCode = "fr" | "en"
type RouteUri = | "/articles" | "/tags/[tag]" | "/tags" | "/"
type RouteParams = {"/articles": undefined; "/tags/[tag]": { "tag": string; }; "/tags": undefined; "/": undefined; }
type TranslationPath = "accueil" | "tagline" | "copyright" | "contact" | "contactLien" | "contactTel" | "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" | "index.title" | "index.quoi" | "index.comment" | "index.opensource" | "index.projetsRecents" | "index.articlesRecents"
type TranslationOptions = { "accueil": {} | undefined; "tagline": {} | undefined; "copyright": {} | undefined; "contact": {} | undefined; "contactLien": {} | undefined; "contactTel": {} | 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": {} | undefined; "index.title": {} | undefined; "index.quoi": {} | undefined; "index.comment": {} | undefined; "index.opensource": {} | undefined; "index.projetsRecents": {} | undefined; "index.articlesRecents": {} | undefined; }
type LangCode = DefaultLangCode | SupportedLangCode
type RouteUri = | "/articles/[slug]" | "/articles" | "/tags/[tag]" | "/tags" | "/"
type RouteParams = {"/articles/[slug]": { "slug": string; }; "/articles": undefined; "/tags/[tag]": { "tag": string; }; "/tags": undefined; "/": 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.title" | "index.subtitle" | "index.quoi" | "index.comment" | "index.opensource" | "index.writing" | "index.latestProjects" | "index.latestArticles" | "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.title": {} | undefined; "index.subtitle": {} | undefined; "index.quoi": {} | undefined; "index.comment": {} | undefined; "index.opensource": {} | undefined; "index.writing": {} | undefined; "index.latestProjects": {} | undefined; "index.latestArticles": {} | undefined; "contact.contenuVide": {} | undefined; }
declare module "astro-i18n" {
export * from "astro-i18n/"
@ -12,17 +12,19 @@ declare module "astro-i18n" {
export function l<Uri extends RouteUri>(
route: Uri | string & {},
...args: undefined extends RouteParams[Uri]
? [params?: RouteParams[Uri], query?: Record<string, string>, langCode?: LangCode]
: [params: RouteParams[Uri], query?: Record<string, string>, langCode?: LangCode]
? [params?: RouteParams[Uri], targetLangCode?: LangCode, routeLangCode?: LangCode]
: [params: RouteParams[Uri], targetLangCode?: LangCode, routeLangCode?: LangCode]
): string
export function t<Path extends TranslationPath>(
path: Path | string & {},
path: Path,
...args: undefined extends TranslationOptions[Path]
? [options?: TranslationOptions[Path], langCode?: LangCode]
: [options: TranslationOptions[Path], langCode?: LangCode]
): string
export function extractRouteLangCode(route: string): LangCode | undefined
type Translation = string | { [translationKey: string]: string | Translation }
type Translations = { [langCode: string]: Record<string, Translation> }
type RouteTranslations = { [langCode: string]: Record<string, string> }
@ -37,6 +39,7 @@ declare module "astro-i18n" {
get langCode(): LangCode
set langCode(langCode: LangCode)
get formatters(): Record<string, InterpolationFormatter>
init(Astro: { url: URL }, formatters?: Record<string, InterpolationFormatter>): void
getFormatter(name: string): InterpolationFormatter | undefined
setFormatter(name: string, formatter: InterpolationFormatter): void
deleteFormatter(name: string): void

View File

@ -9,5 +9,8 @@ import mdx from "@astrojs/mdx";
// https://astro.build/config
export default defineConfig({
experimental: {
contentCollections: true,
},
integrations: [i18n(), image(), mdx()],
});

View File

@ -8,9 +8,5 @@ export default defineAstroI18nConfig({
fr: "src/i18n/fr.json",
en: "src/i18n/en.json",
},
routeTranslations: {
en: {
articles: "blog",
},
},
routeTranslations: {},
});

View File

@ -13,15 +13,13 @@
"i18n:sync": "astro-i18n sync"
},
"dependencies": {
"@astrojs/image": "^0.12.0",
"@astrojs/mdx": "^0.12.0",
"@astrojs/rss": "^1.0.3",
"astro": "^1.6.12",
"astro-i18n": "^1.2.0",
"open-props": "^1.5.1"
"@astrojs/image": "^0.12.1",
"@astrojs/mdx": "^0.13.0",
"astro": "1.7.2",
"astro-i18n": "^1.4.1"
},
"devDependencies": {
"autoprefixer": "^10.4.13",
"postcss": "^8.4.19"
"postcss": "^8.4.20"
}
}

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,8 @@
<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 325 350.01">
<path fill="#ff826c" d="M200 0v174.86h-10V110h-30v20h-14.8v44.86H110V240h100.2v-60H230V0h-30z"/>
<path fill="#162e57" d="M195 85h-49.8v45H160v-20h35V85z"/>
<path fill="#d4ebf2" d="M50 240h64.72v60H50zm185.18-60.26V240H125v60h165V179.74h-54.82z"/>
<path fill="#ff826c" d="M290 205h30v20h-30z"/>
<path fill="#d4ebf2" d="M80 309.98h70v10.03H80zM0 300h70v10.03H0zm255 0h70v10.03h-70zm-115 29.98h70v10.03h-70zm-105 10h70v10.03H35z"/>
<path fill="#ff826c" d="M100 185h30v125h-30z"/>
</svg>

After

Width:  |  Height:  |  Size: 582 B

View File

@ -0,0 +1,9 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150">
<g data-name="desktop">
<path fill="transparent" d="M0 0h150v150H0z"/>
<path fill="#162e57" d="M15 35h120v80H15z"/>
<path fill="#ff826c" d="M15 35h120v8H15z"/>
<path fill="#162e57" d="M17.67 37.67h2.67v2.67h-2.67zm5.33 0h2.67v2.67H23zm5.33 0H31v2.67h-2.67z"/>
<path fill="#ff826c" d="M25.67 59H55v26.67H25.67zm0 29.33H55V91H25.67zM60.33 59h29.33v26.67H60.33zm0 29.33h29.33V91H60.33zM95 59h29.33v26.67H95zm0 29.33h29.33V91H95z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 528 B

View File

@ -0,0 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150">
<g data-name="heart">
<path fill="transparent" d="M0 0h150v150H0z"/>
<path fill="#ff826c" d="M103.57 50.43V39H80.71v11.43H69.29V39H46.43v11.43H35v34.28h11.43v11.43h11.43v11.43h11.43V119h11.42v-11.43h11.43V96.14h11.43V84.71H115V50.43h-11.43z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 331 B

View File

@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 150 150">
<path fill="#162e57" d="m100.52 58.11 3.94 2.28 3.94 2.27 6.76-11.7-3.94-2.27 4.55-7.89-7.89-4.55-4.55 7.89-2.2 3.81-15.77-9.1 2.2-3.82 4.56-7.88-7.89-4.56-4.55 7.89-3.94-2.28-6.83 11.83 7.88 4.55-2.2 3.81 23.66 13.66 2.27-3.94zM51.75 87.95l-2.27 3.94-3.94-2.28-3.94-2.27-6.76 11.7 3.94 2.27-4.55 7.89 7.89 4.55 6.82-11.83 15.77 9.11-6.83 11.82 7.89 4.56 4.55-7.89 3.94 2.28 6.76-11.7-3.94-2.28-3.95-2.28 2.28-3.93-23.66-13.66z"/>
<path fill="#ff826c" d="m75.41 101.6-3.94-2.27L94.3 59.78l3.94 2.27h.01L74.59 48.39v.01l3.94 2.27L55.7 90.22l-3.94-2.27h-.01l23.66 13.66v-.01z"/>
</svg>

After

Width:  |  Height:  |  Size: 671 B

View File

@ -0,0 +1,8 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150">
<g data-name="mobile">
<path fill="#d4ebf2" d="M0 0h150v150H0z"/>
<path fill="#10113a" d="M48.33 25h53.33v100H48.33z"/>
<path fill="#162e57" d="M71.67 113.33h6.67V120h-6.67zM55 31.67h40v76.67H55z"/>
<path fill="#ff826c" d="M62.78 38.33h24.44v22.22H62.78zm0 24.45h24.44V65H62.78zm0 8.89h24.44v22.22H62.78zm0 24.44h24.44v2.22H62.78z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 429 B

View File

@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150">
<g data-name="articles">
<path fill="transparent" d="M0 0h150v150H0z"/>
<path fill="#162e57" d="M56.54 51.92v9.23H28.85v9.24H15v13.84h13.85v9.23h4.61v13.85h13.85V93.46h9.23v9.23h36.92V51.92H56.54z"/>
<path fill="#ff826c" d="M107.31 47.31h13.85v9.23h-13.85zm0 23.07H135v9.23h-27.69zm13.84-32.3H135v9.23h-13.85zm-13.84 55.38h13.85v9.23h-13.85zm13.84 9.23H135v9.23h-13.85z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 464 B

View File

@ -0,0 +1,12 @@
<svg id="aa0241e5-d9cf-4e93-b83f-4d24f8d4da9a" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 290 495">
<g>
<polygon points="114.46 90 0 90 0 295 34.46 295 34.46 495 64.46 495 64.46 295 79.46 295 79.46 495 109.46 495 109.46 295 114.46 295 114.46 90" fill="#162e57"/>
<polygon points="94.46 25.16 94.46 0 49.46 0 49.46 25.16 49.46 35.16 109.46 35.16 109.46 25.16 94.46 25.16" fill="#162e57"/>
</g>
<polygon points="280 125 280 120 285 120 290 120 290 105.16 285 105.16 285 95.16 275 95.16 275 105.16 275 110 255 110 255 105.16 255 95.16 245 95.16 245 105.16 240 105.16 240 120.16 250 120.16 250 125 255 125 255 175.16 250 175.16 250 180.16 245 180.16 240 180.16 240 195 245 195 245 205 255 205 255 190 275 190 275 205 285 205 285 195 290 195 290 180.16 285 180.16 280 180.16 280 175.16 275 175.16 275 125 280 125" fill="#10113a"/>
<g>
<polygon points="94.46 90 94.46 35.16 49.38 35.16 49.38 90 74.46 90 74.46 120 104.46 120 104.46 90 94.46 90" fill="#ff826c"/>
<polygon points="55 90 0 90 0 155 0 210.16 0 305 34.46 305 34.46 210.16 55 210.16 55 90" fill="#ff826c"/>
<polygon points="275 125 240 125 240 130 155 130 114.46 130 114.46 165 155 165 255 165 255 142.53 275 142.53 275 125" fill="#ff826c"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -0,0 +1,14 @@
<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 510 495">
<path fill="#162e57" d="M40 280h30v215H40zm60 0H75v125h10v90h30V280h-15z"/>
<path fill="#ff826c" d="M60 0v90h45V30h15V0H60z"/>
<path fill="#d4ebf2" d="M15 90h115v190H15z"/>
<path fill="#162e57" d="M85 90h15v135H85z"/>
<path fill="#ff826c" d="M130 110V90h-25v315h25V140h120v-30H130z"/>
<path fill="#162e57" d="M280 185v-15h-5v-15h-5v-55h5v-5h-30v5h5v55h-5v15h-5v15h-10v25h60v-25h-10z"/>
<path fill="#ff826c" d="M275 65h10v10h-10zm-15 10h5v5h-5zm0-30h10v10h-10zm130 165v-5h-10v-80h5v-5h-25v5h5v80h-10v5h-5v30h5v5h35v-5h5v-30h-5zm40-90v5h5v115h15V125h5v-5h-25z"/>
<path fill="#d4ebf2" d="M365 145v5h40v110h5V150h40v-5h-85z"/>
<path fill="#ff826c" d="M440 240h5v5h-5z"/>
<path fill="#162e57" d="M435 195h15v45h-15z"/>
<path fill="#d4ebf2" d="M510 260H180v25h10v210h310V285h10v-25z"/>
<path fill="#ff826c" d="M15 90v25H0v195h15v95h60V90H15z"/>
</svg>

After

Width:  |  Height:  |  Size: 953 B

View File

@ -0,0 +1,11 @@
<svg xmlns="http://www.w3.org/2000/svg" data-name="aefb6044-044f-4f8d-bc9f-2a475efc35ba" viewBox="0 0 420 390">
<path fill="#ff826c" d="M155 20h40v50.21h-40Zm0-20h50v20h-50Z"/>
<path fill="#d4ebf2" d="M255 150H155V40H70v30H40v140.57h115V180h100v-30z"/>
<path fill="#ff826c" d="M280 180h-25v-25h25Z"/>
<path fill="#10113a" d="M40 210v40h145v140h40V210Zm305-110v85h-90v12.54h110V100Z"/>
<path fill="#ff826c" d="M240 195h177.33v25H240Zm75 25h30v170h-30Z"/>
<path fill="#10113a" d="M315 220h30v15h-30Z"/>
<path fill="#ff826c" d="M30 250V105H0v170h10v115h20V275h80v115h20V275h10v-25Z"/>
<path fill="#d4ebf2" d="M410 155v-10h-30v50h30v-15h5v-5h-5v-14.95h5V175h5v-20h-10z"/>
<path fill="#ff826c" d="M385 55h10v20h-10Zm-10 30h10v10h-10Zm20-40h10v10h-10Zm-5 55h15v10h-15Zm10 20h5v15h-5Zm-10 20h5v5h-5Z"/>
</svg>

After

Width:  |  Height:  |  Size: 821 B

View File

@ -0,0 +1,112 @@
---
const { item, routeName } = Astro.props;
---
<div class="card">
<div>
<h3>
<a class="card__link" href={`${routeName}/${item.frontmatter.slug}`}
>{item.frontmatter.title}</a
>
</h3>
<h4>{item.frontmatter.subtitle}</h4>
<!-- <tags-list list={item.tags}></tags-list> -->
</div>
</div>
<style scoped>
.card {
padding: 2.4rem 1.6rem;
position: relative;
display: block;
height: 100%;
cursor: pointer;
box-shadow: var(--shadow-elevation-medium);
background-color: var(--white);
}
.card:hover {
box-shadow: var(--shadow-elevation-high);
}
.card:focus-within {
box-shadow: var(--shadow-elevation-high);
}
.card:hover h3::after,
.card:focus-within h3::after {
transform: translateX(0);
opacity: 1;
}
.card:hover h3,
.card:focus-within h3 {
color: var(--brique);
}
.card::before {
content: "";
position: absolute;
top: 0;
left: 0;
bottom: 0;
height: 100%;
width: 2px;
transform: scaleY(0);
transform-origin: bottom;
background-color: var(--brique);
}
.card:hover::before,
.card:focus-within::before {
transform: scaleY(1);
transform-origin: top;
}
h3 {
padding-right: 3rem;
position: relative;
font-size: clamp(2.4rem, 2.2222rem + 0.5556vw, 2.8rem);
font-weight: bold;
text-transform: none;
}
h3::after {
content: url("~assets/svg/arrow-right.svg");
position: absolute;
width: 30px;
top: 0;
right: 0;
opacity: 0;
transform: translateX(1rem);
}
@media (prefers-reduced-motion: no-preference) {
.card {
transition: box-shadow 0.2s ease;
}
.card::before {
transition: transform 0.2s ease-in-out;
}
h3 {
transition: color ease 0.2s;
}
h3::after {
transition: opacity ease 0.2s, transform ease 0.2s;
}
}
.card h4 {
margin-top: 0.8rem;
font-size: 2rem;
font-weight: 500;
color: var(--darkBlue);
}
@media screen and (min-width: 768px) {
h3 {
margin-top: 0;
margin-bottom: 0.8rem;
}
.card {
padding: 3.2rem 2.4rem;
}
}
@media screen and (min-width: 1060px) {
.card {
margin: 0;
}
}
</style>

View File

@ -4,38 +4,36 @@ import { t, l } from "astro-i18n";
import Navigation from "../components/Navigation.astro";
---
<header class="" role="banner">
<header role="banner">
<a href="#skip-content" class="skip-link"> {t("header.skipLink")}</a>
<p class="logo">
<a href={l("/")} aria-label={t("header.homeLink")}>nardu.in</a>
</p>
<Navigation />
<div class="container">
<a href={l("/")} class="logo" aria-label={t("header.homeLink")}>nardu.in</a>
<Navigation />
</div>
</header>
<style>
header {
container-name: header;
container-type: inline-size;
}
.container {
padding: var(--space-xs-s) 0;
margin: 0 auto var(--space-xs-s) 0;
display: flex;
flex-flow: row wrap;
gap: var(--space-xs-s);
justify-content: space-between;
justify-content: center;
align-items: baseline;
inline-size: 100%;
}
header > .logo {
/* margin-inline-end: auto; */
flex-grow: 1;
/* flex-basis: 100%; */
text-align: center;
@container header (min-width: 31rem) {
.container {
justify-content: space-between;
}
}
header > .logo a {
text-align: center;
}
header > :global(:last-child) {
flex-grow: 999;
margin-inline-start: auto;
}
a {
:global(a) {
color: var(--color-dark);
font-weight: normal;
text-decoration: none;
}
.skip-link {

View File

@ -0,0 +1,21 @@
---
import { l, astroI18n } from "astro-i18n";
// get all the locales available on the website and remove the one currently in use
const availableLocales = astroI18n.langCodes.filter(
(locale) => locale !== astroI18n.langCode
);
// current path
const currentRoute = Astro.url.pathname;
---
<ul role="list">
{
// create a list of available alternative locale
availableLocales.map((locale) => (
<li>
<a href={l(currentRoute as any, {}, locale as any)}>{locale}</a>
</li>
))
}
</ul>

View File

@ -1,26 +0,0 @@
---
import { l, astroI18n } from "astro-i18n";
import { I18nProvider } from "astro-i18n/components";
// get the locale currently in use
const currentLocale = astroI18n.langCode;
// get all the locales available on the website and remove the one currently in use
const availableLocales = astroI18n.langCodes.filter(
(locale) => locale !== currentLocale
);
// current path
const currentRoute = Astro.url.pathname;
---
<I18nProvider>
<ul role="list">
{
// create a list of available alternative locale
availableLocales.map((locale) => (
<li>
<a href={l(currentRoute as any, {}, {}, locale as any)}>{locale}</a>
</li>
))
}
</ul>
</I18nProvider>

View File

@ -0,0 +1,15 @@
---
const { list, routeName } = Astro.props;
import CardEditorial from "./CardEditorial.astro";
---
<ul role="list">
{
list.map((item) => (
<li class="list__item">
<CardEditorial item={item} routeName={routeName} />
</li>
))
}
</ul>

View File

@ -1,16 +1,16 @@
---
import { t, l } from "astro-i18n";
import LanguageSwitcher from "./LanguageSwitcher.astro";
import LanguageSwitcher from "./LangSwitcher.astro";
---
<nav role="navigation" aria-label={t("header.mainNav")}>
<ul class="main-nav" role="list">
<li>
<a href={l("/")}>{t("accueil")}</a>
<a href={l("/articles")}>{t("article.titre")}</a>
<span aria-hidden="true">&middot;</span>
</li>
<li>
<a href={l("/articles")}>{t("article.titre")}</a>
<a href={l("/")}>{t("projet.titre")}</a>
<span aria-hidden="true">&middot;</span>
</li>
<li>
@ -21,8 +21,8 @@ import LanguageSwitcher from "./LanguageSwitcher.astro";
<a
href="mailto:contact@nardu.in"
class="nice-link"
title={t("contactLien")}
>{t("contact")}
title={t("contact.email")}
>{t("contact.title")}
</a>
<span aria-hidden="true">&#x7C;</span>
</li>

View File

@ -0,0 +1,81 @@
---
const { item } = Astro.props;
---
<div class="card">
<div class="card-container">
<div class="card__illustration">
<img
src={item.quickImage}
width="150"
height="150"
alt=""
aria-hidden="true"
/>
</div>
<a href={`#${item.id}`} class="card__link clean-link">{item.quickTitle}</a>
</div>
</div>
<style>
.card {
container-name: card;
container-type: inline-size;
inline-size: 100%;
block-size: 100%;
}
.card-container {
padding: var(--space-xs-s);
position: relative;
display: flex;
block-size: 100%;
flex-flow: column;
align-items: center;
text-align: center;
gap: var(--space-xs);
cursor: pointer;
background-color: var(--color-light-blue);
transform: translateY(0);
}
.card:focus-within {
outline: dotted 3px var(--color-blue);
}
.card:focus-within .card__link:focus {
outline: dotted 3px transparent;
}
.card__link {
font-weight: normal;
text-decoration: none;
color: currentColor;
}
.card__link:hover {
text-decoration: none;
}
.card__link::after {
content: "";
position: absolute;
inset: 0;
}
@media (prefers-reduced-motion: no-preference) {
.card {
transition: all ease 0.2s;
}
.card:hover {
transform: translateY(-10px);
box-shadow: var(--shadow-elevation-high);
}
.card:focus-within {
transform: translateY(-10px);
}
}
@container card (min-width: 20rem) {
.card-container {
flex-direction: row;
text-align: left;
}
.card__illustration {
max-inline-size: 100px;
}
}
</style>

View File

@ -0,0 +1,28 @@
---
type: section
id: offre
lang: en
image: /assets/images/home/offres.svg
order: 1
quickTitle: My offers
quickImage: /assets/images/home/icon-desktop.svg
---
## Full website offer.
### Small website, blog, landing page…
Whether it's a creation or a redesign, I can handle everything:
- graphic design,
- custom development,
- configuration of a content management system (if needed),
- hosting and deploying
- maintenance
### 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

View File

@ -0,0 +1,29 @@
---
type: section
id: methodology
lang: en
image: /assets/images/home/methodo.svg
order: 2
quickTitle: My methodology
quickImage: /assets/images/home/icon-methodo.svg
---
## Methodology.
### 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.
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
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.

View File

@ -0,0 +1,24 @@
---
type: section
id: about
lang: en
image: /assets/images/home/about.svg
order: 3
quickTitle: Me
quickImage: /assets/images/home/icon-heart.svg
---
## About.
### 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](https://certification.access42.pro/) - Developing and coding accessible websites (cert number: 696fa2e0-cc67-11ec-88d2-9dabf3f992d4)
### Free time.
I try to contribute to [open source projects](https://git.nardu.in/explore/repos) that I enjoy.
Oh and I write [articles!](/en/articles/) Articles about design and the web in general.

View File

@ -0,0 +1,28 @@
---
type: section
id: offre
lang: fr
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

View File

@ -0,0 +1,29 @@
---
type: section
id: methodology
lang: fr
image: /assets/images/home/methodo.svg
order: 2
quickTitle: Ma méthodologie
quickImage: /assets/images/home/icon-methodo.svg
---
## Méthodologie.
### 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.
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
- 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.

View File

@ -0,0 +1,24 @@
---
type: section
id: about
lang: fr
image: /assets/images/home/about.svg
order: 3
quickTitle: Moi
quickImage: /assets/images/home/icon-heart.svg
---
## À propos.
### 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
- [Access42](https://certification.access42.pro/) - Développer et coder des sites accessibles (certificat numéro&nbsp;: 696fa2e0-cc67-11ec-88d2-9dabf3f992d4)
### Temps libre.
Jessaie de contribuer à des [projets open source](https://git.nardu.in/explore/repos) qui me tiennent à cœur et je m'engage localement avec le collectif [good-it!](https://www.good-it.org/)
Ah et jécris [des articles](/articles/) aussi&nbsp;! Des articles sur le design, le développement web et linformatique.

View File

@ -1,5 +1,6 @@
---
title: "My First Blog Post"
slug: "article-1"
lang: en
pubDate: 2022-07-01
description: "This is the first post of my new Astro blog."

View File

@ -0,0 +1,147 @@
---
title: "Access blocked Sci-hub"
subtitle: "The science of sharing."
lang: en
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"]
pubDate: "2019-10-18T07:47:36.000Z"
---
The current sci-hub address is: <a href="https://sci-hub.se" rel="noreferer noopener">sci-hub.se</a>
## What is this about?
Not being a researcher myself, heres an [extremely well done explanatory video](https://youtu.be/rcgxY__YXEc) on the subject of scientific publication (french audio with auto subtitle).
> “This is outrageous!”​
I noticed that my ISP was indeed blocking access. I have not yet been able to check for the other suppliers, but I imagine that they have all complied with the court decision.
The restriction in place is quite basic. This is a “DNS” block. A DNS is a server that is used to link a domain name: _www.sci-hub.tw_ to an IP address: _186.2.163.90_
It is, in a way, the Internet phone book. Without the address, it is impossible to contact the domain. What ISPs have certainly done: block requests to the sci-hub domain name. As a result, no IP address is returned and the site is not accessible.
## How to bypass this?
- Either by using a VPN
- Either by modifying the DNS servers of your computers/Internet box
I would recommend the second solution because it allows you to protect yourself against future blockages/filtering/censorship from your ISP and does not require any financial compensation.
I will focus on change from a computer because it will be effective wherever you are and not only from your home.
### MacOs
Go to:
1. System Preferences
1. Network
1. (wi-fi or ethernet)
1. Advanced
1. DNS
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.
<nuxt-img
src="https://assets.nardu.in/ef5a4b8e82a046e6a466c73c2fd9e99e.jpg"
sizes="sm:100vw xl:728px"
width="728"
height="1060"
alt="MacOS network and DNS settings"
loading="lazy">
</nuxt-img>
### Windows (10)
Go to:
1. System Settings
1. Network & Internet
1. Change adapter options
1. Right click your adapter then “properties”
1. Select “internet protocol version 4” (and/or 6)
1. Properties
1. Use the following DNS server addresses
From there, you can add DNS servers. Click save. You might need to restart your computer for the changes to work.
<picture width="728" height="319">
<nuxt-source
src="https://assets.nardu.in/sci-hub-settings.webp"
sizes="sm:100vw xl:728px" >
</nuxt-source>
<nuxt-img src="https://assets.nardu.in/sci-hub-settings.jpg"
sizes="sm:100vw xl:728px"
alt="Windows system settings"
loading="lazy" >
</nuxt-img>
</picture>
<picture width="728" height="803">
<nuxt-source
src="https://assets.nardu.in/sci-hub-network.webp"
sizes="sm:100vw xl:728px" >
</nuxt-source>
<nuxt-img src="https://assets.nardu.in/sci-hub-network.jpg"
sizes="sm:100vw xl:728px"
alt="Windows network settings"
loading="lazy" >
</nuxt-img>
</picture>
<picture width="728" height="327">
<nuxt-source
src="https://assets.nardu.in/sci-hub-adapter.webp"
sizes="sm:100vw xl:728px" >
</nuxt-source>
<nuxt-img src="https://assets.nardu.in/sci-hub-adapter.jpg"
sizes="sm:100vw xl:728px"
alt="Windows network connections settings"
loading="lazy" >
</nuxt-img>
</picture>
<picture width="728" height="434">
<nuxt-source
src="https://assets.nardu.in/sci-hub-adapter-settings.webp"
sizes="sm:100vw xl:728px" >
</nuxt-source>
<nuxt-img src="https://assets.nardu.in/sci-hub-adapter-settings.jpg"
sizes="sm:100vw xl:728px"
alt="Windows network adapter settings"
loading="lazy" >
</nuxt-img>
</picture>
## Which DNS?
There are many DNS servers available. The best known are Google, Cloudflare and OpenDNS. If you really want to use Googles, Ill let you look up their address. Here are my recommendations in order of preference.
### [FDN DNS](https://www.fdn.fr/actions/dns/)
My favorite since it is a [french association](https://www.fdn.fr/)
1. IPV4
- 80.67.169.12
- 80.67.169.40
2. IPV6
- 2001:910:800::12
- 2001:910:800::40
### [Cloudflare DNS](https://1.1.1.1/)
For those who want the [“fastest DNS servers in the world”.](https://www.dnsperf.com/#!dns-resolvers)
1. IPV4
- 1.1.1.1
- 1.0.0.1
2. IPV6
- 2606:4700:4700::1111
- 2606:4700:4700::1001
## That's it.
By changing these settings, you are free from your ISPs and their content filtering rules.
For the moment, these restrictions are almost symbolic because if Sci-hub were to change its url, the block would no longer work. But the publishers victory in court shows that they have not had their last word. We are therefore not immune to a wider and stronger block in the future.
If you want to learn more about the struggle of the people who fight to ensure that research is not a paid commodity, I recommend [this documentary](https://youtu.be/y_CQATGOX2w) on Aaron Shwartz. Or [this article](https://arstechnica.com/tech-policy/2016/04/a-spiritual-successor-to-aaron-swartz-is-angering-publishers-all-over-again/) about the founder of Sci-hub.
In the meantime, good readings to all of you. We stand with you!

View File

@ -0,0 +1,30 @@
---
title: "Sci-Hub EN"
slug: "sci-hub"
lang: en
pubDate: 2022-10-11
description: "This is the first post of my new Astro blog."
author: "Astro Learner"
tags: ["astro", "blogging", "learning in public"]
---
export const image = {
url: "/oui.jpg",
alt: "oui oui oui",
width: "394",
height: "512",
};
Welcome to my _new blog_ about learning Astro! Here, I will share my learning journey as I build a new website.
## What I've accomplished
1. **Installing Astro**: First, I created a new Astro project and set up my online accounts.
2. **Making Pages**: I then learned how to make pages by creating new `.astro` files and placing them in the `src/pages/` folder.
3. **Making Blog Posts**: This is my first blog post! I now have Astro pages and Markdown posts!
## What's next
I will finish the Astro tutorial, and then keep adding more posts. Watch this space for more to come.

View File

@ -1,5 +1,6 @@
---
title: "Mon premier article"
slug: "article-1"
lang: fr
pubDate: 2022-07-01
description: "youpi"

View File

@ -0,0 +1,150 @@
---
title: "Sci-hub bloqué, comment contourner"
subtitle: "La science du partage."
lang: fr
excerpt: "Le tribunal de grande instance de Paris a ordonné aux fournisseurs daccès à internet de bloquer laccès à sci-hub. Voici comment contourner les blocages mis en place."
tags: ["Internet", "Science"]
pubDate: "2019-03-31T07:47:36.000Z"
---
L'adresse actuelle de sci-hub est&nbsp;: [sci-hub.se](https://sci-hub.se)
## Résumé de la situation
Nétant pas moi-même directement chercheur, je vous laisse regarder [cette vidéo](https://youtu.be/rcgxY__YXEc) explicative extrêmement bien faite sur le sujet de la publication scientifique.
> “ Mais cest scandaleux ! ”​
Jai constaté que le blocage était actif chez SFR. Je nai pas encore pu vérifier pour les autres fournisseurs mais jimagine quils se sont tous conformés à la décision de justice.
Le blocage mis en place est assez basique. Il sagit dun blocage “ DNS ”.
Un DNS est un serveur qui sert à faire le lien entre un nom de domaine&nbsp;: **sci-hub.tw** et une adresse IP : **186.2.163.90**.
Cest en quelque sorte lannuaire dinternet. Sans ladresse, impossible de contacter le domaine. Ce que les FAI ont certainement fait&nbsp;: bloquer les requêtes au nom de domaine [sci-hub.tw.](http://sci-hub.tw/) Ainsi, aucune adresse IP nest renvoyée et le site nest pas accessible.
## Comment contourner ce blocage&nbsp;?
- Soit en utilisant un VPN
- Soit en modifiant les serveurs DNS de vos ordinateurs/box internet
Je recommande la deuxième solution car elle permet de se prémunir contre de futurs blocages/filtrages/censures de la part de votre FAI et ne nécessite pas de contrepartie financière.
Je vais me focaliser sur le changement depuis un ordinateur car il sera effectif où que vous soyez.
### Sur MacOs&nbsp;:
Ouvrez&nbsp;:
1. Préférences système
1. Réseau
1. Avancé
1. DNS
1. Serveurs DNS
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.
<nuxt-img
src="https://assets.nardu.in/ef5a4b8e82a046e6a466c73c2fd9e99e.jpg"
sizes="sm:100vw xl:728px"
width="728"
height="1060"
alt="MacOS réglages réseau et DNS"
loading="lazy">
</nuxt-img>
### Sur Windows (ici 10)&nbsp;:
Ouvrez&nbsp;:
1. Réglages
1. Réseau et internet
1. Modifier les options de l'adaptateur
1. Clic droit sur les propriétés de votre interface réseau
1. Selectionnez «&nbsp;protocole Internet version 4&nbsp;» (et/ou 6)
1. Propriétés
1. Utiliser ladresse de serveur DNS suivante
<picture width="728" height="319">
<nuxt-source
src="https://assets.nardu.in/sci-hub-settings.webp"
sizes="sm:100vw xl:728px" >
</nuxt-source>
<nuxt-img src="https://assets.nardu.in/sci-hub-settings.jpg"
sizes="sm:100vw xl:728px"
alt="Réglages windows"
loading="lazy" >
</nuxt-img>
</picture>
<picture width="728" height="803">
<nuxt-source
src="https://assets.nardu.in/sci-hub-network.webp"
sizes="sm:100vw xl:728px" >
</nuxt-source>
<nuxt-img src="https://assets.nardu.in/sci-hub-network.jpg"
sizes="sm:100vw xl:728px"
alt="Windows réglages réseaux"
loading="lazy" >
</nuxt-img>
</picture>
<picture width="728" height="327">
<nuxt-source
src="https://assets.nardu.in/sci-hub-adapter.webp"
sizes="sm:100vw xl:728px" >
</nuxt-source>
<nuxt-img src="https://assets.nardu.in/sci-hub-adapter.jpg"
sizes="sm:100vw xl:728px"
alt="Windows régalges connections réseaux"
loading="lazy" >
</nuxt-img>
</picture>
<picture width="728" height="434">
<nuxt-source
src="https://assets.nardu.in/sci-hub-adapter-settings.webp"
sizes="sm:100vw xl:728px" >
</nuxt-source>
<nuxt-img src="https://assets.nardu.in/sci-hub-adapter-settings.jpg"
sizes="sm:100vw xl:728px"
alt="Windows options adaptateur réseau"
loading="lazy" >
</nuxt-img>
</picture>
## Quels serveurs DNS utiliser&nbsp;?
Il y a de nombreux serveurs DNS accessibles. Les plus connus étant ceux de Google, Cloudflare et OpenDNS. Si vous tenez vraiment à utiliser ceux de Google, je vous laisse chercher leur adresse. Voici mes recommandations par ordre de préférence.
Plusieurs fournisseurs :
### [FDN DNS](https://www.fdn.fr/actions/dns/)
Mes favoris puisquil sagit dune [association française.](https://www.fdn.fr/)
1. IPV4
- 80.67.169.12
- 80.67.169.40
2. IPV6
- 2001:910:800::12
- 2001:910:800::40
### [Cloudflare DNS](https://1.1.1.1/)
Pour ceux qui veulent les serveurs DNS [“&nbsp;les plus rapides du monde&nbsp;”.](https://www.dnsperf.com/#!dns-resolvers)
1. IPV4
- 1.1.1.1
- 1.0.0.1
2. IPV6
- 2606:4700:4700::1111
- 2606:4700:4700::1001
## C'est tout.
En modifiant ces réglages, vous vous affranchissez de vos fournisseurs daccès et de leurs règles de filtrage du contenu.
Pour linstant, ces blocages sont presque symboliques car si Sci-hub venait à changer durl, le blocage ne fonctionnerait plus. Mais la victoire des éditeurs au tribunal montre quils nont pas dit leur dernier mot. Nous ne sommes donc pas à labri dun futur blocage plus large et plus dur à contrer.
Si vous voulez en apprendre plus sur le combat de ces gens qui se battent pour que la recherche ne soit pas une marchandise, je vous conseille [ce documentaire](https://youtu.be/y_CQATGOX2w) sur Aaron Shwartz. Ou plus simplement [cet article](https://arstechnica.com/tech-policy/2016/04/a-spiritual-successor-to-aaron-swartz-is-angering-publishers-all-over-again/) sur la fondatrice de Sci-hub.
En attendant, bonnes lectures à tou·te·s. On est avec vous !

View File

@ -0,0 +1,30 @@
---
title: "Sci-Hub FR"
slug: "sci-hub"
lang: fr
pubDate: 2022-10-11
description: "This is the first post of my new Astro blog."
author: "Astro Learner"
tags: ["astro", "blogging", "learning in public"]
---
export const image = {
url: "/oui.jpg",
alt: "oui oui oui",
width: "394",
height: "512",
};
Welcome to my _new blog_ about learning Astro! Here, I will share my learning journey as I build a new website.
## What I've accomplished
1. **Installing Astro**: First, I created a new Astro project and set up my online accounts.
2. **Making Pages**: I then learned how to make pages by creating new `.astro` files and placing them in the `src/pages/` folder.
3. **Making Blog Posts**: This is my first blog post! I now have Astro pages and Markdown posts!
## What's next
I will finish the Astro tutorial, and then keep adding more posts. Watch this space for more to come.

View File

@ -2,10 +2,12 @@
"accueil": "home",
"tagline": "Freelance web designer and front-end developer.",
"copyright": "(re)Made with Astro",
"contact": "contact",
"contactLien": "Send me an email (open in application).",
"contactTel": "Call or text me (open in application).",
"contenuVide": "Soon: really nice content.",
"contact": {
"title": "contact",
"email": "Send me an email (open in application).",
"tel": "Call or text me (open in application).",
"contenuVide": "Soon: really nice content."
},
"header": {
"skipLink": "Skip to content",
"mainNav": "Main menu",

View File

@ -1,10 +1,12 @@
{
"accueil": "accueil",
"tagline": "Designer et developpeur web freelance à Toulouse.",
"copyright": "Fait avec un 🖥️ circa 2020",
"contact": "contact",
"contactLien": "Envoyez-moi un mail (ouverture du logiciel automatique).",
"contactTel": "Contactez-moi par téléphone (ouverture du logiciel automatique).",
"copyright": "(re)Fait avec Astro",
"contact": {
"title": "contact",
"email": "Envoyez-moi un mail (ouverture du logiciel automatique).",
"tel": "Contactez-moi par téléphone (ouverture du logiciel automatique)."
},
"contenuVide": "Bientôt ici : du contenu de qualité",
"header": {
"skipLink": "Accéder au contenu",
@ -28,11 +30,11 @@
"credit": "Image par"
},
"fragments": {
"titre": "Fragments",
"titre": "fragments",
"tagline": "Les tutos de Nico mdr."
},
"projet": {
"titre": "Projets",
"titre": "projets",
"tagline": "Mon travail en freelance",
"cta": "Consulter le site",
"lienTitle": "Site web de",

View File

@ -0,0 +1,8 @@
<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 325 350.01">
<path fill="#ff826c" d="M200 0v174.86h-10V110h-30v20h-14.8v44.86H110V240h100.2v-60H230V0h-30z"/>
<path fill="#162e57" d="M195 85h-49.8v45H160v-20h35V85z"/>
<path fill="#d4ebf2" d="M50 240h64.72v60H50zm185.18-60.26V240H125v60h165V179.74h-54.82z"/>
<path fill="#ff826c" d="M290 205h30v20h-30z"/>
<path fill="#d4ebf2" d="M80 309.98h70v10.03H80zM0 300h70v10.03H0zm255 0h70v10.03h-70zm-115 29.98h70v10.03h-70zm-105 10h70v10.03H35z"/>
<path fill="#ff826c" d="M100 185h30v125h-30z"/>
</svg>

After

Width:  |  Height:  |  Size: 582 B

View File

@ -0,0 +1,9 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150">
<g data-name="desktop">
<path fill="transparent" d="M0 0h150v150H0z"/>
<path fill="#162e57" d="M15 35h120v80H15z"/>
<path fill="#ff826c" d="M15 35h120v8H15z"/>
<path fill="#162e57" d="M17.67 37.67h2.67v2.67h-2.67zm5.33 0h2.67v2.67H23zm5.33 0H31v2.67h-2.67z"/>
<path fill="#ff826c" d="M25.67 59H55v26.67H25.67zm0 29.33H55V91H25.67zM60.33 59h29.33v26.67H60.33zm0 29.33h29.33V91H60.33zM95 59h29.33v26.67H95zm0 29.33h29.33V91H95z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 528 B

View File

@ -0,0 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150">
<g data-name="heart">
<path fill="transparent" d="M0 0h150v150H0z"/>
<path fill="#ff826c" d="M103.57 50.43V39H80.71v11.43H69.29V39H46.43v11.43H35v34.28h11.43v11.43h11.43v11.43h11.43V119h11.42v-11.43h11.43V96.14h11.43V84.71H115V50.43h-11.43z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 331 B

View File

@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 150 150">
<path fill="#162e57" d="m100.52 58.11 3.94 2.28 3.94 2.27 6.76-11.7-3.94-2.27 4.55-7.89-7.89-4.55-4.55 7.89-2.2 3.81-15.77-9.1 2.2-3.82 4.56-7.88-7.89-4.56-4.55 7.89-3.94-2.28-6.83 11.83 7.88 4.55-2.2 3.81 23.66 13.66 2.27-3.94zM51.75 87.95l-2.27 3.94-3.94-2.28-3.94-2.27-6.76 11.7 3.94 2.27-4.55 7.89 7.89 4.55 6.82-11.83 15.77 9.11-6.83 11.82 7.89 4.56 4.55-7.89 3.94 2.28 6.76-11.7-3.94-2.28-3.95-2.28 2.28-3.93-23.66-13.66z"/>
<path fill="#ff826c" d="m75.41 101.6-3.94-2.27L94.3 59.78l3.94 2.27h.01L74.59 48.39v.01l3.94 2.27L55.7 90.22l-3.94-2.27h-.01l23.66 13.66v-.01z"/>
</svg>

After

Width:  |  Height:  |  Size: 671 B

View File

@ -0,0 +1,8 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150">
<g data-name="mobile">
<path fill="#d4ebf2" d="M0 0h150v150H0z"/>
<path fill="#10113a" d="M48.33 25h53.33v100H48.33z"/>
<path fill="#162e57" d="M71.67 113.33h6.67V120h-6.67zM55 31.67h40v76.67H55z"/>
<path fill="#ff826c" d="M62.78 38.33h24.44v22.22H62.78zm0 24.45h24.44V65H62.78zm0 8.89h24.44v22.22H62.78zm0 24.44h24.44v2.22H62.78z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 429 B

View File

@ -0,0 +1,7 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150">
<g data-name="articles">
<path fill="transparent" d="M0 0h150v150H0z"/>
<path fill="#162e57" d="M56.54 51.92v9.23H28.85v9.24H15v13.84h13.85v9.23h4.61v13.85h13.85V93.46h9.23v9.23h36.92V51.92H56.54z"/>
<path fill="#ff826c" d="M107.31 47.31h13.85v9.23h-13.85zm0 23.07H135v9.23h-27.69zm13.84-32.3H135v9.23h-13.85zm-13.84 55.38h13.85v9.23h-13.85zm13.84 9.23H135v9.23h-13.85z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 464 B

View File

@ -0,0 +1,12 @@
<svg id="aa0241e5-d9cf-4e93-b83f-4d24f8d4da9a" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 290 495">
<g>
<polygon points="114.46 90 0 90 0 295 34.46 295 34.46 495 64.46 495 64.46 295 79.46 295 79.46 495 109.46 495 109.46 295 114.46 295 114.46 90" fill="#162e57"/>
<polygon points="94.46 25.16 94.46 0 49.46 0 49.46 25.16 49.46 35.16 109.46 35.16 109.46 25.16 94.46 25.16" fill="#162e57"/>
</g>
<polygon points="280 125 280 120 285 120 290 120 290 105.16 285 105.16 285 95.16 275 95.16 275 105.16 275 110 255 110 255 105.16 255 95.16 245 95.16 245 105.16 240 105.16 240 120.16 250 120.16 250 125 255 125 255 175.16 250 175.16 250 180.16 245 180.16 240 180.16 240 195 245 195 245 205 255 205 255 190 275 190 275 205 285 205 285 195 290 195 290 180.16 285 180.16 280 180.16 280 175.16 275 175.16 275 125 280 125" fill="#10113a"/>
<g>
<polygon points="94.46 90 94.46 35.16 49.38 35.16 49.38 90 74.46 90 74.46 120 104.46 120 104.46 90 94.46 90" fill="#ff826c"/>
<polygon points="55 90 0 90 0 155 0 210.16 0 305 34.46 305 34.46 210.16 55 210.16 55 90" fill="#ff826c"/>
<polygon points="275 125 240 125 240 130 155 130 114.46 130 114.46 165 155 165 255 165 255 142.53 275 142.53 275 125" fill="#ff826c"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -0,0 +1,14 @@
<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 510 495">
<path fill="#162e57" d="M40 280h30v215H40zm60 0H75v125h10v90h30V280h-15z"/>
<path fill="#ff826c" d="M60 0v90h45V30h15V0H60z"/>
<path fill="#d4ebf2" d="M15 90h115v190H15z"/>
<path fill="#162e57" d="M85 90h15v135H85z"/>
<path fill="#ff826c" d="M130 110V90h-25v315h25V140h120v-30H130z"/>
<path fill="#162e57" d="M280 185v-15h-5v-15h-5v-55h5v-5h-30v5h5v55h-5v15h-5v15h-10v25h60v-25h-10z"/>
<path fill="#ff826c" d="M275 65h10v10h-10zm-15 10h5v5h-5zm0-30h10v10h-10zm130 165v-5h-10v-80h5v-5h-25v5h5v80h-10v5h-5v30h5v5h35v-5h5v-30h-5zm40-90v5h5v115h15V125h5v-5h-25z"/>
<path fill="#d4ebf2" d="M365 145v5h40v110h5V150h40v-5h-85z"/>
<path fill="#ff826c" d="M440 240h5v5h-5z"/>
<path fill="#162e57" d="M435 195h15v45h-15z"/>
<path fill="#d4ebf2" d="M510 260H180v25h10v210h310V285h10v-25z"/>
<path fill="#ff826c" d="M15 90v25H0v195h15v95h60V90H15z"/>
</svg>

After

Width:  |  Height:  |  Size: 953 B

View File

@ -0,0 +1,11 @@
<svg xmlns="http://www.w3.org/2000/svg" data-name="aefb6044-044f-4f8d-bc9f-2a475efc35ba" viewBox="0 0 420 390">
<path fill="#ff826c" d="M155 20h40v50.21h-40Zm0-20h50v20h-50Z"/>
<path fill="#d4ebf2" d="M255 150H155V40H70v30H40v140.57h115V180h100v-30z"/>
<path fill="#ff826c" d="M280 180h-25v-25h25Z"/>
<path fill="#10113a" d="M40 210v40h145v140h40V210Zm305-110v85h-90v12.54h110V100Z"/>
<path fill="#ff826c" d="M240 195h177.33v25H240Zm75 25h30v170h-30Z"/>
<path fill="#10113a" d="M315 220h30v15h-30Z"/>
<path fill="#ff826c" d="M30 250V105H0v170h10v115h20V275h80v115h20V275h10v-25Z"/>
<path fill="#d4ebf2" d="M410 155v-10h-30v50h30v-15h5v-5h-5v-14.95h5V175h5v-20h-10z"/>
<path fill="#ff826c" d="M385 55h10v20h-10Zm-10 30h10v10h-10Zm20-40h10v10h-10Zm-5 55h15v10h-15Zm10 20h5v15h-5Zm-10 20h5v5h-5Z"/>
</svg>

After

Width:  |  Height:  |  Size: 821 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 156 KiB

View File

@ -1,15 +1,15 @@
---
import { astroI18n } from "astro-i18n";
import { I18nProvider } from "astro-i18n/components"
import '../styles/style.css';
astroI18n.init(Astro);
import Header from '../components/Header.astro';
import "../styles/style.css";
const currentLocale = astroI18n.langCode;
const { pageTitle, titleColor } = Astro.props;
import Header from "../components/Header.astro";
const { pageTitle, titleColor, lang } = Astro.props;
---
<I18nProvider>
<html lang={currentLocale} dir="ltr">
<html lang={astroI18n.langCode} dir="ltr">
<head>
<meta charset="utf-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
@ -21,14 +21,13 @@ const { pageTitle, titleColor } = Astro.props;
<div class="wrapper">
<Header />
<main id="skip-content" role="main">
<slot/>
<slot />
</main>
</div>
</body>
<style define:vars={{ titleColor }}>
h1 {
color: var(--titleColor);
color: var(--titleColor);
}
</style>
</style>
</html>
</I18nProvider>

View File

@ -1,13 +1,11 @@
---
import { l, t, astroI18n } from "astro-i18n";
import AstroImage from "../components/AstroImage.astro";
// import AstroImage from "../components/AstroImage.astro";
import BaseLayout from "../layouts/BaseLayout.astro";
const currentLocale = astroI18n.langCode;
const { frontmatter, image, title } = Astro.props;
const publishedDate = new Date(frontmatter.pubDate);
const localizedDate = new Intl.DateTimeFormat(currentLocale, {
const localizedDate = new Intl.DateTimeFormat(astroI18n.langCode, {
dateStyle: "long",
}).format(publishedDate);
---
@ -38,7 +36,7 @@ const localizedDate = new Intl.DateTimeFormat(currentLocale, {
<p>{frontmatter.description}</p>
<pre></pre>
<hr />
{
<!-- {
!!image && (
<AstroImage
src={image.url}
@ -47,7 +45,7 @@ const localizedDate = new Intl.DateTimeFormat(currentLocale, {
height={image.height}
/>
)
}
} -->
<hr />
<slot />
</BaseLayout>

View File

@ -0,0 +1,26 @@
---
import { astroI18n } from "astro-i18n";
import BaseLayout from "../../layouts/BaseLayout.astro";
export async function getStaticPaths({}) {
const allPosts = await Astro.glob("../../data/articles/**/*.mdx");
const localizedPost = allPosts.filter((post) => {
return post.frontmatter.lang === astroI18n.langCode;
});
return localizedPost.map((post) => {
return {
params: { slug: post.frontmatter.slug },
props: { post },
};
});
}
const { slug } = Astro.params;
const { post } = Astro.props;
---
<BaseLayout>
{post.frontmatter.title}
</BaseLayout>

View File

@ -1,7 +1,4 @@
{
"{route}": "blog",
"pageName": "Blog",
"pageName{cool:'yes'}": "Blog cools",
"pageName{cool:'no'}": "Blog nuls",
"trad": "hello english"
"pageName": "Articles",
"subtitle": "I blog, sometimes."
}

View File

@ -1,6 +1,4 @@
{
"pageName": "Articles",
"pageName{cool:'yes'}": "Articles cools",
"pageName{cool:'no'}": "Articles nuls",
"trad": "slt sava"
"subtitle": "Je blog, un peu."
}

View File

@ -1,29 +1,29 @@
---
import { l, t, astroI18n } from "astro-i18n";
const currentLocale = astroI18n.langCode;
import "../../styles/style.css";
import BaseLayout from "../../layouts/BaseLayout.astro";
import ContentPost from "../../components/ContentPost.astro";
const allPosts = await Astro.glob(`./**/*.mdx`);
const allPosts = await Astro.glob(`../../data/articles/**/*.mdx`);
const localizedPost = allPosts.filter((post) => {
return post.frontmatter.lang === currentLocale;
return post.frontmatter.lang === astroI18n.langCode;
});
const pageTitle = t("index.articles.pageName");
---
<BaseLayout pageTitle={pageTitle}>
<h2>{t("index.articles.pageName", { cool: "yes" }, "fr")}</h2>
<p>{t("index.articles.trad")}</p>
<h2>{t("index.articles.pageName")}</h2>
<p>{t("index.articles.subtitle")}</p>
<ul>
{
localizedPost.map((post) => (
<li>
<ContentPost url={post.url} title={post.frontmatter.title} />
<a href={l(`/articles/${post.frontmatter.slug}`)}>
{post.frontmatter.title}
</a>
</li>
))
}

View File

@ -1,15 +0,0 @@
---
layout: ../../layouts/MarkdownPostLayout.astro
title: My Second Blog Post
author: Astro Learner
description: "After learning some Astro, I couldn't stop!"
image:
url: "/hackerman.png"
alt: "hack"
width: 1920
height: 1080
pubDate: 2022-07-08
tags: ["astro", "blogging", "learning in public", "successes"]
---
After a successful first week learning Astro, I decided to try some more. I wrote and imported a small component from memory!

View File

@ -1,15 +0,0 @@
---
layout: ../../layouts/MarkdownPostLayout.astro
title: Special tag
author: Astro Learner
pubDate: 2022-07-08
tags: ["nicool"]
---
That's it bb
```html
<main>
<header></header>
</main>
```

View File

@ -0,0 +1,9 @@
---
import Page from "../../articles/[slug].astro"
export { getStaticPaths } from "../../articles/[slug].astro"
const { props } = Astro
---
<Page {...props} />

View File

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

View File

@ -1,9 +1,10 @@
{
"title": "Création de <span class='highlight'>sites&nbsp;web</span> <a href='/articles/faq' 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' >daccessibilités</a>.",
"comment": "Plus précisément, je crée des interfaces web et mobiles. De lergonomie jusquau design final, de lintégration jusquà la mise en ligne. Je mets en avant les standards daccessibilité numérique, pour lesquels jai 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 minscris également dans une démarche <a href='https://www.ademe.fr/expertises/consommer-autrement/passer-a-laction/ameliorer-pratiques/lecoconception' title='Définition de lADEME (nouvelle fenêtre)' rel='noopener noreferer'>déco-conception</a> des services que je propose.",
"opensource": "Jessaie de contribuer à des <a href='https://git.nardu.in/explore/repos' title='Projets sur lesquels jai travaillé (nouvelle fenêtre)' target='_blank' rel='noreferer noopener'>projets open source</a> qui me tiennent à cœur.",
"articles": "Ah et jécris <a href='/articles/'>des articles</a> aussi&nbsp;! Des articles sur le graphisme et linformatique.",
"projetsRecents": "Derniers projets",
"articlesRecents": "Derniers articles"
"writing": "Ah et jécris <a href='/articles/'>des articles</a> aussi&nbsp;! Des articles sur le graphisme et linformatique.",
"latestProjects": "Derniers projets",
"latestArticles": "Derniers articles"
}

View File

@ -1,10 +1,171 @@
---
import { t, l } from "astro-i18n";
// init i18n
import { l, t, astroI18n } from "astro-i18n";
astroI18n.init(Astro);
// import stuff
import BaseLayout from "../layouts/BaseLayout.astro";
import QuickAccessCard from "../components/QuickAccessCard.astro";
import CardEditorial from "../components/CardEditorial.astro";
import ListCards from "../components/ListCards.astro";
const pageTitle = t("accueil");
// get all HP sections
const allSections = await Astro.glob("../data/HP/**/*.md");
// only keep the right locale version
const localizedSections = allSections.filter((section) => {
return section.frontmatter.lang === astroI18n.langCode;
});
// get all articles
const allArticles = await Astro.glob("../data/articles/**/*.{md,mdx}");
// only keep the right locale version
const localizedArticles = allArticles.filter((article) => {
return article.frontmatter.lang === astroI18n.langCode;
});
// sort articles by descending publication date
const sortedArticles = localizedArticles.sort(
(a, b) => b.frontmatter.pubDate - a.frontmatter.pubDate
);
---
<BaseLayout pageTitle={pageTitle}>
<h1 set:html={t("index.title")}></h1>
<section class="region intro">
<h1 set:html={t("index.title")} />
<section class="quick-access">
<h2 class="intro__subtitle">{t("index.subtitle")}</h2>
<ul class="quick-access__list" role="list">
{
localizedSections.map((section) => (
<li>
<QuickAccessCard item={section.frontmatter} />
</li>
))
}
</ul>
</section>
</section>
{
localizedSections.map((section) => (
<section id={section.frontmatter.id} class="region section">
<div class="section__container">
<div class="flow section__content">
<section.Content />
</div>
<div class="section__image">
<img
src={section.frontmatter.image}
width="400"
height="350"
alt=""
aria-hidden="true"
/>
</div>
</div>
</section>
))
}
<section class="latest">
<div class="latest__work">
<h2>{t("index.latestArticles")}</h2>
<ListCards list={sortedArticles} routeName={t("article.titre")} />
</div>
</section>
</BaseLayout>
<style>
/* INTRO */
.intro {
position: relative;
}
.intro::before {
content: "";
position: absolute;
top: -30%;
left: -10%;
max-width: 100vw;
width: 320px;
height: 320px;
z-index: -1;
border-radius: 50%;
background-color: var(--color-light-blue);
}
.intro h1 {
font-size: clamp(3.25rem, calc(1.92rem + 6.67vw), 6.25rem);
text-align: center;
}
.intro h1 :global(a) {
color: currentColor;
text-decoration: underline;
text-decoration-thickness: auto;
text-decoration-color: var(--color-brique);
text-decoration-thickness: 6px;
}
.intro h1 :global(a:hover) {
text-decoration: none;
}
.intro__subtitle {
margin: var(--space-s-m) 0;
font-family: "wotfard";
font-weight: 500;
text-align: center;
color: var(--color-dark-blue);
}
.quick-access {
margin-top: var(--space-xl-2xl);
container-type: inline-size;
container-name: intro;
}
.quick-access__list {
margin: var(--space-l-xl) auto 0;
display: flex;
flex-flow: row wrap;
gap: var(--space-m-l);
}
.quick-access__list > li {
flex-grow: 1;
flex-basis: 240px;
}
/* SECTIONS */
.section {
container-name: section;
container-type: inline-size;
}
.section__container {
display: flex;
flex-direction: column;
align-items: center;
gap: var(--space-m-l);
}
.section :global(h2) {
font-size: var(--size-3);
color: var(--color-blue);
}
.section :global(h3) {
font-size: var(--size-1);
}
@container section (min-width: 50rem) {
.section__container {
flex-direction: row;
align-items: flex-start;
}
.section__image {
order: 1;
position: sticky;
top: 20px;
flex-grow: 1;
flex-basis: 18rem;
}
.section__content {
order: 2;
flex-basis: 0;
min-width: 40ch;
}
}
</style>

View File

@ -1,9 +0,0 @@
import rss from '@astrojs/rss';
export const get = () => rss({
title: 'Nicolas Arduin | Articles',
description: 'Je blog un peu',
site: 'https://www.nardu.in',
items: import.meta.glob('./**/*.md'),
customData: `<language>fr-fr</language>`,
});

View File

@ -3,7 +3,7 @@ import BaseLayout from "../../layouts/BaseLayout.astro";
import ContentPost from "../../components/ContentPost.astro";
export async function getStaticPaths({}) {
const allPosts = await Astro.glob("../articles/*.mdx");
const allPosts = await Astro.glob("../../data/**/*.mdx");
const uniqueTags = [
...new Set(allPosts.map((post) => post.frontmatter.tags).flat()),
];

View File

@ -2,7 +2,7 @@
import BaseLayout from "../../layouts/BaseLayout.astro";
const pageTitle = "Tag Index";
const allPosts = await Astro.glob("../articles/*.mdx");
const allPosts = await Astro.glob("../../data/**/*.mdx");
const tags = [...new Set(allPosts.map((post) => post.frontmatter.tags).flat())];
---

View File

@ -1,18 +0,0 @@
.section > .curve {
transform: translateY(-1px);
}
.section > .curve:first-child {
transform: rotate(180deg) translateY(-1px);
}
.section__inner {
background: var(--spot-bg-color, transparent);
color: var(--spot-text-color, var(--color-dark));
}
.section blockquote {
font-weight: 700;
line-height: 1;
font-size: var(--size-4);
}

View File

@ -30,24 +30,24 @@ EXCEPTIONS
/*
A flipped version where the sidebar is on the right
*/
.sidebar[data-direction='rtl'] {
.sidebar[data-direction="rtl"] {
flex-direction: row-reverse;
}
/* REVERSE sidebar on right*/
.sidebar--reverse {
.sidebar-reverse {
display: flex;
flex-wrap: wrap;
gap: var(--gutter, var(--space-xs-s));
}
.sidebar--reverse > :last-child {
.sidebar-reverse > :last-child {
flex-basis: var(--sidebar-target-width, 20rem);
flex-grow: 1;
}
.sidebar--reverse > :first-child {
.sidebar-reverse > :first-child {
flex-basis: 0;
flex-grow: 999;
min-width: var(--sidebar-content-min-width, 50%);

View File

@ -7,6 +7,9 @@
color: var(--color-light-blue);
background-color: var(--color-dark-blue);
}
::marker {
color: var(--color-brique);
}
body {
font-family: var(--font-primary);
@ -14,6 +17,7 @@ body {
line-height: 1.4;
color: var(--color-dark);
background-color: var(--color-light-white);
accent-color: var(--color-brique);
}
main {
@ -56,13 +60,16 @@ h5,
color: var(--color-darkBlue);
}
a,
a {
font-weight: 500;
color: var(--color-blue);
text-decoration: none;
}
a:visited {
position: relative;
color: currentcolor;
color: currentColor;
}
a:hover {
text-decoration: none;
text-decoration: underline;
}
hr {
@ -143,3 +150,7 @@ button[disabled] {
border-color: var(--color-grey);
background-color: var(--color-white);
}
.highlight {
color: var(--color-blue);
}

View File

@ -1,7 +1,7 @@
.flow > * + * {
margin-block-start: var(--flow-space, var(--space-m-l));
margin-block-start: var(--flow-space, var(--space-s-m));
}
.flow > :where(h1, h2, h3) + * {
margin-block-start: var(--flow-space-title, var(--space-s-m));
margin-block-start: var(--flow-space-title, var(--space-xs-s));
}

View File

@ -7,7 +7,7 @@
padding-inline-start: var(--_content-padding);
padding-inline-end: var(--_content-padding);
position: relative; */
--content-width: 80rem;
--content-width: 65rem;
--grid-wrapper: [full-start] 1fr [wrapper-start]
minmax(0, var(--content-width)) [wrapper-end] 1fr [full-end];

View File

@ -1,3 +1,6 @@
{
"extends": "astro/tsconfigs/base"
}
"extends": "astro/tsconfigs/base",
"compilerOptions": {
"strictNullChecks": true
}
}