WIP: Revamp website

This commit is contained in:
Victor Mignot 2025-01-14 16:52:36 +01:00
parent a40370d897
commit 8c28d7c2cb
Signed by: dala
SSH key fingerprint: SHA256:+3O9MhlDc2tJL0n+E+Myr7nL+74DP9AXdIXHmIqZTkY
17 changed files with 292 additions and 79 deletions

23
content/about.md Normal file
View file

@ -0,0 +1,23 @@
+++
title = 'About me'
+++
I'm **Victor Mignot** aka *dala*.
I spend most of my time trying to acquire knowledge on computer science through small projects.
All of them are licensed under free and open-source licenses and are available on [my personal Forgejo instance](https://git.dalaran.fr).
I don't consider myself as a FOSS developer, as most of my projects are just small experiments or piece of software.
I've still not engaged myself in any notable FOSS project, but I would be glad to.
I also tend to self-host various services, and maintaining a small infrastructure at home.
My goal behind this blog is to share my personal experiments and projects.
I'm not an expert in any particular domain.
As such, and even if I try to check every piece of information I share, I might utter false or approximate statements.
I'll gladly fix it if you find some.
My technical interests are:
- embedded development
- the mobile Linux ecosystem
- the NixOS ecosystem (I use [Lix](https://lix.systems/) though)
- open-hardware
- trying to repair computers and mobile devices

View file

@ -28,7 +28,6 @@ with a single command.
It would make even more sense too cross-compile my router configuration from my PC with its Ryzen 7 5800X and deploy it on the BPI-R4.
However, there are three caveats with this choice:
- The Nix store usually takes some place on storage devices, so the embedded 8 GB eMMC might not be enough.
But, since the BPI R4 has an integrated slot for a NVMe SSD and I have an empty 500 GB SSD available,
it is way more than enough.
@ -95,7 +94,9 @@ Once again, nixpkgs make it fairly easy with its embedded cross-compilation syst
For example, if we want to build any aarch64 package from any architecture (like `hello`), we can just run:
```bash
nix-build '<nixpkgs>' --arg crossSystem '(import <nixpkgs/lib>).systems.examples.aarch64-multiplatform' -A hello
nix-build '<nixpkgs>' \
--arg crossSystem '(import <nixpkgs/lib>).systems.examples.aarch64-multiplatform' \
-A hello
```
It is possible, because as any package in nixpkgs, `hello` is declared through a Nix recipe (a callPackage derivation) that

View file

@ -1,4 +1,4 @@
{ stdenv, lib, hugo, ... }:
{ stdenv, lib, hugo, dart-sass, ... }:
stdenv.mkDerivation {
name = "dalaran.fr";
@ -6,6 +6,7 @@ stdenv.mkDerivation {
nativeBuildInputs = [
hugo
dart-sass
];
buildPhase = ''

View file

@ -6,15 +6,13 @@ copyright = "CC BY-SA 4.0"
[markup]
[markup.highlight]
style = "tango"
noClasses = false
[params]
introduction = "Just experimenting computer stuff and sharing it."
mail = "dala@dalaran.fr"
forge_url = "git.dalaran.fr"
forge_url = "https://git.dalaran.fr"
fediverse_id = "@dala@dalaran.fr"
fediverse_url = "https://gts.dalaran.fr"
source_code = "https://git.dalaran.fr/dala/dalaran.fr"
[permalinks]
posts = "/:year/:month/:day/:filename"
posts = ":year/:month/:day/:filename"

View file

@ -12,5 +12,6 @@ pkgs.mkShell {
nativeBuildInputs = with pkgs; [
hugo
dart-sass
];
}

View file

@ -0,0 +1,129 @@
@use 'palette';
@use 'font';
/* Background */
.bg {
color: palette.$nord4;
background-color: #ffffff;
}
/* PreWrapper */
.chroma {
padding: 10px;
border-radius: 5px;
font-family: font.$code;
color: palette.$nord0;
background-color: palette.$nord6;
overflow: scroll;
}
/* Other */ .chroma .x { }
/* Error */ .chroma .err { color:palette.$nord11 }
/* CodeLine */ .chroma .cl { }
/* LineLink */ .chroma .lnlinks { outline:none;text-decoration:none;color:inherit }
/* LineTableTD */ .chroma .lntd { vertical-align:top;padding:0;margin:0;border:0; }
/* LineTable */ .chroma .lntable { border-spacing:0;padding:0;margin:0;border:0; }
/* LineHighlight */ .chroma .hl { background-color:#424853 }
/* LineNumbersTable */ .chroma .lnt { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#6c6f74 }
/* LineNumbers */ .chroma .ln { white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.4em;padding:0 0.4em 0 0.4em;color:#6c6f74 }
/* Line */ .chroma .line { display:flex; }
/* Keyword */ .chroma .k { color:palette.$nord9;font-weight:bold }
/* KeywordConstant */ .chroma .kc { color:palette.$nord9;font-weight:bold }
/* KeywordDeclaration */ .chroma .kd { color:palette.$nord9;font-weight:bold }
/* KeywordNamespace */ .chroma .kn { color:palette.$nord9;font-weight:bold }
/* KeywordPseudo */ .chroma .kp { color:palette.$nord9 }
/* KeywordReserved */ .chroma .kr { color:palette.$nord9;font-weight:bold }
/* KeywordType */ .chroma .kt { color:palette.$nord9 }
/* Name */ .chroma .n { }
/* NameAttribute */ .chroma .na { color:palette.$nord7 }
/* NameBuiltin */ .chroma .nb { color:palette.$nord9 }
/* NameBuiltinPseudo */ .chroma .bp { }
/* NameClass */ .chroma .nc { color:palette.$nord7 }
/* NameConstant */ .chroma .no { color:palette.$nord7 }
/* NameDecorator */ .chroma .nd { color:palette.$nord12 }
/* NameEntity */ .chroma .ni { color:palette.$nord12 }
/* NameException */ .chroma .ne { color:palette.$nord11 }
/* NameFunction */ .chroma .nf { color:palette.$nord8 }
/* NameFunctionMagic */ .chroma .fm { }
/* NameLabel */ .chroma .nl { color:palette.$nord7 }
/* NameNamespace */ .chroma .nn { color:palette.$nord7 }
/* NameOther */ .chroma .nx { }
/* NameProperty */ .chroma .py { color:palette.$nord7 }
/* NameTag */ .chroma .nt { color:palette.$nord9 }
/* NameVariable */ .chroma .nv { }
/* NameVariableClass */ .chroma .vc { }
/* NameVariableGlobal */ .chroma .vg { }
/* NameVariableInstance */ .chroma .vi { }
/* NameVariableMagic */ .chroma .vm { }
/* Literal */ .chroma .l { }
/* LiteralDate */ .chroma .ld { }
/* LiteralString */ .chroma .s { color:palette.$nord14 }
/* LiteralStringAffix */ .chroma .sa { color:palette.$nord14 }
/* LiteralStringBacktick */ .chroma .sb { color:palette.$nord14 }
/* LiteralStringChar */ .chroma .sc { color:palette.$nord14 }
/* LiteralStringDelimiter */ .chroma .dl { color:palette.$nord14 }
/* LiteralStringDoc */ .chroma .sd { color:#616e87 }
/* LiteralStringDouble */
.chroma .s2 {
color: palette.$nord14;
font-weight: bold;
}
/* LiteralStringEscape */ .chroma .se { color:palette.$nord13 }
/* LiteralStringHeredoc */ .chroma .sh { color:palette.$nord14 }
/* LiteralStringInterpol */ .chroma .si { color:palette.$nord14 }
/* LiteralStringOther */ .chroma .sx { color:palette.$nord14 }
/* LiteralStringRegex */
.chroma .sr {
color: palette.$nord12;
}
/* LiteralStringSingle */
.chroma .s1 {
color: palette.$nord14;
font-weight: bold;
}
/* LiteralStringSymbol */ .chroma .ss { color:palette.$nord14 }
/* LiteralNumber */ .chroma .m { color:palette.$nord15 }
/* LiteralNumberBin */ .chroma .mb { color:palette.$nord15 }
/* LiteralNumberFloat */ .chroma .mf { color:palette.$nord15 }
/* LiteralNumberHex */ .chroma .mh { color:palette.$nord15 }
/* LiteralNumberInteger */ .chroma .mi { color:palette.$nord15 }
/* LiteralNumberIntegerLong */ .chroma .il { color:palette.$nord15 }
/* LiteralNumberOct */ .chroma .mo { color:palette.$nord15 }
/* Operator */
.chroma .o {
color: palette.$nord9;
}
/* OperatorWord */ .chroma .ow { color:palette.$nord9;font-weight:bold }
/* Punctuation */
.chroma .p {
color: palette.$nord3;
}
/* Comment */ .chroma .c { color:#616e87;font-style:italic }
/* CommentHashbang */ .chroma .ch { color:#616e87;font-style:italic }
/* CommentMultiline */ .chroma .cm { color:#616e87;font-style:italic }
/* CommentSingle */ .chroma .c1 { color:#616e87;font-style:italic }
/* CommentSpecial */ .chroma .cs { color:#616e87;font-style:italic }
/* CommentPreproc */ .chroma .cp { color:palette.$nord10;font-style:italic }
/* CommentPreprocFile */ .chroma .cpf { color:palette.$nord10;font-style:italic }
/* Generic */ .chroma .g { }
/* GenericDeleted */ .chroma .gd { color:palette.$nord11 }
/* GenericEmph */ .chroma .ge { font-style:italic }
/* GenericError */ .chroma .gr { color:palette.$nord11 }
/* GenericHeading */ .chroma .gh { color:palette.$nord8;font-weight:bold }
/* GenericInserted */ .chroma .gi { color:palette.$nord14 }
/* GenericOutput */ .chroma .go { }
/* GenericPrompt */ .chroma .gp { color:palette.$nord3;font-weight:bold }
/* GenericStrong */ .chroma .gs { font-weight:bold }
/* GenericSubheading */ .chroma .gu { color:palette.$nord8;font-weight:bold }
/* GenericTraceback */ .chroma .gt { color:palette.$nord11 }
/* GenericUnderline */ .chroma .gl { }
/* TextWhitespace */ .chroma .w { }

View file

@ -0,0 +1,2 @@
$default: sans-serif;
$code: $default;

View file

@ -1,42 +1,105 @@
$font: "JetBrains Mono";
$nord-blue: #2e3440;
$nord-frost: #5e81ac;
@use 'palette';
@use 'font';
@use 'code';
@font-face {
font-family: $font;
font-style: normal;
src: local(''),
url(../fonts/JetBrainsMono-Medium.woff2) format('woff2');
}
$header_height: 60px;
html {
display: flex;
justify-content: center;
font-family: $font, sans-serif;
color: $nord-blue;
font-family: font.$default;
color: palette.$nord3;
background-color: palette.$nord6;
}
header {
display: flex;
flex-direction: row;
justify-content: space-between;
background-color: palette.$nord1;
padding: 5px 50px;
position: fixed;
width: calc(100vw - 75px);
height: $header_height;
align-items: center;
a {
text-decoration: none;
color: palette.$nord5;
}
.title {
margin: 0px;
}
nav {
display: flex;
justify-content: space-evenly;
font-size: 1.2em;
font-weight: bold;
width: 200px;
a {
padding: 10px;
border-radius: 5px;
}
a:hover {
background-color: palette.$nord3;
};
}
}
body {
max-width: 1000px;
display: flex;
flex-direction: column;
align-items: center;
margin: 0;
width: 100%;
}
a {
color: $nord-frost;
color: palette.$nord10;
}
main {
max-width: 1000px;
margin: $header_height 50px 10px 50px;
}
.articles-list a {
text-decoration: none;
}
footer a {
text-decoration: none;
}
footer {
display: flex;
margin-top: 50px;
flex-direction: column;
justify-content: center;
}
.article-header {
margin-bottom: 40px;
.article-head {
margin: 50px 0px;
text-align: center;
}
.article-title {
margin-bottom: 0;
.article {
margin: 5px;
}
article {
background-color: #ffffff;
padding: 40px 100px;
border-radius: 5px;
font-size: 1.1em;
h1:nth-of-type(1) {
margin-top: 0px;
}
}
.articles-list {
@ -47,6 +110,8 @@ footer {
display: flex;
margin-bottom: 20px;
align-items: baseline;
justify-content: space-between;
border-bottom: solid 2px;
}
.articles-header h2 {

View file

@ -0,0 +1,27 @@
/*
* This is the whole Nord palette as defined in https://www.nordtheme.com/docs/colors-and-palettes
*/
/* Polar Night palette */
$nord0: #2e3440;
$nord1: #3b4252;
$nord2: #434c5e;
$nord3: #4c566a;
/* Snow Storm palette */
$nord4: #d8dee9;
$nord5: #e5e9f0;
$nord6: #eceff4;
/* Frost palette */
$nord7: #8fbcbb;
$nord8: #88c0d0;
$nord9: #81a1c1;
$nord10: #5e81ac;
/* Aurora palette */
$nord11: #bf616a;
$nord12: #d08770;
$nord13: #ebcb8b;
$nord14: #a3be8c;
$nord15: #b48ead;

View file

@ -1,12 +1,13 @@
{{ partial "head.html" . }}
{{ partial "nav.html" . }}
<header class="article-header">
<h1 class="article-title">{{ .Title }}</h1>
<time datetime="{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}">
<b>{{ .Date.Format "2006-01-02" }}</b>
</time>
</header>
{{ partial "header.html" . }}
<main>
<div class="article-head">
<h1>{{ .Title }}</h1>
{{ if not .Date.IsZero }}
<time datetime="{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}">
<b>{{ .Date.Format "2006-01-02" }}</b>
</time>
{{ end }}
</div>
<article>
{{ .Content }}
</article>

View file

@ -1,12 +1,8 @@
{{ partial "header.html" . }}
{{ partial "profile.html" . }}
<main>
<section class="articles-list">
<div class="articles-header">
<h2>Posts</h2>
<small>
<a href="index.xml">[RSS]</a>
</small>
</div>
{{ range (where .Site.RegularPages "Section" "posts") }}
<div class="article">

View file

@ -1,3 +1,4 @@
{{ if eq .Section "posts" }}
<footer>
<small>
<p xmlns:cc="http://creativecommons.org/ns#">
@ -12,4 +13,5 @@
</p>
</small>
</footer>
{{ end }}
</html>

View file

@ -1,9 +1,10 @@
{{ $sass_opts := dict "transpiler" "dartsass" }}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>{{ .Title }}</title>
<link rel="alternate" type="application/rss+xml" title="RSS" href="index.xml"/>
{{ $style := resources.Get "css/main.scss" | toCSS | minify | fingerprint }}
{{ $style := resources.Get "css/main.scss" | toCSS $sass_opts | minify | fingerprint }}
<link rel="stylesheet" href="{{ $style.RelPermalink }}"/>
</head>

View file

@ -1,2 +1,5 @@
{{ partial "head.html" . }}
<h1>{{ .Site.Title }}</h1>
<header>
<a href="{{ .Site.BaseURL }}"><h1 class="title">{{ .Site.Title }}</h1></a>
{{ partial "nav.html" . }}
</header>

View file

@ -1,3 +1,4 @@
<nav>
<a href="{{ .Site.BaseURL }}"><~ Home</a>
<a href="{{ .Site.BaseURL }}/about">About</a>
<a href="{{ .Site.BaseURL }}/index.xml">RSS</a>
</nav>

View file

@ -1,38 +0,0 @@
{{ with .Site.Params }}
<aside class="profile">
{{ if .introduction }}
<div>{{ .introduction }}</div>
{{ end }}
{{ if (isset . "mail") }}
<div class="profile-entry">
<span class="profile-key">
Mail:
</span>
<span class="profile-value">
<a href="mailto:{{ .mail }}">{{ .mail }}</a>
</span>
</div>
{{ end }}
{{ if (isset . "forge_url") }}
<div class="profile-entry">
<span class="profile-key">
Forge:
</span>
<span class="profile-value">
<a href="https://{{ .forge_url }}">{{ .forge_url }}</a>
</span>
</div>
{{ end }}
{{ if and (isset . "fediverse_id") (isset . "fediverse_url") }}
<div class="profile-entry">
<span class="profile-key">
Fediverse:
</span>
<span class="profile-value">
<a rel="me" href="{{ .fediverse_url }}">{{ .fediverse_id }}</a>
</span>
</div>
{{ end }}
</aside>
{{ end }}