diff --git a/.drone.yml b/.drone.yml new file mode 100644 index 0000000..955814e --- /dev/null +++ b/.drone.yml @@ -0,0 +1,32 @@ +kind: pipeline +name: production +when: + event: [ push ] + branch: [ main ] + +clone: + git: + image: plugins/git + pull: true + +steps: + - name: build + image: node:latest + commands: + - npm i + - npx @11ty/eleventy + + - name: deploy + image: drillster/drone-rsync + settings: + hosts: + from_secret: deploy_host + target: /var/www/sonic.fanstuff.garden + source: _site/* + user: + from_secret: deploy_user + key: + from_secret: deploy_key + when: + branch: main + delete: true diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..a8fe7ae --- /dev/null +++ b/.gitignore @@ -0,0 +1,25 @@ +# Generated files +package/generated* + +# Ignore installed npm modules +node_modules/ + +# Ignore build tool output, e.g. code coverage +.nyc_output/ +coverage/ + +# Ignore API documentation +api-docs/ + +# Ignore folders from source code editors +.vscode +.idea + +# Ignore eleventy output when doing manual tests +_site/ + +package-lock.json + +# Ignore test files +.cache +test/stubs-layout-cache/_includes/*.js \ No newline at end of file diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md new file mode 100644 index 0000000..53e9126 --- /dev/null +++ b/CODE_OF_CONDUCT.md @@ -0,0 +1,85 @@ +# Contributor Covenant Code of Conduct + +## Our Pledge + +We as members, contributors, and leaders pledge to make participation in our community a harassment-free experience for everyone, regardless of age, body size, visible or invisible disability, ethnicity, sex characteristics, gender identity and expression, level of experience, education, socio-economic status, nationality, personal appearance, race, religion, or sexual identity and orientation. + +We pledge to act and interact in ways that contribute to an open, welcoming, diverse, inclusive, and healthy community. + +## Our Standards + +Examples of behavior that contributes to a positive environment for our community include: + +* Demonstrating empathy and kindness toward other people +* Being respectful of differing opinions, viewpoints, and experiences +* Giving and gracefully accepting constructive feedback +* Accepting responsibility and apologizing to those affected by our mistakes, and learning from the experience +* Focusing on what is best not just for us as individuals, but for the overall community + +Examples of unacceptable behavior include: + +* The use of sexualized language or imagery, and sexual attention or + advances of any kind +* Trolling, insulting or derogatory comments, and personal or political attacks +* Public or private harassment +* Publishing others' private information, such as a physical or email + address, without their explicit permission +* Other conduct which could reasonably be considered inappropriate in a + professional setting + +## Enforcement Responsibilities + +Community leaders are responsible for clarifying and enforcing our standards of acceptable behavior and will take appropriate and fair corrective action in response to any behavior that they deem inappropriate, threatening, offensive, or harmful. + +Community leaders have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct, and will communicate reasons for moderation decisions when appropriate. + +## Scope + +This Code of Conduct applies within all community spaces, and also applies when an individual is officially representing the community in public spaces. Examples of representing our community include using an official e-mail address, posting via an official social media account, or acting as an appointed representative at an online or offline event. + +## Enforcement + +Instances of abusive, harassing, or otherwise unacceptable behavior may be reported to the community leaders responsible for enforcement at **kazhnuz@chlore.net**. All complaints will be reviewed and investigated promptly and fairly. + +All community leaders are obligated to respect the privacy and security of the reporter of any incident. + +## Enforcement Guidelines + +Community leaders will follow these Community Impact Guidelines in determining the consequences for any action they deem in violation of this Code of Conduct: + +### 1. Correction + +**Community Impact**: Use of inappropriate language or other behavior deemed unprofessional or unwelcome in the community. + +**Consequence**: A private, written warning from community leaders, providing clarity around the nature of the violation and an explanation of why the behavior was inappropriate. A public apology may be requested. + +### 2. Warning + +**Community Impact**: A violation through a single incident or series of actions. + +**Consequence**: A warning with consequences for continued behavior. No interaction with the people involved, including unsolicited interaction with those enforcing the Code of Conduct, for a specified period of time. This includes avoiding interactions in community spaces as well as external channels like social media. Violating these terms may lead to a temporary or permanent ban. + +### 3. Temporary Ban + +**Community Impact**: A serious violation of community standards, including sustained inappropriate behavior. + +**Consequence**: A temporary ban from any sort of interaction or public communication with the community for a specified period of time. No public or private interaction with the people involved, including unsolicited interaction with those enforcing the Code of Conduct, is allowed during this period. Violating these terms may lead to a permanent ban. + +### 4. Permanent Ban + +**Community Impact**: Demonstrating a pattern of violation of community standards, including sustained inappropriate behavior, harassment of an individual, or aggression toward or disparagement of classes of individuals. + +**Consequence**: A permanent ban from any sort of public interaction within the project community. + +## Attribution + +This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 2.0, +available at https://www.contributor-covenant.org/version/2/0/code_of_conduct.html. + +Community Impact Guidelines were inspired by [Mozilla's code of conduct enforcement ladder](https://github.com/mozilla/diversity). + +[homepage]: https://www.contributor-covenant.org + +For answers to common questions about this code of conduct, see the FAQ at +https://www.contributor-covenant.org/faq. Translations are available at https://www.contributor-covenant.org/translations. + diff --git a/_data/metadata.js b/_data/metadata.js new file mode 100644 index 0000000..3c8dc0b --- /dev/null +++ b/_data/metadata.js @@ -0,0 +1,11 @@ +module.exports = { + title: "Locomotive", + url: "https://locomotive.quarante-douze.net/", + language: "fr", + description: "Un petit repertoire de site indé francophones", + author: { + name: "Kazhnuz", + email: "kazhnuz@kobold.cafe", + url: "https://kazhnuz.space/" + } +} diff --git a/_includes/layouts/base.njk b/_includes/layouts/base.njk new file mode 100644 index 0000000..bea3033 --- /dev/null +++ b/_includes/layouts/base.njk @@ -0,0 +1,15 @@ +--- +layout: layouts/parent.njk +--- +
+
+ {{ content | safe }} +
+
+ + diff --git a/_includes/layouts/home.njk b/_includes/layouts/home.njk new file mode 100644 index 0000000..b30f7c2 --- /dev/null +++ b/_includes/layouts/home.njk @@ -0,0 +1,8 @@ +--- +layout: layouts/parent.njk +--- +
+
+ {{ content | safe }} +
+
diff --git a/_includes/layouts/parent.njk b/_includes/layouts/parent.njk new file mode 100644 index 0000000..06e5b86 --- /dev/null +++ b/_includes/layouts/parent.njk @@ -0,0 +1,35 @@ + + + + + + {{ title or metadata.title }} + + + {#- Atom and JSON feeds included by default #} + + + + + {#- Uncomment this if you’d like folks to know that you used Eleventy to build your site! #} + + + {%- css %}{% include "public/css/index.css" %}{% endcss %} + + + + + + + +
+ {{ content | safe }} +
+ + + + + + diff --git a/_includes/layouts/post.njk b/_includes/layouts/post.njk new file mode 100644 index 0000000..ad83414 --- /dev/null +++ b/_includes/layouts/post.njk @@ -0,0 +1,28 @@ +--- +layout: layouts/parent.njk +--- +{# Only include the syntax highlighter CSS on blog posts #} +{%- css %}{% include "node_modules/prismjs/themes/prism-okaidia.css" %}{% endcss %} +{%- css %}{% include "public/css/prism-diff.css" %}{%- endcss %} +

{{ title }}

+ + + +{{ content | safe }} + +{%- if collections.posts %} +{%- set previousPost = collections.posts | getPreviousCollectionItem %} +{%- set nextPost = collections.posts | getNextCollectionItem %} +{%- if nextPost or previousPost %} + +{%- endif %} +{%- endif %} diff --git a/_includes/postslist.njk b/_includes/postslist.njk new file mode 100644 index 0000000..99272c5 --- /dev/null +++ b/_includes/postslist.njk @@ -0,0 +1,9 @@ +{%- css %}.postlist { counter-reset: start-from {{ (postslistCounter or postslist.length) + 1 }} }{% endcss %} +
    +{% for post in postslist | reverse %} +
  1. + {% if post.data.title %}{{ post.data.title }}{% else %}{{ post.url }}{% endif %} + +
    2. +{% endfor %} +
diff --git a/_includes/websites.md b/_includes/websites.md new file mode 100644 index 0000000..262fec8 --- /dev/null +++ b/_includes/websites.md @@ -0,0 +1,4 @@ +- Réseau + - [Press Garden](https://press.fanstuff.garden) + - Breeze Media (fedi) + - Breeze Media (bsky) \ No newline at end of file diff --git a/content/404.md b/content/404.md new file mode 100644 index 0000000..88908c1 --- /dev/null +++ b/content/404.md @@ -0,0 +1,19 @@ +--- +layout: layouts/base.njk +permalink: 404.html +eleventyExcludeFromCollections: true +--- +# Contenu non trouvé. + +Retournez sur la page d'accueil et tentez une autre page. + + diff --git a/content/about.md b/content/about.md new file mode 100644 index 0000000..3561b5d --- /dev/null +++ b/content/about.md @@ -0,0 +1,28 @@ +--- +layout: layouts/base.njk +eleventyNavigation: + parent: Accueil + key: À propos + order: 0 +--- + +# À propos + +Locomotive est un site de présentation de site web et créateurs web indépendants (créateurs au sens large) francophone, visant à permettre de découvrir des sujets ou des projets intéressants. + +## Règles d'inclusion + +Les règles d'inclusion sont les suivantes : + +- Le site web inclus doit être un site indépendant, et ne pas appartenir à une corporation et/où être une page facebook/twitter/etc. +- Le site web ne doit pas contenir trop de publicités +- Le site web ne doit pas faire la promotion d'idéologie d'extrème droite. +- Le site web ne doit pas contenir de contenus générés par "IA", ni contenir de contenus volé de manière générale +- Le site web doit être francophone (ou avoir du moins une version francophone). + +## Possibilités futures + +Je réfléchis à plusieurs moyens d'étendre la liste, qui peuvent potentiellement avoir des aventages et des inconvéniants. + +- **Rajouter des vidéastes youtube traitant de sujet de manière qualitative**. Le soucis de cette idée est qu'elle ferait à coup sûr la promotion de Youtube d'une manière, et ce site vise à présenter avant tout les sites indépendants. Une possibilité serait de mettre comme règle que le/la vidéaste doit être hébergée au moins de manière informale sur un autre site, mais cela limiterais certaines créatifs indépendants de qualités. Une autre possibilité serait de faire la promotion de l'utilisation d'un frontend alternatif, ou de prévenir quand on a un lien youtube. +- **Rajouter des comptes fedivers intéressants**. Cela diminuerait la démarche "site web" de ce site, mais pourrait permettre aussi aux gens de découvrir les choses cool qui se font sur le fedivers. \ No newline at end of file diff --git a/content/contribuer.md b/content/contribuer.md new file mode 100644 index 0000000..17be468 --- /dev/null +++ b/content/contribuer.md @@ -0,0 +1,40 @@ +--- +layout: layouts/base.njk +eleventyNavigation: + key: Contribuer à Locomotive + order: 10 +--- + +# Contribuer à Locomotive + +Locomotive est un projet open-source, dont le code source est disponible [ici](https://git.kobold.cafe/) et qui est hébergé par Quarante-Douze. Toutes les contributions sont les bienvenues, tant qu'elles participent à aider à construire un annuaire de site web sain et anti-oppression. + +Il y a plusieurs manière de contribuer à la liste et de nous aider à la rendre le mieux possible ! + +## Ajouter des sites + +Ce site étant un site statique dans un dépot git, il est possible d'ajouter des sites via une Merge Request. Pour cela, vous pouvez cloner le répertoire avec git, ajouter les sites dans les catégories où ils doivent aller, et c'est tout bon ! La merge request sera review pour vérifier que [tout les sites conviennent](/about/), et sera merge si c'est bon. + +A noter que le projet suis le [contributor-covenant](https://www.contributor-covenant.org/) comme code de conduite et que les attaques envers les contributeurs déjà en situation d'oppression seront punies. + +## Je ne sais pas utiliser git :( + +Ce n'est pas grave ! Dans ce cas, il vous suffit de participer en faisant des tickets avec les sites ou créateurs de contenus qui mériteraient selon-vous d'être ajouté à la liste ! + +Cependant, afin de rendre la vie plus facile aux contributeurs du projet, il serait cool que vous mettiez déjà en forme votre liste de la manière suivante dans votre message : + +
+
+```markdown
+- [NOM_DU_SITE](https://url-du-site-dans-le-navigateur.net) - Description brève du site
+- [NOM_DU_SITE](https://url-du-site-dans-le-navigateur.net) - Description brève du site
+- [NOM_DU_SITE](https://url-du-site-dans-le-navigateur.net) - Description brève du site
+```
+
+
+ +Cela permettra de juste avoir à copier-coller les sites et les ajouter dans la merge request qu'on fera, ce qui nous permettra de plus vite les ajouter :) C'est un petit peu de temps gagné pour nous, mais cela ferait très plaisir ! + +## Et sans compte ? + +Dans ce cas, vous pouvez aussi nous contacter via les réseaux sociaux, ou par mail. \ No newline at end of file diff --git a/content/districts/arcadia.md b/content/districts/arcadia.md new file mode 100644 index 0000000..d94b43f --- /dev/null +++ b/content/districts/arcadia.md @@ -0,0 +1,22 @@ +--- +layout: layouts/base.njk +eleventyNavigation: + parent: Les districts + key: Arcadia + order: 1 + description: Jeux vidéos, jeux en ligne et jeux de sociétés. +--- + +# Arcadia + +Arcadia est le district des jeux vidéos et de tout ce qui est jeux en général. Cela peut être aussi bien pour *parler* de jeux vidéo que pour jouer à des jeux. + +## Sites de jeux-vidéo + +## Fansite de jeux + +- [Planète-Sonic](https://planete-sonic.com) - Le fansite de référence francophone sur la série Sonic. + +## Jeux en lignes + +- [Woltar](https://woltar.net) - Revival d'un jeu en ligne francophone de simulation de vie. Adoptez un woltarien et gérez sa vie et socialisez avec d'autres woltariens. \ No newline at end of file diff --git a/content/districts/index.md b/content/districts/index.md new file mode 100644 index 0000000..7be3631 --- /dev/null +++ b/content/districts/index.md @@ -0,0 +1,22 @@ +--- +layout: layouts/base.njk +eleventyNavigation: + key: Les districts + order: 1 +--- + +# Les districts + +Les districts sont le coeur de Locomotive (et avant de Goecities/Neocities districts). Il s'agit des grands types de sujets dans lesquels sont regroupés les sites. + +Les noms sont inspirés (mais ne seront pas forcément repris tel quel) de [la liste des districts](http://www.geocities.ws/NapaValley/2022/cities.html) de Neocities. + +## Liste des districts + + \ No newline at end of file diff --git a/content/index.md b/content/index.md new file mode 100644 index 0000000..ce7c60e --- /dev/null +++ b/content/index.md @@ -0,0 +1,31 @@ +--- +layout: layouts/home.njk +eleventyNavigation: + key: Accueil + order: 0 +--- + +
+

+ {{ metadata.title }} +

+
+ +## Bienvenue sur {{ metadata.title }} ! + +Ce site est un petit répertoire de site web indépendant francophone, conçu dans une optique [IndieWeb](https://indieweb.org/). L'objectif de ce site est de permettre à des gens de potentiellement découvrir des sites qui peuvent les intéresser hors des grosses plateformes d'hébergement de site (les gros réseaux sociaux, fandom, etc). + +Il est dédié à la francophonie, puisque de nombreuses ressources du genre existe pour les anglophone, et que je me suis dit que ce serait bien aussi de permettre de découvrir ce genre de chose pour les personnes ne parlant pas anglais. + +Ce site fait partie de [Quarante-Douze](https://quarante-douze.net/) + +## Inspiration + +Le site est inspiré des défunts géocities et néocities [district](http://www.geocities.ws/NapaValley/2022/cities.html), qui étaient des répertoires de site hébergé sur ces plateformes, triés par thématiques. Le tri et les noms des catégories seront inspiré du concept de District, vous pouvez voir ce site comme le petit train qui va vous amener dans différentes gares :) + +Le site est aussi inspiré des [Awesome List](https://awesomelists.top/#/) ou [Delightful](https://delightful.club/) dans sa présentation. + +## Crédits + +- L'image de fond est [Steam locomotive running gear](https://commons.wikimedia.org/wiki/File:Steam_locomotive_running_gear.jpg) par Petar Milošević +- Site généré via [Eleventy](https://www.11ty.dev/) \ No newline at end of file diff --git a/content/plateformes.md b/content/plateformes.md new file mode 100644 index 0000000..83b1453 --- /dev/null +++ b/content/plateformes.md @@ -0,0 +1,33 @@ +--- +layout: layouts/base.njk +eleventyNavigation: + key: Services du web indé + order: 9 +--- + +# Plateformes indépendants + +Cette liste de site est séparée des autres, parce que le but est de présenter les "plateformes" et services du web indépendants. Tout ce qui est hébergements, moteurs de recherches, etc. à pour but d'être ici. Le but de ce site est de montrer qu'il existe des alternatives au web corporate même en terme de services. + +Cette liste, contrairement aux autres, **contient des sites anglphones** puisqu'elle traite de services notamment d'hébergement, et où vous pourrez trouver de nombreux sites. + +## Portails et recherche + +- [Ytoo!](https://ytoo.org/) - Revival du portail Yahoo +- [Marginalia](https://search.marginalia.nu/) - Moteur de recherche de site indépendant + +## Hébergement + +- [Neocities](https://neocities.org/) - Hébergeur de site statique à la Neocities +- [Nekoweb](https://nekoweb.org/) - Autre hébergeur de site statiques +- [Wiki.GG](https://www.wiki.gg/) - Hébergeur de Wiki (alternative à Wikia/Fandom) +- [Miraheze](https://miraheze.org/) - Autre hébergeur de Wiki + +## Réseaux sociaux + +- [imood](https://imood.com) - Réseau social servant à indiquer son humeur du moment +- [Status.cafe](https://status.cafe) - Réseau sociaux minimaliste +- [Piclog](https://piclog.blue/) - Réseau social de partage d'images fortement compressées +- [Sheezy.art](https://sheezy.art/) - Plateforme de partage d'art à la manière de deviantART (avant Eclipse et le spam IA) +- [Owler](https://owler.cloud/), [Blips](https://blips.club/) et [Pliko](https://pliko.net/) - Revival du Twitter à l'ancienne +- [Fedivers]() - Réseau de réseaux sociaux fédérés \ No newline at end of file diff --git a/content/sitemap/sitemap.xml.njk b/content/sitemap/sitemap.xml.njk new file mode 100644 index 0000000..4da684a --- /dev/null +++ b/content/sitemap/sitemap.xml.njk @@ -0,0 +1,14 @@ +--- +permalink: /sitemap.xml +eleventyExcludeFromCollections: true +--- + + +{%- for page in collections.all %} + {% set absoluteUrl %}{{ page.url | htmlBaseUrl(metadata.url) }}{% endset %} + + {{ absoluteUrl }} + {{ page.date | htmlDateString }} + +{%- endfor %} + diff --git a/eleventy.config.drafts.js b/eleventy.config.drafts.js new file mode 100644 index 0000000..8eb92dc --- /dev/null +++ b/eleventy.config.drafts.js @@ -0,0 +1,50 @@ +function eleventyComputedPermalink() { + // When using `addGlobalData` and you *want* to return a function, you must nest functions like this. + // `addGlobalData` acts like a global data file and runs the top level function it receives. + return (data) => { + // Always skip during non-watch/serve builds + if(data.draft && !process.env.BUILD_DRAFTS) { + return false; + } + + return data.permalink; + } +}; + +function eleventyComputedExcludeFromCollections() { + // When using `addGlobalData` and you *want* to return a function, you must nest functions like this. + // `addGlobalData` acts like a global data file and runs the top level function it receives. + return (data) => { + // Always exclude from non-watch/serve builds + if(data.draft && !process.env.BUILD_DRAFTS) { + return true; + } + + return data.eleventyExcludeFromCollections; + } +}; + +module.exports.eleventyComputedPermalink = eleventyComputedPermalink; +module.exports.eleventyComputedExcludeFromCollections = eleventyComputedExcludeFromCollections; + +module.exports = eleventyConfig => { + eleventyConfig.addGlobalData("eleventyComputed.permalink", eleventyComputedPermalink); + eleventyConfig.addGlobalData("eleventyComputed.eleventyExcludeFromCollections", eleventyComputedExcludeFromCollections); + + let logged = false; + eleventyConfig.on("eleventy.before", ({runMode}) => { + let text = "Excluding"; + // Only show drafts in serve/watch modes + if(runMode === "serve" || runMode === "watch") { + process.env.BUILD_DRAFTS = true; + text = "Including"; + } + + // Only log once. + if(!logged) { + console.log( `[11ty/eleventy-base-blog] ${text} drafts.` ); + } + + logged = true; + }); +} diff --git a/eleventy.config.images.js b/eleventy.config.images.js new file mode 100644 index 0000000..32a0269 --- /dev/null +++ b/eleventy.config.images.js @@ -0,0 +1,34 @@ +const path = require("path"); +const eleventyImage = require("@11ty/eleventy-img"); + +module.exports = eleventyConfig => { + function relativeToInputPath(inputPath, relativeFilePath) { + let split = inputPath.split("/"); + split.pop(); + + return path.resolve(split.join(path.sep), relativeFilePath); + } + + // Eleventy Image shortcode + // https://www.11ty.dev/docs/plugins/image/ + eleventyConfig.addAsyncShortcode("image", async function imageShortcode(src, alt, widths, sizes) { + // Full list of formats here: https://www.11ty.dev/docs/plugins/image/#output-formats + // Warning: Avif can be resource-intensive so take care! + let formats = ["avif", "webp", "auto"]; + let file = relativeToInputPath(this.page.inputPath, src); + let metadata = await eleventyImage(file, { + widths: widths || ["auto"], + formats, + outputDir: path.join(eleventyConfig.dir.output, "img"), // Advanced usage note: `eleventyConfig.dir` works here because we’re using addPlugin. + }); + + // TODO loading=eager and fetchpriority=high + let imageAttributes = { + alt, + sizes, + loading: "lazy", + decoding: "async", + }; + return eleventyImage.generateHTML(metadata, imageAttributes); + }); +}; diff --git a/eleventy.config.js b/eleventy.config.js new file mode 100644 index 0000000..9fc4ccd --- /dev/null +++ b/eleventy.config.js @@ -0,0 +1,146 @@ +const { DateTime } = require("luxon"); +const markdownItAnchor = require("markdown-it-anchor"); + +const pluginRss = require("@11ty/eleventy-plugin-rss"); +const pluginSyntaxHighlight = require("@11ty/eleventy-plugin-syntaxhighlight"); +const pluginBundle = require("@11ty/eleventy-plugin-bundle"); +const pluginNavigation = require("@11ty/eleventy-navigation"); +const { EleventyRenderPlugin } = require("@11ty/eleventy"); +const { EleventyHtmlBasePlugin } = require("@11ty/eleventy"); + +const pluginDrafts = require("./eleventy.config.drafts.js"); +const pluginImages = require("./eleventy.config.images.js"); +const pluginTOC = require('eleventy-plugin-toc'); + +module.exports = function(eleventyConfig) { + // Copy the contents of the `public` folder to the output folder + // For example, `./public/css/` ends up in `_site/css/` + eleventyConfig.addPassthroughCopy({ + "./public/": "/", + "./node_modules/prismjs/themes/prism-okaidia.css": "/css/prism-okaidia.css" + }); + + // Run Eleventy when these files change: + // https://www.11ty.dev/docs/watch-serve/#add-your-own-watch-targets + + // Watch content images for the image pipeline. + eleventyConfig.addWatchTarget("content/**/*.{svg,webp,png,jpeg}"); + + // App plugins + eleventyConfig.addPlugin(pluginDrafts); + eleventyConfig.addPlugin(pluginImages); + + // Official plugins + eleventyConfig.addPlugin(pluginRss); + eleventyConfig.addPlugin(pluginSyntaxHighlight, { + preAttributes: { tabindex: 0 } + }); + eleventyConfig.addPlugin(pluginNavigation); + eleventyConfig.addPlugin(EleventyHtmlBasePlugin); + eleventyConfig.addPlugin(EleventyRenderPlugin); + eleventyConfig.addPlugin(pluginBundle); + eleventyConfig.addPlugin(pluginTOC, { + tags: ['h2'], + wrapper: 'div' + }); + + // Filters + eleventyConfig.addFilter("readableDate", (dateObj, format, zone) => { + // Formatting tokens for Luxon: https://moment.github.io/luxon/#/formatting?id=table-of-tokens + return DateTime.fromJSDate(dateObj, { zone: zone || "utc" }).toFormat(format || "dd LLLL yyyy"); + }); + + eleventyConfig.addFilter('htmlDateString', (dateObj) => { + // dateObj input: https://html.spec.whatwg.org/multipage/common-microsyntaxes.html#valid-date-string + return DateTime.fromJSDate(dateObj, {zone: 'utc'}).toFormat('yyyy-LL-dd'); + }); + + // Get the first `n` elements of a collection. + eleventyConfig.addFilter("head", (array, n) => { + if(!Array.isArray(array) || array.length === 0) { + return []; + } + if( n < 0 ) { + return array.slice(n); + } + + return array.slice(0, n); + }); + + // Return the smallest number argument + eleventyConfig.addFilter("min", (...numbers) => { + return Math.min.apply(null, numbers); + }); + + // Return all the tags used in a collection + eleventyConfig.addFilter("getAllTags", collection => { + let tagSet = new Set(); + for(let item of collection) { + (item.data.tags || []).forEach(tag => tagSet.add(tag)); + } + return Array.from(tagSet); + }); + + eleventyConfig.addFilter("filterTagList", function filterTagList(tags) { + return (tags || []).filter(tag => ["all", "nav", "post", "posts"].indexOf(tag) === -1); + }); + + // Customize Markdown library settings: + eleventyConfig.amendLibrary("md", mdLib => { + mdLib.use(markdownItAnchor, { + permalink: markdownItAnchor.permalink.ariaHidden({ + placement: "after", + class: "header-anchor", + symbol: "#", + ariaHidden: false, + }), + level: [1,2,3,4], + slugify: eleventyConfig.getFilter("slugify") + }); + }); + + // Features to make your build faster (when you need them) + + // If your passthrough copy gets heavy and cumbersome, add this line + // to emulate the file copy on the dev server. Learn more: + // https://www.11ty.dev/docs/copy/#emulate-passthrough-copy-during-serve + + // eleventyConfig.setServerPassthroughCopyBehavior("passthrough"); + + return { + // Control which files Eleventy will process + // e.g.: *.md, *.njk, *.html, *.liquid + templateFormats: [ + "md", + "njk", + "html", + "liquid", + ], + + // Pre-process *.md files with: (default: `liquid`) + markdownTemplateEngine: "njk", + + // Pre-process *.html files with: (default: `liquid`) + htmlTemplateEngine: "njk", + + // These are all optional: + dir: { + input: "content", // default: "." + includes: "../_includes", // default: "_includes" + data: "../_data", // default: "_data" + output: "_site" + }, + + // ----------------------------------------------------------------- + // Optional items: + // ----------------------------------------------------------------- + + // If your site deploys to a subdirectory, change `pathPrefix`. + // Read more: https://www.11ty.dev/docs/config/#deploy-to-a-subdirectory-with-a-path-prefix + + // When paired with the HTML plugin https://www.11ty.dev/docs/plugins/html-base/ + // it will transform any absolute URLs in your HTML to include this + // folder name and does **not** affect where things go in the output folder. + pathPrefix: "/", + }; +}; diff --git a/package.json b/package.json new file mode 100644 index 0000000..76c6525 --- /dev/null +++ b/package.json @@ -0,0 +1,47 @@ +{ + "name": "eleventy-base-blog", + "version": "8.0.0", + "description": "A starter repository for a blog web site using the Eleventy site generator.", + "scripts": { + "build": "npx @11ty/eleventy", + "build-ghpages": "npx @11ty/eleventy --pathprefix=/eleventy-base-blog/", + "start": "npx @11ty/eleventy --serve --quiet", + "debug": "DEBUG=Eleventy* npx @11ty/eleventy", + "debugstart": "DEBUG=Eleventy* npx @11ty/eleventy --serve --quiet", + "benchmark": "DEBUG=Eleventy:Benchmark* npx @11ty/eleventy" + }, + "repository": { + "type": "git", + "url": "git://github.com/11ty/eleventy-base-blog.git" + }, + "author": { + "name": "Zach Leatherman", + "email": "zachleatherman@gmail.com", + "url": "https://zachleat.com/" + }, + "license": "MIT", + "engines": { + "node": ">=14" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/11ty" + }, + "bugs": { + "url": "https://github.com/11ty/eleventy-base-blog/issues" + }, + "homepage": "https://github.com/11ty/eleventy-base-blog#readme", + "devDependencies": { + "@11ty/eleventy": "^2.0.1", + "@11ty/eleventy-img": "^3.1.0", + "@11ty/eleventy-navigation": "^0.3.5", + "@11ty/eleventy-plugin-bundle": "^1.0.4", + "@11ty/eleventy-plugin-rss": "^1.2.0", + "@11ty/eleventy-plugin-syntaxhighlight": "^5.0.0", + "luxon": "^3.3.0", + "markdown-it-anchor": "^8.6.7" + }, + "dependencies": { + "eleventy-plugin-toc": "^1.1.5" + } +} diff --git a/public/css/index.css b/public/css/index.css new file mode 100644 index 0000000..8abc146 --- /dev/null +++ b/public/css/index.css @@ -0,0 +1,331 @@ +@font-face { + font-family: 'Teko'; + src: url('/fonts/teko-light-webfont.woff'); + font-weight: 300; +} + +@font-face { + font-family: 'Teko'; + src: url('/fonts/teko-regular-webfont.woff'); + font-weight: 400; +} + +@font-face { + font-family: 'Teko'; + src: url('/fonts/teko-medium-webfont.woff'); + font-weight: 500; +} + +@font-face { + font-family: 'Teko'; + src: url('/fonts/teko-semibold-webfont.woff'); + font-weight: 600; +} + +@font-face { + font-family: 'Teko'; + src: url('/fonts/teko-bold-webfont.woff2') format('woff2'), url('../fonts/teko-bold-webfont.woff') format('woff'); + font-weight: 700; + font-display: swap; +} + +:root { + --color-gray-20: #e0e0e0; + --color-gray-50: #C0C0C0; + --color-gray-90: #2f2f2f; + + /* --text-color is assigned to --color-gray-_ above */ + --text-color-link: #c92a2a; + --text-color-link-active: #c92a2a; + --text-color-link-visited: #c92a2a; + + --background-color: #fafafa; + --background-menu: #495057; + + --text-color: var(--color-gray-90); + + --font-family: Inter, + -apple-system, + BlinkMacSystemFont, + 'Segoe UI', + Cantarell, + Roboto, + Oxygen, + Ubuntu, + 'Fira Sans', + 'Droid Sans', + 'Helvetica Neue', + sans-serif; + --font-family-monospace: Consolas, Menlo, Monaco, Andale Mono WT, Andale Mono, Lucida Console, Lucida Sans Typewriter, DejaVu Sans Mono, Bitstream Vera Sans Mono, Liberation Mono, Nimbus Mono L, Courier New, Courier, monospace; + --font-family-logo: Teko, + sans-serif; + --font-family-title:Teko, + sans-serif; +} + +* { + box-sizing: border-box; +} + +html, +body { + margin: 0 auto; + min-height:100%; + font-family: var(--font-family); + color: var(--text-color); +} + +body { + padding: 24px; +} + +.wrapper { + width: 800px; + margin: auto; + position: relative; +} + +html { + overflow-y: scroll; + background-color: var(--background-color); +} + +/* https://www.a11yproject.com/posts/how-to-hide-content/ */ +.visually-hidden { + clip: rect(0 0 0 0); + clip-path: inset(50%); + height: 1px; + overflow: hidden; + position: absolute; + white-space: nowrap; + width: 1px; +} + +a[href] { + color: var(--text-color-link); + text-decoration: underline dashed 1px; + border-radius: 0.1rem; + text-decoration: underline dashed 1px; + text-underline-offset: 0.1rem; +} +a[href]:visited { + color: var(--text-color-link-visited); +} +a[href]:hover, +a[href]:active { + color: var(--text-color-link-active); + background-color: rgba(0,0,0,0.1); + text-decoration: none; +} + +blockquote { + opacity: 75%; + border-left: 3px solid currentColor; + padding-left: 12px; +} + +/* Direct Links / Markdown Headers */ +.header-anchor { + text-decoration: none; + font-style: normal; + font-size: 1em; + margin-left: .1em; +} +a[href].header-anchor, +a[href].header-anchor:visited { + color: transparent; +} +a[href].header-anchor:focus, +a[href].header-anchor:hover { + text-decoration: underline; +} +a[href].header-anchor:focus, +:hover > a[href].header-anchor { + color: #aaa; +} + +header { + background:center center url("/img/back.jpg"); + background-repeat: no-repeat; + background-size: cover; + border-radius:3px; + height:240px; + box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.8); + display:flex; + align-items: center; + justify-content: center; +} + +h1 { + color: #e03131; + font-family: var(--font-family-title); + font-size: 3rem; +} + +header h1 { + text-align: center; +} + +header h1 a[href] { + font-size:5.5rem; + text-shadow: 0px 2px 3px rgba(0,0,0,0.3); + font-weight: 900; + color:white!important; + text-decoration: none; + text-transform: uppercase; + display: block; + line-height: 1; + margin: 0; + padding: 0; +} + +.quadrillage { + display:grid; + grid-template-columns : 1fr 1fr; + column-gap: 1rem; +} + +#sidebar { + position: fixed; + top: 0; + left: 0; + border-right: 1px solid black; + background-color: var(--background-menu); + padding:12px; + height:100%; + box-shadow: 1px 0px 1px 0px rgba(0,0,0,0.4); +} + +#sidebar > ul > li { + margin:0; + padding:3px; +} + +main { + background-color: var(--background-color); + line-height:1.5rem; + width: 800px; + margin: auto; +} + +main img { + display: block; + max-width: 100%; + height: auto; + margin: auto; +} + +.card, +#sidebar ul>li, +#links ul>li { + background-color: var(--background-menu); +} + +#sidebar ul > li, +#links ul > li { + list-style: none; + font-weight: bold; +} + + +#more-info ol > li, +#more-info ul > li { + list-style: none; +} + +#sidebar ul > li li, +#links ul>li li, +#more-info li { + border-radius:0px; + padding:0px; + margin:0px; + font-weight: normal; + border:0; + box-shadow: none; +} + +ul.nav, +#sidebar ul li ul, +#links ul li ul, +#more-info ol { + padding:0; + margin:0; + list-style: none; +} + +#sidebar ul li a, +#more-info ol li a { + display:block; + width:100%; + text-decoration:dashed; + color: white; + border-radius:3px; + padding:6px; +} + +#more-info ol li a { + color: var(--text-color); +} + +#links ul li > p { + padding: 3px; + margin:0; +} + +#more-info h2 { + padding: 3px; + margin: 0; + font-size: 1rem; +} + +#sidebar ul li li a, +#links ul li li a, +#more-info ol li a { + padding-left:18px; +} + +#sidebar ul li a.active, +#sidebar ul li a:hover { + background-color: rgba(255, 255, 255, 0.3); +} + + +#more-info ol li a:hover, +#more-info ol li a.active { + background-color:rgba(0,0,0,0.1); +} + +aside { + position: absolute; + top: 1px; + right: -264px; + height: 100%; +} + +#more-info { + position: sticky; + top:12px; + border-left: 3px solid #e03131; + padding: 6px; +} + +#sidebar { + min-width:280px; + width:280px; +} + +#more-info { + min-width: 240px; + width: 240px; +} + +footer { + text-align:right; + margin: auto; + width: 800px; +} + +iframe { + border: none; +} + diff --git a/public/favicon.svg b/public/favicon.svg new file mode 100644 index 0000000..9616a8e --- /dev/null +++ b/public/favicon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/fonts/teko-bold-webfont.woff b/public/fonts/teko-bold-webfont.woff new file mode 100755 index 0000000..592f7cd Binary files /dev/null and b/public/fonts/teko-bold-webfont.woff differ diff --git a/public/fonts/teko-bold-webfont.woff2 b/public/fonts/teko-bold-webfont.woff2 new file mode 100755 index 0000000..3f05c6c Binary files /dev/null and b/public/fonts/teko-bold-webfont.woff2 differ diff --git a/public/fonts/teko-light-webfont.woff b/public/fonts/teko-light-webfont.woff new file mode 100755 index 0000000..3c7030c Binary files /dev/null and b/public/fonts/teko-light-webfont.woff differ diff --git a/public/fonts/teko-medium-webfont.woff b/public/fonts/teko-medium-webfont.woff new file mode 100755 index 0000000..2aa760d Binary files /dev/null and b/public/fonts/teko-medium-webfont.woff differ diff --git a/public/fonts/teko-regular-webfont.woff b/public/fonts/teko-regular-webfont.woff new file mode 100755 index 0000000..91a438d Binary files /dev/null and b/public/fonts/teko-regular-webfont.woff differ diff --git a/public/fonts/teko-semibold-webfont.woff b/public/fonts/teko-semibold-webfont.woff new file mode 100755 index 0000000..b87c0c6 Binary files /dev/null and b/public/fonts/teko-semibold-webfont.woff differ diff --git a/public/img/.gitkeep b/public/img/.gitkeep new file mode 100644 index 0000000..e69de29 diff --git a/public/img/back.jpg b/public/img/back.jpg new file mode 100644 index 0000000..ff14ebc Binary files /dev/null and b/public/img/back.jpg differ diff --git a/public/img/cc-by-sa.png b/public/img/cc-by-sa.png new file mode 100644 index 0000000..12229ac Binary files /dev/null and b/public/img/cc-by-sa.png differ diff --git a/public/img/qdouze.gif b/public/img/qdouze.gif new file mode 100644 index 0000000..3e0e518 Binary files /dev/null and b/public/img/qdouze.gif differ