diff --git a/.eleventy.js b/.eleventy.js
index e3a85f3..5d947b0 100644
--- a/.eleventy.js
+++ b/.eleventy.js
@@ -1,5 +1,9 @@
module.exports = function (eleventyConfig) {
- return {
+ eleventyConfig.addPassthroughCopy("./src/css");
+ eleventyConfig.addWatchTarget("./src/css");
+ eleventyConfig.addPassthroughCopy("./src/img");
+ eleventyConfig.addWatchTarget("./src/img");
+ return {
dir: {
input: "src",
output: "public",
diff --git a/src/_includes/base.njk b/src/_includes/base.njk
new file mode 100644
index 0000000..0781f18
--- /dev/null
+++ b/src/_includes/base.njk
@@ -0,0 +1,14 @@
+
+
+
+
+
+ {{ title }}
+
+
+
+
+ {{ content | safe}}
+
+
+
\ No newline at end of file
diff --git a/src/css/style.css b/src/css/style.css
new file mode 100644
index 0000000..863dae8
--- /dev/null
+++ b/src/css/style.css
@@ -0,0 +1,175 @@
+/* inspired by: */
+/* Modern reset: https://piccalil.li/blog/a-modern-css-reset/ */
+/* https://keithjgrant.com/posts/2024/01/my-css-resets/ */
+/* https://moderncss.dev/modern-css-for-dynamic-component-based-architecture/#css-reset-additions */
+
+/* Box sizing rules */
+*,
+*::before,
+*::after {
+ box-sizing: border-box;
+}
+
+/* Remove default margin */
+body,
+h1,
+h2,
+h3,
+h4,
+p,
+figure,
+blockquote,
+dl,
+dd {
+ margin: 0;
+}
+
+/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
+ul.no-list-style,
+ol.no-list-style {
+ list-style: none;
+}
+
+/* Prevent zooming when orientation changes on some iOS devices */
+html {
+ text-size-adjust: none;
+ -webkit-text-size-adjust: none;
+}
+
+/* Set core root defaults */
+html:focus-within {
+ scroll-behavior: smooth;
+}
+
+/* Make gutter area stable and present on both edges of the scrollbar */
+html {
+ scrollbar-gutter: stable;
+}
+
+/* Set core body defaults */
+body {
+ min-height: 100vh;
+ min-height: 100dvh;
+ text-rendering: optimizeSpeed;
+ line-height: 1.5;
+}
+
+/* A elements that don't have a class get default styles */
+a:not([class]) {
+ text-decoration-skip-ink: auto;
+}
+
+/* Make images easier to work with */
+img,
+picture,
+svg,
+canvas {
+ max-inline-size: 100%;
+ block-size: auto;
+ vertical-align: middle;
+ font-style: italic;
+ background-repeat: no-repeat;
+ background-size: cover;
+ shape-margin: 0.75rem;
+}
+
+/* remove default button styles */
+button {
+ all: unset;
+}
+
+/* Inherit fonts for inputs and buttons */
+button,
+input,
+textarea,
+select {
+ font: inherit;
+}
+
+/* Make sure textareas without a rows attribute are not tiny */
+textarea:not([rows]) {
+ min-height: 10em;
+}
+
+/* Adding cursor style to interactive elements */
+button,
+label,
+select,
+summary,
+[role='button'],
+[role='option'] {
+ cursor: pointer;
+}
+
+/* No typographic widows */
+* {
+ text-wrap: pretty;
+}
+h1,
+h2,
+h3,
+h4 {
+ text-wrap: pretty;
+}
+
+/* Scroll margin allowance above anchor links */
+:target {
+ scroll-margin-block-start: 2ex;
+}
+
+/* Scroll margin allowance below focused elements
+ to ensure they are clearly in view */
+:focus {
+ scroll-margin-block-end: 8vh;
+}
+
+/* Custom styles */
+:root {
+ font-family: 'Open Sans',Optima,Candara,Noto Sans,source-sans-pro,system-ui,sans-serif;
+ font-size: 120%;
+ line-height: 125%;
+
+ --background: #cdf2fd;
+ --foreground: #7c4936;
+ --shade1: #c3d5e1;
+ --shade2: #b9c3d5;
+ --shade3: #afb2c9;
+ --shade4: #a9a6bc;
+ --shade5: #a49cb0;
+ --black: #282a36;
+
+}
+
+body {
+ background: var(--background);
+ color: var(--black);
+ padding: 5vh 5vw;
+}
+
+main {
+ max-width: 30em;
+ margin: auto;
+ }
+
+ h1 {
+ font-size: 3em;
+ color: #7c4936;
+ }
+
+ h2 {
+ color: #7c4936;
+ }
+
+ p {
+ margin: 0 0 1.25em;
+ }
+
+ a {
+ color: #44f;
+ text-decoration: none;
+ font-weight: bold;
+ }
+
+ a:hover {
+ text-decoration: underline;
+ }
diff --git a/src/img/Witch-pana.png b/src/img/Witch-pana.png
new file mode 100644
index 0000000..edea07e
Binary files /dev/null and b/src/img/Witch-pana.png differ
diff --git a/src/img/Witch-pana.svg b/src/img/Witch-pana.svg
new file mode 100644
index 0000000..bd3718b
--- /dev/null
+++ b/src/img/Witch-pana.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/img/Witch-pana.svg.old.svg b/src/img/Witch-pana.svg.old.svg
new file mode 100644
index 0000000..8386db2
--- /dev/null
+++ b/src/img/Witch-pana.svg.old.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/index.md b/src/index.md
new file mode 100644
index 0000000..292847a
--- /dev/null
+++ b/src/index.md
@@ -0,0 +1,24 @@
+---
+title: DNS Witch
+layout: base.njk
+---
+# DNS Witch
+
+**DNS Witch** est un collectif de bénévoles souhaitant rendre accessibles des services liés à Internet.
+
+## La praxis
+Il existe plusieurs initiatives ayant pour but de rendre aux citoyens·citoyennes des espaces libres et gratuits sur Internet. Cependant, une bonne partie de ces services ne sont accessibles qu’à des personnes ayant déjà les connaissances techniques requises ou le temps de les acquérir.
+
+Les projets menés par le collectif sont conçus pour se positionner entre les utilisateurs·utilisatrices et les offres disponibles, afin de leur en faciliter l’accès.
+
+Opérant sur notre temps libre, nous essayons de mettre en place des solutions simples, demandant peu de maintenance.
+
+## Les services
+### DNS Witch, des noms de domaines pour toustes
+Le projet [DNS Witch](https://dns-witch.net.eu.org) offre aux personnes sans bagage technique la possibilité d’obtenir des noms de domaines gratuits.
+
+### TKT.lol, des domaines gratuits et engagés
+Nous offrons des domaines sous l’extension [TKT.lol](https://tkt.lol) contre des preuves de dons en soutien à des causes urgentes.
+
+### Grimoire, hébergement de blogs sans distraction
+Notre plateforme [Grimoire](https://grimoire.eu.org), fonctionne avec WriteFreely, une application conçue pour faciliter la concentration lors des sessions d’écriture.