Compare commits

..

1 Commits

Author SHA1 Message Date
Nico a7f5da2a72 offres layout and starting page 2023-07-20 15:33:27 +02:00
71 changed files with 1274 additions and 1674 deletions

334
.astro/types.d.ts vendored
View File

@ -20,14 +20,26 @@ declare module 'astro:content' {
declare module 'astro:content' { declare module 'astro:content' {
export { z } from 'astro/zod'; export { z } from 'astro/zod';
export type CollectionEntry<C extends keyof AnyEntryMap> = AnyEntryMap[C][keyof AnyEntryMap[C]];
type Flatten<T> = T extends { [K: string]: infer U } ? U : never; // TODO: Remove this when having this fallback is no longer relevant. 2.3? 3.0? - erika, 2023-04-04
/**
export type CollectionKey = keyof AnyEntryMap; * @deprecated
export type CollectionEntry<C extends CollectionKey> = Flatten<AnyEntryMap[C]>; * `astro:content` no longer provide `image()`.
*
export type ContentCollectionKey = keyof ContentEntryMap; * Please use it through `schema`, like such:
export type DataCollectionKey = keyof DataEntryMap; * ```ts
* import { defineCollection, z } from "astro:content";
*
* defineCollection({
* schema: ({ image }) =>
* z.object({
* image: image(),
* }),
* });
* ```
*/
export const image: never;
// This needs to be in sync with ImageMetadata // This needs to be in sync with ImageMetadata
export type ImageFunction = () => import('astro/zod').ZodObject<{ export type ImageFunction = () => import('astro/zod').ZodObject<{
@ -42,17 +54,19 @@ declare module 'astro:content' {
import('astro/zod').ZodLiteral<'tiff'>, import('astro/zod').ZodLiteral<'tiff'>,
import('astro/zod').ZodLiteral<'webp'>, import('astro/zod').ZodLiteral<'webp'>,
import('astro/zod').ZodLiteral<'gif'>, import('astro/zod').ZodLiteral<'gif'>,
import('astro/zod').ZodLiteral<'svg'>, import('astro/zod').ZodLiteral<'svg'>
import('astro/zod').ZodLiteral<'avif'>,
] ]
>; >;
}>; }>;
type BaseSchemaWithoutEffects = type BaseSchemaWithoutEffects =
| import('astro/zod').AnyZodObject | 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').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 = type BaseSchema =
| BaseSchemaWithoutEffects | BaseSchemaWithoutEffects
@ -83,7 +97,7 @@ declare module 'astro:content' {
export function getEntryBySlug< export function getEntryBySlug<
C extends keyof ContentEntryMap, C extends keyof ContentEntryMap,
E extends ValidContentEntrySlug<C> | (string & {}), E extends ValidContentEntrySlug<C> | (string & {})
>( >(
collection: C, collection: C,
// Note that this has to accept a regular string too, for SSR // Note that this has to accept a regular string too, for SSR
@ -108,7 +122,7 @@ declare module 'astro:content' {
export function getEntry< export function getEntry<
C extends keyof ContentEntryMap, C extends keyof ContentEntryMap,
E extends ValidContentEntrySlug<C> | (string & {}), E extends ValidContentEntrySlug<C> | (string & {})
>(entry: { >(entry: {
collection: C; collection: C;
slug: E; slug: E;
@ -117,7 +131,7 @@ declare module 'astro:content' {
: Promise<CollectionEntry<C> | undefined>; : Promise<CollectionEntry<C> | undefined>;
export function getEntry< export function getEntry<
C extends keyof DataEntryMap, C extends keyof DataEntryMap,
E extends keyof DataEntryMap[C] | (string & {}), E extends keyof DataEntryMap[C] | (string & {})
>(entry: { >(entry: {
collection: C; collection: C;
id: E; id: E;
@ -126,7 +140,7 @@ declare module 'astro:content' {
: Promise<CollectionEntry<C> | undefined>; : Promise<CollectionEntry<C> | undefined>;
export function getEntry< export function getEntry<
C extends keyof ContentEntryMap, C extends keyof ContentEntryMap,
E extends ValidContentEntrySlug<C> | (string & {}), E extends ValidContentEntrySlug<C> | (string & {})
>( >(
collection: C, collection: C,
slug: E slug: E
@ -135,7 +149,7 @@ declare module 'astro:content' {
: Promise<CollectionEntry<C> | undefined>; : Promise<CollectionEntry<C> | undefined>;
export function getEntry< export function getEntry<
C extends keyof DataEntryMap, C extends keyof DataEntryMap,
E extends keyof DataEntryMap[C] | (string & {}), E extends keyof DataEntryMap[C] | (string & {})
>( >(
collection: C, collection: C,
id: E id: E
@ -184,292 +198,6 @@ declare module 'astro:content' {
>; >;
type ContentEntryMap = { type ContentEntryMap = {
"articles": {
"en/2022.md": {
id: "en/2022.md";
slug: "en/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";
data: InferEntrySchema<"articles">
} & { render(): Render[".mdx"] };
"en/faq.md": {
id: "en/faq.md";
slug: "en/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";
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";
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";
data: InferEntrySchema<"articles">
} & { render(): Render[".mdx"] };
"en/video-compression.mdx": {
id: "en/video-compression.mdx";
slug: "en/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";
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";
data: InferEntrySchema<"articles">
} & { render(): Render[".md"] };
"fr/faq.md": {
id: "fr/faq.md";
slug: "fr/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";
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";
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";
data: InferEntrySchema<"articles">
} & { render(): Render[".mdx"] };
"fr/video-compression.md": {
id: "fr/video-compression.md";
slug: "fr/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";
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";
data: InferEntrySchema<"fragments">
} & { render(): Render[".md"] };
"en/buttons.md": {
id: "en/buttons.md";
slug: "en/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";
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";
data: InferEntrySchema<"fragments">
} & { render(): Render[".md"] };
"en/super-cookies.mdx": {
id: "en/super-cookies.mdx";
slug: "en/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";
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";
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";
data: InferEntrySchema<"fragments">
} & { render(): Render[".md"] };
"fr/buttons.mdx": {
id: "fr/buttons.mdx";
slug: "fr/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";
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";
data: InferEntrySchema<"fragments">
} & { render(): Render[".md"] };
"fr/super-cookies.mdx": {
id: "fr/super-cookies.mdx";
slug: "fr/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";
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"] };
};
}; };
@ -479,5 +207,5 @@ declare module 'astro:content' {
type AnyEntryMap = ContentEntryMap & DataEntryMap; type AnyEntryMap = ContentEntryMap & DataEntryMap;
type ContentConfig = typeof import("../src/content/config"); type ContentConfig = never;
} }

View File

@ -4,21 +4,19 @@ import { defineConfig } from "astro/config";
import i18n from "astro-i18n"; import i18n from "astro-i18n";
// https://astro.build/config // https://astro.build/config
import image from "@astrojs/image";
import mdx from "@astrojs/mdx"; import mdx from "@astrojs/mdx";
import sitemap from "@astrojs/sitemap"; import sitemap from "@astrojs/sitemap";
// https://astro.build/config // https://astro.build/config
export default defineConfig({ export default defineConfig({
site: "https://www.nardu.in", site: "https://www.nardu.in",
image: {
domains: ["assets.nardu.in"],
remotePatterns: [{ protocol: "https" }],
},
markdown: { markdown: {
syntaxHighlight: "prism", syntaxHighlight: "prism",
}, },
integrations: [ integrations: [
i18n(), i18n(),
image(),
mdx(), mdx(),
sitemap({ sitemap({
i18n: { i18n: {

View File

@ -13,12 +13,12 @@
"i18n:sync": "astro-i18n sync" "i18n:sync": "astro-i18n sync"
}, },
"dependencies": { "dependencies": {
"@astrojs/mdx": "^1.1.0", "@astrojs/image": "0.17.0",
"@astrojs/rss": "^3.0.0", "@astrojs/mdx": "^0.19.7",
"@astrojs/sitemap": "^3.0.0", "@astrojs/rss": "^2.4.3",
"astro": "3.1.1", "@astrojs/sitemap": "^1.3.3",
"astro-i18n": "1.8.1", "astro": "2.6.3",
"sharp": "^0.32.6" "astro-i18n": "1.8.1"
}, },
"devDependencies": { "devDependencies": {
"autoprefixer": "^10.4.13", "autoprefixer": "^10.4.13",

File diff suppressed because it is too large Load Diff

View File

@ -1,44 +1,15 @@
--- ---
import { Image, getImage } from "astro:assets"; import { Picture } from "@astrojs/image/components";
const { src, alt, width, height, ...attrs } = Astro.props; 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> <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} src={src}
width={Number(imgWidth)} widths={[320, 640, 768]}
height={Number(imgHeight)} aspectRatio={`${width}:${height}`}
format="jpg" sizes={`(max-inline-size: ${width}px) 100vw, ${width}px`}
formats={["avif", "webp"]}
alt={alt ? alt : ""} alt={alt ? alt : ""}
{...attrs} {...attrs}
/> />
</picture>

View File

@ -9,12 +9,13 @@ const isReference = routeName === t("references.slug");
--- ---
<div class:list={["card", { "card--link": !isReference }]}> <div class:list={["card", { "card--link": !isReference }]}>
<div>
<h3> <h3>
{ {
!isReference ? ( !isReference ? (
<a <a
class="clean-link card__link" class="clean-link card__link"
href={`${l(`/${routeName}`)}/${item.data.permalink}`} href={`${l(`/${routeName}`)}/${item.slug}`}
> >
{item.data.title} {item.data.title}
</a> </a>
@ -34,8 +35,9 @@ const isReference = routeName === t("references.slug");
) )
} }
</div> </div>
</div>
<style define:vars={{ permalink: item.data.permalink }}> <style scoped>
.card { .card {
padding: var(--space-s-m) var(--space-xs-s); padding: var(--space-s-m) var(--space-xs-s);
position: relative; position: relative;
@ -123,9 +125,6 @@ const isReference = routeName === t("references.slug");
.card::after { .card::after {
transition: opacity ease 0.2s, transform ease 0.2s; transition: opacity ease 0.2s, transform ease 0.2s;
} }
.card--link {
view-transition-name: var(--permalink);
}
h3 a { h3 a {
transition: color ease 0.2s; transition: color ease 0.2s;
} }

View File

@ -1,17 +1,19 @@
--- ---
// import { renderContent } from "astro-i18n"; import { renderContent } from "astro-i18n";
import MetaDate from "./MetaDate.astro"; import MetaDate from "./MetaDate.astro";
import TOC from "./TOC.astro"; import TOC from "./TOC.astro";
const { content } = Astro.props; const { content } = Astro.props;
const { Content, headings } = await content.render(); // const { Content, headings } = await content.render();
// const { html, headings } = await renderContent(Astro, content); const { html, headings } = await renderContent(Astro, content);
const toc = headings.map((heading) => { const toc = headings.map((heading) => {
return heading; return heading;
}); });
if (content.data.code) {
import "../styles/vendor/one-dark-pro.css"; import "../styles/vendor/one-dark-pro.css";
}
--- ---
<div class="sidebar region"> <div class="sidebar region">
@ -20,17 +22,13 @@ import "../styles/vendor/one-dark-pro.css";
<h1>{content.data.title}</h1> <h1>{content.data.title}</h1>
<p class="h3">{content.data.subtitle}</p> <p class="h3">{content.data.subtitle}</p>
<MetaDate item={content.data} /> <MetaDate item={content.data} />
<!-- <div class="flow content" set:html={html}> --> <div class="flow content" set:html={html}>
<Content /> <!-- <Content /> -->
</div>
</article> </article>
</div> </div>
<style define:vars={{ permalink: content.data.permalink }}> <style>
@media (prefers-reduced-motion: no-preference) {
article {
view-transition-name: var(--permalink);
}
}
.sidebar { .sidebar {
--gutter: var(--space-xs-m); --gutter: var(--space-xs-m);
} }

View File

@ -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>

View File

@ -34,7 +34,7 @@ const { item } = Astro.props;
text-align: center; text-align: center;
gap: var(--space-xs); gap: var(--space-xs);
cursor: pointer; cursor: pointer;
background-color: var(--color-white); background-color: var(--color-light-blue);
transform: translateY(0); transform: translateY(0);
} }
.card:focus-within { .card:focus-within {

View File

@ -2,7 +2,7 @@
title: Nico v2.0 title: Nico v2.0
subtitle: 2022 update of many things. subtitle: 2022 update of many things.
lang: en lang: en
permalink: "2022" slug: "2022"
excerpt: Changes in my services, the website and myself. excerpt: Changes in my services, the website and myself.
tags: ["Freelance"] tags: ["Freelance"]
type: articles type: articles

View File

@ -2,7 +2,7 @@
title: Nico v2.5 title: Nico v2.5
subtitle: Update 2023. subtitle: Update 2023.
lang: en lang: en
permalink: "2023" slug: "2023"
excerpt: New changes. excerpt: New changes.
tags: ["Freelance"] tags: ["Freelance"]
type: articles type: articles

View File

@ -2,7 +2,7 @@
title: After Effects Expressions title: After Effects Expressions
subtitle: Animation on steroïds. subtitle: Animation on steroïds.
lang: en 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! 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"] tags: ["Design"]
type: articles type: articles
@ -11,6 +11,9 @@ code: true
--- ---
import AstroImage from "../../../components/AstroImage.astro"; 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 ## An ever lasting battle
@ -22,7 +25,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. 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 <AstroImage
src="https://assets.nardu.in/basic_expression_d81b12f1ac.jpeg" src={basicExpression}
width="728" width="728"
height="80" height="80"
alt="Parenting the position of the form to a null creates an expression." alt="Parenting the position of the form to a null creates an expression."
@ -33,7 +36,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. 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 <AstroImage
src="https://assets.nardu.in/shortcut_39cc19d383.jpeg" src={shortcut}
width="728" width="728"
height="322" height="322"
alt="Alt + Click the stopwatch to access the shortcuts." alt="Alt + Click the stopwatch to access the shortcuts."

View File

@ -2,7 +2,7 @@
title: Accessibility and sobriety title: Accessibility and sobriety
subtitle: Translation in progress, stay tuned ;) subtitle: Translation in progress, stay tuned ;)
lang: en lang: en
permalink: "faq" slug: "faq"
draft: true draft: true
excerpt: Why, how et and especially what. excerpt: Why, how et and especially what.
tags: ["Freelance"] tags: ["Freelance"]

View File

@ -2,7 +2,7 @@
title: Gratuiste title: Gratuiste
subtitle: Translation in progress, stay tuned ;) subtitle: Translation in progress, stay tuned ;)
lang: en lang: en
permalink: "gratuiste" slug: "gratuiste"
draft: true draft: true
excerpt: Translation in progress, stay tuned ;) excerpt: Translation in progress, stay tuned ;)
tags: ["Design", "Freelance"] tags: ["Design", "Freelance"]

View File

@ -2,7 +2,7 @@
title: "Access blocked Sci-hub" title: "Access blocked Sci-hub"
subtitle: "The science of sharing." subtitle: "The science of sharing."
lang: en lang: en
permalink: "sci-hub-unblock" slug: "sci-hub-unblock"
key: "scihub" 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." 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"] tags: ["Internet", "Science"]
@ -12,6 +12,13 @@ updatedAt: "2022-12-27T12:08:00.000Z"
--- ---
import AstroImage from "../../../components/AstroImage.astro"; 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> The current sci-hub address is: <a href="https://sci-hub.se" rel="noreferer noopener">sci-hub.se</a>
@ -46,7 +53,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. 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 <AstroImage
src="https://assets.nardu.in/ef5a4b8e82a046e6a466c73c2fd9e99e.jpg" src={macOs}
width="728" width="728"
height="1060" height="1060"
alt="MacOS network and DNS settings" alt="MacOS network and DNS settings"
@ -67,28 +74,28 @@ Go to:
From there, you can add DNS servers. Click save. You might need to restart your computer for the changes to work. From there, you can add DNS servers. Click save. You might need to restart your computer for the changes to work.
<AstroImage <AstroImage
src="https://assets.nardu.in/sci-hub-settings.jpg" src={windowsSettings}
width="728" width="728"
height="319" height="319"
alt="Windows system settings" alt="Windows system settings"
/> />
<AstroImage <AstroImage
src="https://assets.nardu.in/sci-hub-network.jpg" src={windowsNetwork}
width="728" width="728"
height="803" height="803"
alt="Windows network settings" alt="Windows network settings"
/> />
<AstroImage <AstroImage
src="https://assets.nardu.in/sci-hub-adapter.jpg" src={windowsAdapter}
width="728" width="728"
height="327" height="327"
alt="Windows network connections settings" alt="Windows network connections settings"
/> />
<AstroImage <AstroImage
src="https://assets.nardu.in/sci-hub-adapter-settings.jpg" src={windowsAdapterSettings}
width="728" width="728"
height="434" height="434"
alt="Windows network adapter settings" alt="Windows network adapter settings"

View File

@ -2,7 +2,7 @@
title: The day I Jamd title: The day I Jamd
subtitle: A story of unusual tools and fun gambles. subtitle: A story of unusual tools and fun gambles.
lang: en lang: en
permalink: "the-day-I-jamd" slug: "the-day-I-jamd"
excerpt: Ooh, yeah! All right! Were jammin excerpt: Ooh, yeah! All right! Were jammin
tags: ["Dev", "Jamstack"] tags: ["Dev", "Jamstack"]
type: articles type: articles
@ -11,6 +11,8 @@ updatedAt: "2022-12-27T15:40:06.000Z"
--- ---
import AstroImage from "../../../components/AstroImage.astro"; 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 ## The not so easy choice
@ -31,7 +33,7 @@ Boy did they exceed my expectations! With almost no optimization on the static s
### wordpress ### wordpress
<AstroImage <AstroImage
src="https://assets.nardu.in/wordpress_8ee6f54b98.jpeg" src={wordpress}
width="728" width="728"
height="412" height="412"
alt="Performance score of 53/100 on Wordpress." alt="Performance score of 53/100 on Wordpress."
@ -42,7 +44,7 @@ Despite a lot of efforts I could not do better. Im no expert in caching, do n
### 11ty + strapi ### 11ty + strapi
<AstroImage <AstroImage
src="https://assets.nardu.in/static_2c0d9f1eb8.jpeg" src={strapi11ty}
width="728" width="728"
height="412" height="412"
alt="Performance score of 97/100 on jamstack." alt="Performance score of 97/100 on jamstack."

View File

@ -2,7 +2,7 @@
title: Video compression title: Video compression
subtitle: Encode like you mean it. subtitle: Encode like you mean it.
lang: en lang: en
permalink: "video-compression" slug: "video-compression"
excerpt: How to gain precious weight when encoding videos. excerpt: How to gain precious weight when encoding videos.
tags: ["Design"] tags: ["Design"]
type: articles type: articles
@ -11,6 +11,11 @@ updatedAt: "2022-06-08T14:24:06.000Z"
--- ---
import AstroImage from "../../../components/AstroImage.astro"; 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. ## Let's play.
@ -26,11 +31,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: Let's say we exported a 1920x1080 video from Premiere Pro with these basic settings:
<AstroImage <AstroImage src={premiereExport} width="673" height="800" alt="" />
src="https://assets.nardu.in/video-premiere-1.jpeg"
width="673"
height="800"
/>
It's gorgeous, it's Full HD, it's 1:30 minute of excellent editing but it's 50mb… What a shame. It's gorgeous, it's Full HD, it's 1:30 minute of excellent editing but it's 50mb… What a shame.
@ -51,11 +52,7 @@ While it's not as nice as Premiere Pro, it has way more exporting capabilities.
1. Check Web Optimized 1. Check Web Optimized
1. Keep MPEG-4 as the format 1. Keep MPEG-4 as the format
<AstroImage <AstroImage src={handbrakeBase} width="728" height="337" alt="" />
src="https://assets.nardu.in/video-handbrake-1.jpeg"
width="728"
height="337"
/>
### Video screen ### Video screen
@ -64,11 +61,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 Peak Framerate. If you don't know the framerate, keep the default setting
1. Choose the type of video you are encoding (film, animation…) 1. Choose the type of video you are encoding (film, animation…)
<AstroImage <AstroImage src={handbrakeVideo} width="728" height="337" alt="" />
src="https://assets.nardu.in/video-handbrake-2.jpeg"
width="728"
height="337"
/>
### Audio screen ### Audio screen
@ -79,11 +72,7 @@ If you have an audio channel, these settings are great and will not influence th
1. Samplerate 44.1 1. Samplerate 44.1
1. Bitrate 192 to 256 (your choice) 1. Bitrate 192 to 256 (your choice)
<AstroImage <AstroImage src={handbrakeAudio} width="728" height="337" alt="" />
src="https://assets.nardu.in/video-handbrake-3.jpeg"
width="728"
height="337"
/>
### Export! ### Export!
@ -104,12 +93,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: 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 <AstroImage src={handbrakeWeb} width="728" height="313" alt="" />
src="https://assets.nardu.in/video-handbrake-4.jpg"
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. The only down side is that it takes some time to encode. It will depend on the video length and your computing power.

View File

@ -2,7 +2,7 @@
title: Nico v2.0 title: Nico v2.0
subtitle: Mise à jour 2022 de plein de trucs. subtitle: Mise à jour 2022 de plein de trucs.
lang: fr lang: fr
permalink: "2022" slug: "2022"
excerpt: Évolution des services, du site et de moi-même. excerpt: Évolution des services, du site et de moi-même.
tags: ["Freelance"] tags: ["Freelance"]
type: articles type: articles

View File

@ -2,7 +2,7 @@
title: Nico v2.5 title: Nico v2.5
subtitle: Mise à jour 2023. subtitle: Mise à jour 2023.
lang: fr lang: fr
permalink: "2023" slug: "2023"
excerpt: Suite des évolutions. excerpt: Suite des évolutions.
tags: ["Freelance"] tags: ["Freelance"]
type: articles type: articles

View File

@ -3,7 +3,7 @@ title: After Effects Expressions
subtitle: En cours de traduction, revenez bientôt ;) subtitle: En cours de traduction, revenez bientôt ;)
lang: fr lang: fr
draft: true draft: true
permalink: "after-effects-expressions" slug: "after-effects-expressions"
excerpt: En cours de traduction, revenez bientôt ;) excerpt: En cours de traduction, revenez bientôt ;)
tags: ["Design"] tags: ["Design"]
type: articles type: articles

View File

@ -2,7 +2,7 @@
title: Accessibilité, sobriété et F.A.Q. title: Accessibilité, sobriété et F.A.Q.
subtitle: Explications sur ma vision et mon fonctionnement. subtitle: Explications sur ma vision et mon fonctionnement.
lang: fr lang: fr
permalink: "faq" slug: "faq"
excerpt: Pourquoi, comment et surtout quèsaco. excerpt: Pourquoi, comment et surtout quèsaco.
tags: ["Freelance"] tags: ["Freelance"]
type: articles type: articles

View File

@ -2,7 +2,7 @@
title: "Gratuiste" title: "Gratuiste"
subtitle: "Ou le travail gratuit." subtitle: "Ou le travail gratuit."
lang: fr lang: fr
permalink: "gratuiste" slug: "gratuiste"
excerpt: "Jai cherché un moyen de mettre mes compétences au service dautrui et je pense avoir trouvé: je vais travailler gratuitement pour des associations." excerpt: "Jai cherché un moyen de mettre mes compétences au service dautrui et je pense avoir trouvé: je vais travailler gratuitement pour des associations."
tags: ["Graphisme", "Freelance"] tags: ["Graphisme", "Freelance"]
type: articles type: articles

View File

@ -2,7 +2,7 @@
title: "Sci-hub bloqué, comment contourner" title: "Sci-hub bloqué, comment contourner"
subtitle: "La science du partage." subtitle: "La science du partage."
lang: fr lang: fr
permalink: "sci-hub-blocage" slug: "sci-hub-blocage"
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." 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"] tags: ["Internet", "Science"]
type: articles type: articles
@ -11,6 +11,13 @@ updatedAt: "2022-12-27T12:08:00.000Z"
--- ---
import AstroImage from "../../../components/AstroImage.astro"; 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) L'adresse actuelle de sci-hub est&nbsp;: [sci-hub.se](https://sci-hub.se)
@ -49,7 +56,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. 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 <AstroImage
src="https://assets.nardu.in/ef5a4b8e82a046e6a466c73c2fd9e99e.jpg" src={macOs}
width="728" width="728"
height="1060" height="1060"
alt="MacOS réglages réseau et DNS" alt="MacOS réglages réseau et DNS"
@ -68,28 +75,28 @@ Ouvrez&nbsp;:
1. Utiliser ladresse de serveur DNS suivante 1. Utiliser ladresse de serveur DNS suivante
<AstroImage <AstroImage
src="https://assets.nardu.in/sci-hub-settings.jpg" src={windowsSettings}
width="728" width="728"
height="319" height="319"
alt="Réglages windows" alt="Réglages windows"
/> />
<AstroImage <AstroImage
src="https://assets.nardu.in/sci-hub-network.jpg" src={windowsNetwork}
width="728" width="728"
height="803" height="803"
alt="Windows réglages réseaux" alt="Windows réglages réseaux"
/> />
<AstroImage <AstroImage
src="https://assets.nardu.in/sci-hub-adapter.jpg" src={windowsAdapter}
width="728" width="728"
height="327" height="327"
alt="Windows régalges connections réseaux" alt="Windows régalges connections réseaux"
/> />
<AstroImage <AstroImage
src="https://assets.nardu.in/sci-hub-adapter-settings.jpg" src={windowsAdapterSettings}
width="728" width="728"
height="434" height="434"
alt="Windows options adaptateur réseau" alt="Windows options adaptateur réseau"

View File

@ -2,7 +2,7 @@
title: The day I Jamd title: The day I Jamd
subtitle: Des paris, des outils et du fun. subtitle: Des paris, des outils et du fun.
lang: fr lang: fr
permalink: "the-day-I-jamd" slug: "the-day-I-jamd"
excerpt: Ooh, yeah! All right! Were jammin excerpt: Ooh, yeah! All right! Were jammin
tags: ["Dev", "Jamstack"] tags: ["Dev", "Jamstack"]
type: articles type: articles
@ -11,6 +11,8 @@ updatedAt: "2022-12-27T15:40:06.000Z"
--- ---
import AstroImage from "../../../components/AstroImage.astro"; 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é ## La solution de non facilité
@ -31,7 +33,7 @@ Jen suis resté pantois&nbsp;! Quasiment sans optimisation du côté statique
### wordpress ### wordpress
<AstroImage <AstroImage
src="https://assets.nardu.in/wordpress_8ee6f54b98.jpeg" src={wordpress}
width="728" width="728"
height="412" height="412"
alt="Score de performance de 53/100 sur Wordpress." alt="Score de performance de 53/100 sur Wordpress."
@ -42,7 +44,7 @@ Malgré beaucoup defforts, je nai pas pu faire mieux. Je ne suis pas un ex
### 11ty + strapi ### 11ty + strapi
<AstroImage <AstroImage
src="https://assets.nardu.in/static_2c0d9f1eb8.jpeg" src={strapi11ty}
width="728" width="728"
height="412" height="412"
alt="Score de performance de 97/100 en Jamstack." alt="Score de performance de 97/100 en Jamstack."

View File

@ -3,7 +3,7 @@ title: Compression vidéo
subtitle: En cours de traduction, revenez bientôt ;) subtitle: En cours de traduction, revenez bientôt ;)
lang: fr lang: fr
draft: true draft: true
permalink: "video-compression" slug: "video-compression"
excerpt: Pas encore traduit excerpt: Pas encore traduit
tags: ["Design"] tags: ["Design"]
type: articles type: articles

View File

@ -7,7 +7,6 @@ const articles = defineCollection({
lang: z.enum(["fr", "en"]), lang: z.enum(["fr", "en"]),
tags: z.array(z.string()), // An array of strings tags: z.array(z.string()), // An array of strings
type: z.string(), type: z.string(),
permalink: z.string(),
// Parse pubDate as a browser-standard `Date` object // Parse pubDate as a browser-standard `Date` object
createdAt: z.string().transform((str) => new Date(str)), createdAt: z.string().transform((str) => new Date(str)),
updatedAt: z updatedAt: z
@ -26,7 +25,6 @@ const fragments = defineCollection({
lang: z.enum(["fr", "en"]), lang: z.enum(["fr", "en"]),
tags: z.array(z.string()), // An array of strings tags: z.array(z.string()), // An array of strings
type: z.string(), type: z.string(),
permalink: z.string(),
// Parse pubDate as a browser-standard `Date` object // Parse pubDate as a browser-standard `Date` object
createdAt: z.string().transform((str) => new Date(str)), createdAt: z.string().transform((str) => new Date(str)),
updatedAt: z updatedAt: z
@ -44,7 +42,6 @@ const references = defineCollection({
subtitle: z.string(), subtitle: z.string(),
url: z.string(), url: z.string(),
lang: z.enum(["fr", "en"]), lang: z.enum(["fr", "en"]),
permalink: z.string(),
tags: z.array(z.string()), // An array of strings tags: z.array(z.string()), // An array of strings
// Parse pubDate as a browser-standard `Date` object // Parse pubDate as a browser-standard `Date` object
createdAt: z.string().transform((str) => new Date(str)), createdAt: z.string().transform((str) => new Date(str)),

View File

@ -2,7 +2,7 @@
title: Strong TLS certificates with acme.sh title: Strong TLS certificates with acme.sh
subtitle: 384-bit of https subtitle: 384-bit of https
lang: en lang: en
permalink: "acme-sh-tls-cert" slug: "acme-sh-tls-cert"
createdAt: "2022-06-08T14:24:06.000Z" createdAt: "2022-06-08T14:24:06.000Z"
excerpt: Real cert have curves. excerpt: Real cert have curves.
tags: ["security"] tags: ["security"]

View File

@ -2,7 +2,7 @@
title: Filter an array against another array title: Filter an array against another array
subtitle: Array vs Array. subtitle: Array vs Array.
lang: en lang: en
permalink: "array-vs-array" slug: "array-vs-array"
createdAt: "2022-06-08T14:24:06.000Z" createdAt: "2022-06-08T14:24:06.000Z"
excerpt: My peak javascript excerpt: My peak javascript
tags: ["nuxt.js"] tags: ["nuxt.js"]

View File

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

View File

@ -3,7 +3,7 @@ title: Full width image
subtitle: Translation in progress, stay tuned ;) subtitle: Translation in progress, stay tuned ;)
lang: en lang: en
draft: true draft: true
permalink: "image-full" slug: "image-full"
createdAt: "2020-09-15T09:00:00.000Z" createdAt: "2020-09-15T09:00:00.000Z"
updatedAt: "2022-06-08T14:24:06.000Z" updatedAt: "2022-06-08T14:24:06.000Z"
tags: ["CSS"] tags: ["CSS"]

View File

@ -2,7 +2,7 @@
title: Static website and GraphQL queries with Nuxt.js title: Static website and GraphQL queries with Nuxt.js
subtitle: Graphql client is king. subtitle: Graphql client is king.
lang: en lang: en
permalink: "nuxt-graphql-static" slug: "nuxt-graphql-static"
createdAt: "2022-06-08T14:24:06.000Z" createdAt: "2022-06-08T14:24:06.000Z"
updatedAt: "2022-09-08T13:43:33.000Z" updatedAt: "2022-09-08T13:43:33.000Z"
excerpt: When the most used gql module doesn't work… excerpt: When the most used gql module doesn't work…
@ -131,7 +131,7 @@ export default {
const locale = app.i18n.localeProperties.iso const locale = app.i18n.localeProperties.iso
const data = await $graphql.default.request(articleQuery, { const data = await $graphql.default.request(articleQuery, {
code: locale, code: locale,
permalink: params.slug, slug: params.slug,
}) })
return { data } return { data }
}, },

View File

@ -2,7 +2,7 @@
title: The best cookies title: The best cookies
subtitle: Consentless biscuits. subtitle: Consentless biscuits.
lang: en lang: en
permalink: "super-cookies" slug: "super-cookies"
createdAt: "2022-06-08T14:24:06.000Z" createdAt: "2022-06-08T14:24:06.000Z"
excerpt: It's a real recipe, not a joke about annoying files. excerpt: It's a real recipe, not a joke about annoying files.
tags: ["food"] tags: ["food"]
@ -10,6 +10,8 @@ type: snippets
--- ---
import AstroImage from "../../../components/AstroImage.astro"; import AstroImage from "../../../components/AstroImage.astro";
export const cookies1 = "https://assets.nardu.in/cookies-fig-1.jpg";
export const cookies2 = "https://assets.nardu.in/cookies-fig-2.jpg";
## Vegetalian version ## Vegetalian version
@ -74,14 +76,14 @@ Chocolate can be replaced by anything like nuts, raisins, legos... (don't eat le
## Figures ## Figures
<AstroImage <AstroImage
src="https://assets.nardu.in/cookies-fig-1.jpg" src={cookies1}
width="753" width="753"
height="1248" height="1248"
alt="All ingredients mixed together to form a brown paste." alt="All ingredients mixed together to form a brown paste."
/> />
<AstroImage <AstroImage
src="https://assets.nardu.in/cookies-fig-2.jpg" src={cookies2}
width="753" width="753"
height="1248" height="1248"
alt="The cookies are round and soft after baking." alt="The cookies are rounded and soft after baking."
/> />

View File

@ -2,7 +2,7 @@
title: Toulouse yourself title: Toulouse yourself
subtitle: Only the bestest subtitle: Only the bestest
lang: en lang: en
permalink: "toulouse-fun" slug: "toulouse-fun"
excerpt: Gonna have to trust me on this ¯\_(ツ)_/¯ excerpt: Gonna have to trust me on this ¯\_(ツ)_/¯
tags: ["lifestyle"] tags: ["lifestyle"]
type: snippets type: snippets

View File

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

View File

@ -2,7 +2,7 @@
title: Certificates TLS robustes avec acme.sh title: Certificates TLS robustes avec acme.sh
subtitle: 384-bit de https subtitle: 384-bit de https
lang: fr lang: fr
permalink: "acme-sh-tls-cert" slug: "acme-sh-tls-cert"
createdAt: "2022-06-08T14:24:06.000Z" createdAt: "2022-06-08T14:24:06.000Z"
excerpt: La sécurité avec des courbes. excerpt: La sécurité avec des courbes.
tags: ["sécurité"] tags: ["sécurité"]

View File

@ -3,7 +3,7 @@ title: Filtrer un array avec un autre array
subtitle: En cours de traduction. subtitle: En cours de traduction.
lang: fr lang: fr
draft: true draft: true
permalink: "array-vs-array" slug: "array-vs-array"
createdAt: "2022-06-08T14:24:06.000Z" createdAt: "2022-06-08T14:24:06.000Z"
excerpt: En cours de traduction. excerpt: En cours de traduction.
tags: ["nuxt.js"] tags: ["nuxt.js"]

View File

@ -2,7 +2,7 @@
title: "Effets de survol de boutons" title: "Effets de survol de boutons"
subtitle: "Simples mais efficaces." subtitle: "Simples mais efficaces."
lang: fr lang: fr
permalink: "buttons" slug: "buttons"
draft: true draft: true
excerpt: Quelques effets de survol faciles à récupérer et utiliser. excerpt: Quelques effets de survol faciles à récupérer et utiliser.
tags: ["CSS"] tags: ["CSS"]
@ -51,7 +51,7 @@ Tous les boutons présents utilisent ces styles comme base en guise de «&nbsp;r
background-color: hotpink; background-color: hotpink;
} }
.btn-icon::before { .btn-icon::before {
content: url("./assets/svg/arrow-right-white.svg"); content: url("~assets/svg/arrow-right-white.svg");
position: absolute; position: absolute;
width: 20px; width: 20px;
top: 50%; top: 50%;

View File

@ -2,7 +2,7 @@
title: Image pleine largeur title: Image pleine largeur
subtitle: Casser le conteneur. subtitle: Casser le conteneur.
lang: fr lang: fr
permalink: "image-full" slug: "image-full"
createdAt: "2020-09-15T09:00:00.000Z" createdAt: "2020-09-15T09:00:00.000Z"
updatedAt: "2022-06-08T14:24:06.000Z" updatedAt: "2022-06-08T14:24:06.000Z"
excerpt: Faire déborder une image de son conteneur sans tout casser. excerpt: Faire déborder une image de son conteneur sans tout casser.
@ -11,16 +11,23 @@ type: fragments
--- ---
import AstroImage from "../../../components/AstroImage.astro"; import AstroImage from "../../../components/AstroImage.astro";
export const example =
"https://assets.nardu.in/image_bleed_container_9e3939b3ae.jpeg";
export const context =
"https://assets.nardu.in/image_bleed_original_d49f0d11bf.jpeg";
export const container =
"https://assets.nardu.in/image_bleed_full_2a902f9539.jpeg";
export const banner =
"https://assets.nardu.in/image_bleed_height_81b4ce969a.jpeg";
export const broken =
"https://assets.nardu.in/image_bleed_deformed_479046d2cb.jpeg";
export const result = "https://assets.nardu.in/image_bleed_6c164e82b3.jpeg";
## Image inline ## 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. 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 <AstroImage src={example} width="320" height="568" alt="" />
src="https://assets.nardu.in/image_bleed_container_9e3939b3ae.jpeg"
width="320"
height="568"
/>
### Contexte ### Contexte
@ -49,11 +56,7 @@ img {
} }
``` ```
<AstroImage <AstroImage src={context} width="320" height="568" alt="" />
src="https://assets.nardu.in/image_bleed_original_d49f0d11bf.jpeg"
width="320"
height="568"
/>
### Déborder du conteneur ### Déborder du conteneur
@ -67,11 +70,7 @@ Afin de faire prendre à l'image toute la largeur, on agit sur son conteneur&nbs
} }
``` ```
<AstroImage <AstroImage src={container} width="320" height="568" alt="" />
src="https://assets.nardu.in/image_bleed_full_2a902f9539.jpeg"
width="320"
height="568"
/>
### Faire une bannière ### Faire une bannière
@ -86,11 +85,7 @@ On peut alors réduire la hauteur du conteneur pour obtenir une bannière plutô
} }
``` ```
<AstroImage <AstroImage src={banner} width="320" height="568" alt="" />
src="https://assets.nardu.in/image_bleed_height_81b4ce969a.jpeg"
width="320"
height="568"
/>
Il faut ensuite forcer l'image à prendre toute la largeur du conteneur&nbsp;: Il faut ensuite forcer l'image à prendre toute la largeur du conteneur&nbsp;:
@ -100,11 +95,7 @@ Il faut ensuite forcer l'image à prendre toute la largeur du conteneur&nbsp;:
} }
``` ```
<AstroImage <AstroImage src={broken} width="320" height="568" alt="" />
src="https://assets.nardu.in/image_bleed_deformed_479046d2cb.jpeg"
width="320"
height="568"
/>
Pas top… Pas top…
@ -119,11 +110,7 @@ Pas top…
} }
``` ```
<AstroImage <AstroImage src={result} width="320" height="568" alt="" />
src="https://assets.nardu.in/image_bleed_6c164e82b3.jpeg"
width="320"
height="568"
/>
Cette technique s'apparente à l'utilisation d'une image de background mais en dur 😁 Cette technique s'apparente à l'utilisation d'une image de background mais en dur 😁

View File

@ -2,7 +2,7 @@
title: Site statique et requêtes GraphQL avec Nuxt.js title: Site statique et requêtes GraphQL avec Nuxt.js
subtitle: Le client graphql est roi. subtitle: Le client graphql est roi.
lang: fr lang: fr
permalink: "nuxt-graphql-static" slug: "nuxt-graphql-static"
createdAt: "2022-06-08T14:24:06.000Z" createdAt: "2022-06-08T14:24:06.000Z"
updatedAt: "2022-09-08T13:43:33.000Z" updatedAt: "2022-09-08T13:43:33.000Z"
excerpt: Quand le module gql le plus utilisé ne fonctionne pas… excerpt: Quand le module gql le plus utilisé ne fonctionne pas…
@ -131,7 +131,7 @@ export default {
const locale = app.i18n.localeProperties.iso const locale = app.i18n.localeProperties.iso
const data = await $graphql.default.request(articleQuery, { const data = await $graphql.default.request(articleQuery, {
code: locale, code: locale,
permalink: params.slug, slug: params.slug,
}) })
return { data } return { data }
}, },

View File

@ -2,7 +2,7 @@
title: Les meilleurs cookies title: Les meilleurs cookies
subtitle: Des gâteaux sans consentement. subtitle: Des gâteaux sans consentement.
lang: fr lang: fr
permalink: "super-cookies" slug: "super-cookies"
createdAt: "2022-06-08T14:24:06.000Z" createdAt: "2022-06-08T14:24:06.000Z"
excerpt: C'est vraiment une recette hein, pas une blague sur les fichiers temporaires. excerpt: C'est vraiment une recette hein, pas une blague sur les fichiers temporaires.
tags: ["cuisine"] tags: ["cuisine"]
@ -10,6 +10,8 @@ type: fragments
--- ---
import AstroImage from "../../../components/AstroImage.astro"; import AstroImage from "../../../components/AstroImage.astro";
export const cookies1 = "https://assets.nardu.in/cookies-fig-1.jpg";
export const cookies2 = "https://assets.nardu.in/cookies-fig-2.jpg";
## Version végétalienne ## Version végétalienne
@ -74,13 +76,13 @@ Le chocolat peut-être remplacé par n'importe quoi comme des noix, des raisins
## Figures ## Figures
<AstroImage <AstroImage
src="https://assets.nardu.in/cookies-fig-1.jpg" src={cookies1}
width="753" width="753"
height="1248" height="1248"
alt="Tous les ingrédients mélangés forment une pâte marron." alt="Tous les ingrédients mélangés forment une pâte marron."
/> />
<AstroImage <AstroImage
src="https://assets.nardu.in/cookies-fig-2.jpg" src={cookies2}
width="753" width="753"
height="1248" height="1248"
alt="Les cookies cuits sont bombés et très moelleux." alt="Les cookies cuits sont bombés et très moelleux."

View File

@ -3,7 +3,7 @@ title: Toulouse yourself
subtitle: En cours de traduction. subtitle: En cours de traduction.
lang: fr lang: fr
draft: true draft: true
permalink: "toulouse-fun" slug: "toulouse-fun"
createdAt: "2022-06-22T15:34:45.000Z" createdAt: "2022-06-22T15:34:45.000Z"
excerpt: En cours de traduction. excerpt: En cours de traduction.
tags: ["lifestyle"] tags: ["lifestyle"]

View File

@ -3,7 +3,7 @@ title: Liens visités et indication visuelle
subtitle: Comment différencier les liens déjà cliqués subtitle: Comment différencier les liens déjà cliqués
lang: fr lang: fr
draft: false draft: false
permalink: "visited-links" slug: "visited-links"
excerpt: Petit hack CSS excerpt: Petit hack CSS
tags: ["Front-end"] tags: ["Front-end"]
type: snippets type: snippets

View File

@ -3,7 +3,7 @@ title: 3w
subtitle: I wrote the doc! subtitle: I wrote the doc!
url: https://3-w.fr url: https://3-w.fr
lang: en lang: en
permalink: "3w" slug: "3w"
excerpt: Développement web et compagnie. excerpt: Développement web et compagnie.
tags: ["Front-end", "docs"] tags: ["Front-end", "docs"]
createdAt: "2022-10-19T18:02:00.000Z" createdAt: "2022-10-19T18:02:00.000Z"

View File

@ -3,7 +3,7 @@ title: Nature en Occitanie
subtitle: Sobriety is only natural. subtitle: Sobriety is only natural.
url: https://www.natureo.org/ url: https://www.natureo.org/
lang: en lang: en
permalink: "natureo" slug: "natureo"
excerpt: Développement web et compagnie. excerpt: Développement web et compagnie.
tags: ["Front-end", "accessibility", "sobriety", "CMS"] tags: ["Front-end", "accessibility", "sobriety", "CMS"]
createdAt: "2023-04-19T18:02:00.000Z" createdAt: "2023-04-19T18:02:00.000Z"

View File

@ -3,7 +3,7 @@ title: Parole Expression
subtitle: A new website for the association. subtitle: A new website for the association.
url: https://www.paroleexpression.fr/ url: https://www.paroleexpression.fr/
lang: en lang: en
permalink: "parole-expression" slug: "parole-expression"
excerpt: Développement web et compagnie. excerpt: Développement web et compagnie.
tags: ["Front-end", "sobriety", "CMS"] tags: ["Front-end", "sobriety", "CMS"]
createdAt: "2022-04-19T17:11:00.000Z" createdAt: "2022-04-19T17:11:00.000Z"

View File

@ -3,7 +3,7 @@ title: Rose Primaire
subtitle: An agency we love. subtitle: An agency we love.
url: https://roseprimaire.com/ url: https://roseprimaire.com/
lang: en lang: en
permalink: "rose-primaire" slug: "rose-primaire"
excerpt: Web dev and other things. excerpt: Web dev and other things.
tags: ["Front-end", "accessibility", "sobriety", "CMS"] tags: ["Front-end", "accessibility", "sobriety", "CMS"]
createdAt: "2023-04-19T17:11:00.000Z" createdAt: "2023-04-19T17:11:00.000Z"

View File

@ -3,7 +3,7 @@ title: 3w
subtitle: J'ai fait de la doc! subtitle: J'ai fait de la doc!
url: https://3-w.fr url: https://3-w.fr
lang: fr lang: fr
permalink: "3w" slug: "3w"
excerpt: Développement web et compagnie. excerpt: Développement web et compagnie.
tags: ["Front-end", "documentation"] tags: ["Front-end", "documentation"]
createdAt: "2022-10-19T18:02:00.000Z" createdAt: "2022-10-19T18:02:00.000Z"

View File

@ -3,7 +3,7 @@ title: Nature en Occitanie
subtitle: La sobriété au naturel. subtitle: La sobriété au naturel.
url: https://www.natureo.org/ url: https://www.natureo.org/
lang: fr lang: fr
permalink: "natureo" slug: "natureo"
excerpt: Développement web et compagnie. excerpt: Développement web et compagnie.
tags: ["Front-end", "accessibilité", "éco-conception", "CMS"] tags: ["Front-end", "accessibilité", "éco-conception", "CMS"]
createdAt: "2023-04-19T18:02:00.000Z" createdAt: "2023-04-19T18:02:00.000Z"

View File

@ -3,7 +3,7 @@ title: Parole Expression
subtitle: Un nouveau site pour l'association. subtitle: Un nouveau site pour l'association.
url: https://www.paroleexpression.fr/ url: https://www.paroleexpression.fr/
lang: fr lang: fr
permalink: parole-expression slug: parole-expression
excerpt: Développement web et compagnie. excerpt: Développement web et compagnie.
tags: ["Front-end", "éco-conception", "CMS"] tags: ["Front-end", "éco-conception", "CMS"]
createdAt: "2022-04-19T17:11:00.000Z" createdAt: "2022-04-19T17:11:00.000Z"

View File

@ -3,7 +3,7 @@ title: Rose Primaire
subtitle: Une agence comme on l'aime. subtitle: Une agence comme on l'aime.
url: https://roseprimaire.com/ url: https://roseprimaire.com/
lang: fr lang: fr
permalink: "rose-primaire" slug: "rose-primaire"
excerpt: Développement web et compagnie. excerpt: Développement web et compagnie.
tags: ["Front-end", "accessibilité", "éco-conception", "CMS"] tags: ["Front-end", "accessibilité", "éco-conception", "CMS"]
createdAt: "2023-04-19T17:11:00.000Z" createdAt: "2023-04-19T17:11:00.000Z"

View File

@ -2,6 +2,8 @@
type: section type: section
id: offre id: offre
lang: en lang: en
slug:
createdAt:
image: /assets/images/home/offre-1.1.svg image: /assets/images/home/offre-1.1.svg
order: 1 order: 1
quickTitle: My offers quickTitle: My offers

View File

@ -2,6 +2,8 @@
type: section type: section
id: methodology id: methodology
lang: en lang: en
slug:
createdAt:
image: /assets/images/home/methodo.svg image: /assets/images/home/methodo.svg
order: 2 order: 2
quickTitle: My methodology quickTitle: My methodology

View File

@ -2,6 +2,8 @@
type: section type: section
id: about id: about
lang: en lang: en
slug:
createdAt:
image: /assets/images/home/about.svg image: /assets/images/home/about.svg
order: 3 order: 3
quickTitle: Me quickTitle: Me

View File

@ -16,4 +16,4 @@ Cette offre est destinée à un public souhaitant **se doter d'un site web**, sa
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. 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 href="/offres/web-classique" class="btn">L'offre classique en détails</a>

View File

@ -14,4 +14,4 @@ Lorsque le projet le nécessite, je fais appel à des partenaires talentueux par
- [Rose Primaire](https://roseprimaire.com/) pour le conseil et l'accompagnement du projet&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. - [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 href="/offres/accessibilite" class="btn">L'offre accessibilité en détails</a>

2
src/env.d.ts vendored
View File

@ -1,4 +1,4 @@
/// <reference path="../.astro/types.d.ts" /> /// <reference path="../.astro/types.d.ts" />
/// <reference types="astro/client" /> /// <reference types="@astrojs/image/client" />
/// <reference path="../.astro-i18n/generated.d.ts" /> /// <reference path="../.astro-i18n/generated.d.ts" />

Binary file not shown.

Binary file not shown.

View File

@ -1,18 +1,27 @@
--- ---
import { astroI18n } from "astro-i18n"; import { t, astroI18n } from "astro-i18n";
astroI18n.init(Astro); astroI18n.init(Astro);
import "../styles/style.css"; import "../styles/style.css";
import Head from "../components/Head.astro";
import Header from "../components/Header.astro"; import Header from "../components/Header.astro";
import Footer from "../components/Footer.astro"; import Footer from "../components/Footer.astro";
const { pageTitle } = Astro.props; const { pageTitle, titleColor } = Astro.props;
--- ---
<html lang={astroI18n.langCode} dir="ltr"> <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 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é." />
</head>
<body> <body>
<div class="wrapper"> <div class="wrapper">
<Header /> <Header />

View File

@ -0,0 +1,43 @@
---
import { astroI18n } from "astro-i18n";
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;
---
<html lang={astroI18n.langCode} dir="ltr">
<Head pageTitle={pageTitle} />
<body class="offre-layout">
<div class="wrapper">
<!-- <Header /> -->
<main id="skip-content" role="main">
<slot />
</main>
</div>
<!-- <Footer /> -->
<style>
html {
--color-primary: rgb(255, 222, 223);
--color-secondary: rgb(150, 0, 13);
}
@supports (color: oklch(0% 0 0)) {
html {
--color-primary: oklch(92.9% 0.04480512547881144 16.3020144016784);
--color-secondary: oklch(42.3% 0.193 26.95);
}
}
.offre-layout {
background-color: var(--color-primary);
}
.offre-layout :global(*) {
color: var(--color-secondary);
}
</style>
</body>
</html>

View File

@ -11,7 +11,7 @@ export const getStaticPaths = createStaticPaths(async ({ langCode }) => {
return data.lang === langCode; return data.lang === langCode;
}); });
return articles.map((article) => ({ return articles.map((article) => ({
params: { slug: article.data.permalink }, params: { slug: article.slug },
props: { article }, props: { article },
})); }));
}, import.meta.url); }, import.meta.url);

View File

@ -0,0 +1,6 @@
---
import Page from "../../offres/web-classique.astro"
const { props } = Astro
---
<Page {...props} />

View File

@ -26,7 +26,7 @@ export async function get(context) {
lang: post.data.lang, lang: post.data.lang,
// Compute RSS link from post `slug` // Compute RSS link from post `slug`
// This example assumes all posts are rendered as `/blog/[slug]` routes // This example assumes all posts are rendered as `/blog/[slug]` routes
link: `/en/${post.data.type}/${post.data.permalink}/`, link: `/en/${post.data.type}/${post.slug}/`,
})), })),
// (optional) inject custom xml // (optional) inject custom xml
customData: `<language>en-us</language>`, customData: `<language>en-us</language>`,

View File

@ -11,7 +11,7 @@ export const getStaticPaths = createStaticPaths(async ({ langCode }) => {
return data.lang === langCode; return data.lang === langCode;
}); });
return snippets.map((snippet) => ({ return snippets.map((snippet) => ({
params: { slug: snippet.data.permalink }, params: { slug: snippet.slug },
props: { snippet }, props: { snippet },
})); }));
}, import.meta.url); }, import.meta.url);

