blog/2025
1
Fork 0
Code Issues Activity

Ajuste l’espacement des sections

Browse Source
This commit is contained in:
Richard Dern
2025-09-20 01:39:07 +02:00
parent 52ac7de5bc
commit f166e112c0
1 changed files with 80 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
themes/default/assets/css/base.css
View File

@@ -4,12 +4,10 @@ body {
font-size: 1rem;
min-height: 100vh;
height: auto;
background: var(--body-bg-color) linear-gradient(
to bottom,
var(--body-bg-color2) 0%,
var(--body-bg-color3) 50%,
var(--body-bg-color) 100%
);
background: var(--body-bg-color) linear-gradient(to bottom,
var(--body-bg-color2) 0%,
var(--body-bg-color3) 50%,
var(--body-bg-color) 100%);
background-size: 100% 100%;
position: relative;
display: flex;
@@ -34,6 +32,63 @@ main {
flex-grow: 1;
}
main>section:not(#hero) {
display: flex;
flex-direction: column;
}
main>section:not(#hero)>h2 {
margin: 0 0 1rem 0;
font-size: 1.6rem;
letter-spacing: 0.02em;
}
main>section:not(#hero)>h2 a {
color: inherit;
text-decoration: none;
}
main>section:not(#hero)>h2 a:hover,
main>section:not(#hero)>h2 a:focus {
color: var(--accent-blue);
}
main>section:not(#hero)>nav[aria-label] {
margin: 0;
}
main>section:not(#hero)>nav[aria-label] ol {
display: flex;
flex-wrap: wrap;
gap: 0.35rem;
list-style: none;
padding: 0;
margin: 0;
font-size: 0.95rem;
color: var(--text-muted2);
}
main>section:not(#hero)>nav[aria-label] ol li {
display: inline-flex;
align-items: center;
gap: 0.5rem;
}
main>section:not(#hero)>nav[aria-label] ol li+li::before {
content: "/";
color: var(--text-muted2);
}
main>section:not(#hero)>nav[aria-label] a {
color: inherit;
text-decoration: none;
}
main>section:not(#hero)>nav[aria-label] a:hover,
main>section:not(#hero)>nav[aria-label] a:focus {
color: var(--accent-blue);
}
.external-link::after {
content: " ↗";
font-size: 0.85em;
@@ -42,3 +97,22 @@ main {
vertical-align: baseline;
text-decoration: none;
}
hr {
all: unset;
display: block;
width: 100%;
max-width: 30em;
height: 1rem;
margin: auto;
position: relative;
background: radial-gradient(ellipse at center -20px,
var(--accent-blue-glow),
var(--transparent) 80%);
}
.hr-mirror {
background: radial-gradient(ellipse at center calc(100% + 20px),
var(--accent-blue-glow),
var(--transparent) 80%);
}