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 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();
|
||||
|
||||
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;
|
||||
|
||||
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