Formatting and selection colors

This commit is contained in:
Nox Sluijtman 2024-01-04 12:42:45 +01:00
parent 88e06e6580
commit 0dfbe14502

View file

@ -1,7 +1,9 @@
@import "custom.css"; @import "custom.css";
:root{ :root{
--fg:#E60073; --fg:#E60073;
} }
::selection{ ::selection{
color: black; color: black;
background-color: var(--fg); background-color: var(--fg);
@ -12,8 +14,8 @@ body {
color: var(--fg); color: var(--fg);
font-family: monospace; font-family: monospace;
font-size: 1.2em; font-size: 1.2em;
margin:0; margin: 0;
padding:0; padding: 0;
} }
summary{cursor:pointer;} summary{cursor:pointer;}
@ -41,7 +43,7 @@ a::before{ content: '['; }
a:hover{ a:hover{
color: black; color: black;
background-color: var(--fg); background-color: var(--fg);
position:relative; position: relative;
filter: url(#chroma); filter: url(#chroma);
} }
@ -77,14 +79,16 @@ main{
} }
a.anchor{visibility: hidden; text-decoration: none;} a.anchor{visibility: hidden; text-decoration: none;}
h1:target::before,h2:target::before,h3:target::before,h4:target::before,h5:target::before,h6:target::before{content:"> "; } h1:target::before,h2:target::before,h3:target::before,h4:target::before,h5:target::before,h6:target::before{content: "> "; }
h1:hover>a,h2:hover>a,h3:hover>a,h4:hover>a,h5:hover>a,h6:hover>a{visibility:visible;} h1:hover>a,h2:hover>a,h3:hover>a,h4:hover>a,h5:hover>a,h6:hover>a{visibility: visible;}
h1:target>a,h2:target>a,h3:target>a,h4:target>a,h5:target>a,h6:target>a{color:black; visibility:visible;} h1:target>a,h2:target>a,h3:target>a,h4:target>a,h5:target>a,h6:target>a{color: black; visibility: visible;}
:target{color:black; background-color: var(--fg);} :target{color: black; background-color: var(--fg);}
:target::selection{color: var(--fg); background-color: black;}
footer{ footer{
text-align: center; text-align: center;
border-top:1pt solid; border-top: 1pt solid;
margin-top: 1em; margin-top: 1em;
} }
@ -104,14 +108,14 @@ header a{
@media(min-width: 81ch){ @media(min-width: 81ch){
header{ header{
display:flex; display: flex;
justify-content: space-around; justify-content: space-around;
} }
menu{ menu{
display:flex; display: flex;
} }
menu a{ menu a{
padding:1em; padding: 1em;
} }
} }
@media(max-width: 80ch){ @media(max-width: 80ch){