add base style and content
This commit is contained in:
15
_config.ts
15
_config.ts
@@ -1,5 +1,20 @@
|
|||||||
import lume from "lume/mod.ts";
|
import lume from "lume/mod.ts";
|
||||||
|
import nav from "lume/plugins/nav.ts";
|
||||||
|
import codeHighlight from "lume/plugins/code_highlight.ts";
|
||||||
|
import googleFonts from "lume/plugins/google_fonts.ts";
|
||||||
|
|
||||||
const site = lume();
|
const site = lume();
|
||||||
|
|
||||||
|
site.use(nav());
|
||||||
|
site.use(codeHighlight());
|
||||||
|
|
||||||
|
site.use(googleFonts({
|
||||||
|
cssFile: "/styles/main.css",
|
||||||
|
placeholder: "/* import fonts */",
|
||||||
|
// fonts: "https://fonts.google.com/share?selection.family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700",
|
||||||
|
fonts: "https://fonts.google.com/share?selection.family=JetBrains+Mono:ital,wght@0,100..800;1,100..800",
|
||||||
|
}));
|
||||||
|
|
||||||
|
site.copy("/styles");
|
||||||
|
|
||||||
export default site;
|
export default site;
|
||||||
|
|||||||
36
_includes/layouts/main.vto
Normal file
36
_includes/layouts/main.vto
Normal file
@@ -0,0 +1,36 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>{{ title }}</title>
|
||||||
|
<meta name="color-scheme" content="dark light">
|
||||||
|
<link rel="stylesheet" href="/styles/reset.css">
|
||||||
|
<link rel="stylesheet" href="/styles/main.css">
|
||||||
|
<meta name="theme-color" content="#0692aa">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header>
|
||||||
|
<nav>
|
||||||
|
<a href="/" id="site-root" class="nav-menu-item">rpqt.fr</a>
|
||||||
|
<ul class="nav-menu">
|
||||||
|
{{ for item of nav.menu().children }}
|
||||||
|
<li>
|
||||||
|
<a href="{{ item.data.url }}" class="nav-menu-item"
|
||||||
|
{{ url.startsWith(item.data.url) ? 'id="header-nav-current"' : '' }}
|
||||||
|
>{{ item.slug }}</a>
|
||||||
|
</li>
|
||||||
|
{{ /for }}
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<main>
|
||||||
|
{{ content }}
|
||||||
|
</main>
|
||||||
|
<footer>
|
||||||
|
<div>© 2025 Romain Paquet</div>
|
||||||
|
<div>Built with <a href="https://lume.land">Lume</a></div>
|
||||||
|
<div>Hosted on <a href="https://srht.site">SourceHut Pages</a></div>
|
||||||
|
</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
13
index.md
Normal file
13
index.md
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
---
|
||||||
|
layout: layouts/main.vto
|
||||||
|
title: rpqt's web corner
|
||||||
|
---
|
||||||
|
|
||||||
|
# rpqt's web corner
|
||||||
|
|
||||||
|
Hi! I'm Romain, a computer science student at [Ensimag] engineering school.
|
||||||
|
|
||||||
|
I'm interested in many aspects of IT so I try to play a little bit with
|
||||||
|
everything. I love Rust, Nix, Zig, TS and other cool tech.
|
||||||
|
|
||||||
|
[Ensimag]: https://ensimag.grenoble-inp.fr
|
||||||
12
projects.md
Normal file
12
projects.md
Normal file
@@ -0,0 +1,12 @@
|
|||||||
|
# Projects
|
||||||
|
|
||||||
|
## Lila
|
||||||
|
|
||||||
|
A simple programming language. It uses [Cranelift] as a compiler backend.
|
||||||
|
|
||||||
|
## Myrtle
|
||||||
|
|
||||||
|
A note-taking helper similar to [zk].
|
||||||
|
|
||||||
|
[Cranelift]: https://cranelift.dev
|
||||||
|
[zk]: https://zk-org.github.io/zk
|
||||||
94
styles/main.css
Normal file
94
styles/main.css
Normal file
@@ -0,0 +1,94 @@
|
|||||||
|
/* import fonts */
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--color-foreground: black;
|
||||||
|
--color-foreground-dimmed: color-mix(in srgb, var(--color-foreground), transparent 40%);
|
||||||
|
/* --color-accent: #0692aa; */
|
||||||
|
--max-width: 900px;
|
||||||
|
--font-base-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
:root {
|
||||||
|
--color-foreground: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
background: #222;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: "JetBrains Mono";
|
||||||
|
display: grid;
|
||||||
|
grid-template-rows: auto 1fr auto;
|
||||||
|
min-height: 100svh;
|
||||||
|
max-width: var(--max-width);
|
||||||
|
width: 100%;
|
||||||
|
color: var(--color-foreground);
|
||||||
|
font-size: var(--font-base-size);
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0 max(25px, 5vw);
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
padding: 1em 0;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
header>nav {
|
||||||
|
width: 100%;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: auto 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-menu {
|
||||||
|
list-style-type: none;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
gap: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-menu-item {
|
||||||
|
text-decoration: none;
|
||||||
|
color: var(--color-foreground);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-menu-item:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
#site-root {
|
||||||
|
}
|
||||||
|
|
||||||
|
#header-nav-current {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
|
margin: 0 auto;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3 {
|
||||||
|
margin: 0.5em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
h1::before { content: "#"; }
|
||||||
|
h2::before { content: "##"; }
|
||||||
|
h3::before { content: "###"; }
|
||||||
|
|
||||||
|
h1::before, h2::before, h3::before {
|
||||||
|
font-variant-ligatures: none;
|
||||||
|
margin-right: 0.3em;
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
|
||||||
|
footer {
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
padding: 1em;
|
||||||
|
font-size: smaller;
|
||||||
|
color: var(--color-foreground-dimmed);
|
||||||
|
}
|
||||||
47
styles/reset.css
Normal file
47
styles/reset.css
Normal file
@@ -0,0 +1,47 @@
|
|||||||
|
/* 1. Use a more-intuitive box-sizing model */
|
||||||
|
*, *::before, *::after {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 2. Remove default margin */
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
/* 3. Add accessible line-height */
|
||||||
|
line-height: 1.5;
|
||||||
|
/* 4. Improve text rendering */
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 5. Improve media defaults */
|
||||||
|
img, picture, video, canvas, svg {
|
||||||
|
display: block;
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 6. Inherit fonts for form controls */
|
||||||
|
input, button, textarea, select {
|
||||||
|
font: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 7. Avoid text overflows */
|
||||||
|
p, h1, h2, h3, h4, h5, h6 {
|
||||||
|
overflow-wrap: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 8. Improve line wrapping */
|
||||||
|
p {
|
||||||
|
text-wrap: pretty;
|
||||||
|
}
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
text-wrap: balance;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
9. Create a root stacking context
|
||||||
|
*/
|
||||||
|
#root, #__next {
|
||||||
|
isolation: isolate;
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user