View File

@ -3,10 +3,13 @@
import { l, t, astroI18n } from "astro-i18n"; import { l, t, astroI18n } from "astro-i18n";
astroI18n.init(Astro); astroI18n.init(Astro);
import { getEntry } from "astro:content";
// import stuff // import stuff
import BaseLayout from "../layouts/BaseLayout.astro"; import BaseLayout from "../layouts/BaseLayout.astro";
import QuickAccessCard from "../components/QuickAccessCard.astro"; import QuickAccessCard from "../components/QuickAccessCard.astro";
import ListCards from "../components/ListCards.astro"; import ListCards from "../components/ListCards.astro";
import CardEditorial from "../components/CardEditorial.astro";
const pageTitle = t("accueil"); const pageTitle = t("accueil");
@ -70,7 +73,7 @@ const localizedReferences = await getCollection("references", ({ data }) => {
<div class="section__reference"> <div class="section__reference">
<ListCards <ListCards
list={localizedReferences.filter((ref) => { list={localizedReferences.filter((ref) => {
return ref.data.permalink === section.frontmatter.reference; return ref.slug === section.frontmatter.reference;
})} })}
routeName={t("references.slug")} routeName={t("references.slug")}
/> />

View File

@ -0,0 +1,28 @@
---
import OffreLayout from "../../layouts/OffreLayout.astro";
const pageTitle = "Offre web classique";
---
<OffreLayout pageTitle={pageTitle}>
<div class="region">
<section class="flow">
<h1>{pageTitle}</h1>
<p class="h3">Un site rapide, moderne et (plus) accessible.</p>
</section>
<section class="flow">
<h2>Description</h2>
<p class="h3">
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Est esse
molestias ipsam rerum, dolor libero dolores aperiam blanditiis,
provident, ut recusandae in quae non doloremque officia quia labore.
Tempore, sint!
</p>
</section>
</div>
</OffreLayout>
<style>
section {
}
</style>

View File

@ -26,7 +26,7 @@ export async function get(context) {
lang: post.data.lang, lang: post.data.lang,
// Compute RSS link from post `slug` // Compute RSS link from post `slug`
// This example assumes all posts are rendered as `/blog/[slug]` routes // This example assumes all posts are rendered as `/blog/[slug]` routes
link: `/${post.data.type}/${post.data.permalink}/`, link: `/${post.data.type}/${post.slug}/`,
})), })),
// (optional) inject custom xml // (optional) inject custom xml
customData: `<language>fr-fr</language>`, customData: `<language>fr-fr</language>`,

