80 lines
1.7 KiB
CSS
80 lines
1.7 KiB
CSS
@import url("./blog.css");
|
|
@import url("./gallery.css");
|
|
@import url("./home.css");
|
|
@import url("./nav.css");
|
|
@import url("./variables.css");
|
|
|
|
:is(a, button):not(span *, [aria-label="Postscript"] *, body nav *),
|
|
span:has(a),
|
|
#posts a {
|
|
color: var(--citrus-dark);
|
|
transition: background-color var(--trans);
|
|
background-color: var(--citrus-primary);
|
|
&:is(:hover, :focus) {
|
|
color: var(--citrus-dark-extra);
|
|
background-color: var(--citrus-secondary);
|
|
}
|
|
& a {
|
|
color: inherit;
|
|
}
|
|
}
|
|
body {
|
|
color: var(--citrus-dark-extra);
|
|
background-color: var(--citrus-primary);
|
|
background-image: var(--paw-tiled);
|
|
background-size: 128px;
|
|
background-attachment: local;
|
|
background-repeat: repeat;
|
|
background-blend-mode: soft-light;
|
|
animation: mainbg 10s linear infinite;
|
|
}
|
|
header {
|
|
color: var(--citrus-dark);
|
|
}
|
|
ul:not([role]) li::before {
|
|
background-color: var(--citrus-dark-extra);
|
|
}
|
|
article {
|
|
background: var(--noise),
|
|
linear-gradient(
|
|
var(--citrus-light) 70%,
|
|
color-mix(in lch, var(--citrus-mix-light), var(--citrus-light)) 100%
|
|
);
|
|
border-radius: 0;
|
|
box-shadow: var(--shadow-heavy);
|
|
border: 0;
|
|
& .header-anchor {
|
|
border-radius: 0;
|
|
}
|
|
& code:not(pre *) {
|
|
border-radius: 0;
|
|
background-color: var(--citrus-dark);
|
|
color: var(--citrus-primary);
|
|
}
|
|
&:not(pre,code,a) {
|
|
font-family: "Nosey Rodent", sans-serif;
|
|
}
|
|
}
|
|
@media screen and (max-width: 920px) {
|
|
body > nav {
|
|
border: 0;
|
|
}
|
|
header {
|
|
margin: 0;
|
|
padding: 0;
|
|
border-right: 0;
|
|
border-radius: 0;
|
|
width: 100%;
|
|
}
|
|
body::after {
|
|
content: none;
|
|
}
|
|
}
|
|
@media screen and (max-width: 450px) {
|
|
#artworks & article {
|
|
&::before {
|
|
width: calc(100% + var(--pad-l) * 2) !important;
|
|
margin: -3rem 0 0 -16px;
|
|
}
|
|
}
|
|
}
|