1

Ajouter des antipixels au footer global

Closes #11
This commit is contained in:
2026-04-05 15:07:57 +02:00
parent 67717fdb7b
commit a9125a45ea
3 changed files with 73 additions and 5 deletions

View File

@@ -76,7 +76,62 @@ body > footer > section > p a:is(:hover, :focus-visible) {
text-decoration: underline;
}
body > footer > nav > ul {
body > footer > nav > ul.footer-antipixels {
list-style: none;
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 0.35rem;
margin-top: 0;
margin-bottom: 0;
padding: 0;
justify-self: center;
}
body > footer > nav > ul.footer-antipixels > li {
display: flex;
margin-top: 0;
}
body > footer > nav > ul.footer-antipixels a.footer-antipixel {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 5.1rem;
min-height: 1.15rem;
padding: 0.1rem 0.42rem;
border: 1px solid #07090d;
background: #d8dde5;
color: #07090d;
text-decoration: none;
font-family: ui-monospace, "SFMono-Regular", "Cascadia Mono", "Liberation Mono", monospace;
font-size: 0.58rem;
font-weight: 700;
letter-spacing: 0.08em;
line-height: 1;
text-transform: uppercase;
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.32);
}
body > footer > nav > ul.footer-antipixels a.footer-antipixel.footer-antipixel-html {
background: #f4be72;
}
body > footer > nav > ul.footer-antipixels a.footer-antipixel.footer-antipixel-css {
background: #89bee8;
}
body > footer > nav > ul.footer-antipixels a.footer-antipixel.footer-antipixel-rss {
background: #f3a35f;
}
body > footer > nav > ul.footer-antipixels a.footer-antipixel:is(:hover, :focus-visible) {
background: #ffffff;
color: #07090d;
text-decoration: none;
}
body > footer > nav > ul:not(.footer-antipixels) {
list-style: none;
display: grid;
grid-template-columns: 1fr;
@@ -86,7 +141,7 @@ body > footer > nav > ul {
padding: 0;
}
body > footer > nav > ul > li {
body > footer > nav > ul:not(.footer-antipixels) > li {
display: grid;
grid-template-columns: minmax(8rem, 10rem) minmax(0, 1fr);
align-items: first baseline;
@@ -102,7 +157,7 @@ body > footer > nav h2 {
line-height: 1.25;
}
body > footer > nav > ul > li > div {
body > footer > nav > ul:not(.footer-antipixels) > li > div {
grid-column: 2;
display: flex;
flex-direction: column;