View File

@ -19,6 +19,13 @@
font-style: normal; font-style: normal;
font-display: swap; font-display: swap;
} }
@font-face {
font-family: "recoleta";
src: url("../../fonts/recoleta/Recoleta-SemiBold.woff2") format("woff2");
font-weight: 600;
font-style: normal;
font-display: swap;
}
/* /*
* reduces Cumulative Layout Shift * reduces Cumulative Layout Shift

View File

@ -126,6 +126,9 @@ ol:not([role="list"]) > li + li {
color: var(--color-blue); color: var(--color-blue);
background-color: var(--color-white); background-color: var(--color-white);
} }
.btn:visited {
color: var(--color-white);
}
button[disabled] { button[disabled] {
cursor: not-allowed; cursor: not-allowed;
@ -225,3 +228,11 @@ blockquote code {
.content pre[class*="language-"] { .content pre[class*="language-"] {
white-space: pre-wrap; white-space: pre-wrap;
} }
/* .astro-code .filename {
margin: 0.5rem 0;
display: block;
font-family: var(--font-code);
font-size: 1.4rem;
text-align: right;
} */

View File

@ -123,17 +123,7 @@ a:not([class]) {
} }
/* Make it clear that interactive elements are interactive */ /* Make it clear that interactive elements are interactive */
:where( :where(a[href], area, button, input, label[for], select, summary, textarea, [tabindex]:not([tabindex*="-"])) {
a[href],
area,
button,
input,
label[for],
select,
summary,
textarea,
[tabindex]:not([tabindex*="-"])
) {
cursor: pointer; cursor: pointer;
touch-action: manipulation; touch-action: manipulation;
} }
@ -155,17 +145,11 @@ a:not([class]) {
} }
} }
:where(:not(:active)):focus-visible { :where(:not(:active)):focus-visible {
outline-offset: 2px; outline-offset: 5px;
} }
/* Make sure users can't select button text */ /* Make sure users can't select button text */
:where( :where(button, button[type], input[type="button"], input[type="submit"], input[type="reset"]),
button,
button[type],
input[type="button"],
input[type="submit"],
input[type="reset"]
),
:where(input[type="file"])::-webkit-file-upload-button, :where(input[type="file"])::-webkit-file-upload-button,
:where(input[type="file"])::file-selector-button { :where(input[type="file"])::file-selector-button {
-webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent;
@ -175,13 +159,7 @@ a:not([class]) {
} }
/* Disabled cursor for disabled buttons */ /* Disabled cursor for disabled buttons */
:where( :where(button, button[type], input[type="button"], input[type="submit"], input[type="reset"])[disabled] {
button,
button[type],
input[type="button"],
input[type="submit"],
input[type="reset"]
)[disabled] {
cursor: not-allowed; cursor: not-allowed;
} }

View File

@ -1,6 +1,5 @@
code[class*="language-"], code[class*="language-"],
pre[class*="language-"], pre[class*="language-"] {
:not(pre) > code {
color: #abb2bf; color: #abb2bf;
background: none; background: none;
font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace; font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
@ -34,13 +33,10 @@ pre[class*="language-"] {
pre[class*="language-"] { pre[class*="language-"] {
background: #282c34; background: #282c34;
} }
:not(pre) > code[class*="language-"], :not(pre) > code[class*="language-"] {
:not(pre) > code { padding: 0.1em;
padding: 0.2em;
white-space: normal;
color: var(--color-dark);
border-radius: 0.3em; border-radius: 0.3em;
background-color: var(--color-light-grey); white-space: normal;
} }
pre[class*="language-"]::selection, pre[class*="language-"]::selection,
pre[class*="language-"] ::selection, pre[class*="language-"] ::selection,