Style rework #35

Merged
Anri merged 70 commits from rework into main 2023-10-15 20:58:23 +02:00
3 changed files with 27 additions and 11 deletions
Showing only changes of commit bf7f85e777 - Show all commits

View file

@ -21,24 +21,24 @@
}
/* Name header */
.name {
#name {
font-size: calc(var(--font-size) * 2.5);
font-weight: var(--title-weight);
color: var(--name-color);
}
.subname {
#subname {
margin-top: 0;
font-size: calc(var(--font-size) * 1.07);
margin-bottom: 1.5em;
}
.pronouns {
#pronouns {
font-size: calc(var(--font-size) * 0.8);
color: var(--pronouns-color);
}
.avatar {
#avatar {
width: calc(var(--font-size) * 5);
border-radius: 50%;
float: right;

14
static/js/index.js Normal file
View file

@ -0,0 +1,14 @@
window.addEventListener("load", () => {
const tags = [
"Comment ça marche un PC 😵‍💫",
"Idiot certifié",
"undefined",
"/api/v1/love",
"Étudiant qui va rater son master",
"Peak D2 sur Valo",
"1312",
];
let tagElement = document.getElementById("subname");
tagElement.textContent = tags[Math.round(Math.random() * (tags.length - 1))];
});

View file

@ -10,17 +10,17 @@
{{#data}}
<div>
<span class="name">{{fullname}}</span>
<span class="pronouns">(il/lui, he/him)</span>
<span id="name">{{fullname}}</span>
<span id="pronouns">(il/lui, he/him)</span>
<img
class="avatar"
id="avatar"
src="/icons/apple-touch-icon.png"
alt="Avatar"
title="Mon avatar, dessiné un jour super rapidement sur Gimp."
loading="lazy"
/>
</div>
<p class="subname">Étudiant qui va rater son master</p>
<p id="subname"></p>
<article>
<h1>Bienvenue !</h1>
@ -40,11 +40,12 @@
target="_blank"
rel="noreferrer"
>AGPLv3</a
>. Vous pouvez voir mon <a href="/portfolio">portfolio ici</a> !
>. Vous pouvez voir mon <a href="/portfolio">portfolio ici</a>, ainsi
que mes <a href="/contrib">contributions sur GitHub ici</a>.
</p>
<p>
Il m'arrive parfois d'écrire dans
<a href="/blog">mon blog disponible ici</a>.
Il m'arrive aussi, parfois, d'écrire dans
<a href="/blog">sur mon blog</a>.
</p>
</article>
@ -71,5 +72,6 @@
{{/data}}
</main>
<script src="/js/index.js"></script>
</body>
</html>