preliminary work for old theme re-implementation

This commit is contained in:
sundae 2025-06-18 18:38:20 +03:00
parent ee8bce1bd3
commit 8fc7eff67b
No known key found for this signature in database
41 changed files with 456 additions and 415 deletions

View file

@ -0,0 +1,45 @@
@import url("./variables.css");
@import url("../default/variables.css");
@import url("./nav.css");
body {
background-attachment: local, fixed;
background-color: var(--citrus-primary);
background-image: var(--checker),
linear-gradient(var(--citrus-primary), var(--citrus-secondary));
background-size: 32px, contain;
}
body > nav {
background-attachment: fixed;
background-blend-mode: screen;
background-image: var(--dot),
linear-gradient(var(--citrus-primary), var(--citrus-secondary) 20%);
background-size: 6px;
& a,
button {
background-image: linear-gradient(
var(--citrus-light),
var(--citrus-primary) 20%,
var(--citrus-primary) 80%,
var(--citrus-light) 100%
);
border-radius: 0 1rem 1rem 0;
box-shadow: 0 0 0 2px var(--citrus-dark),
inset 0 0 8px 2px var(--citrus-primary);
color: var(--citrus-dark) !important;
margin: 0 0 var(--pad-sm) 0 !important;
&[aria-current] {
background-image: linear-gradient(
darkorange,
var(--citrus-dark) 10%,
chocolate
);
box-shadow: 0 0 0 2px var(--citrus-dark),
inset 0 0 4px 2px var(--citrus-dark);
color: var(--citrus-light) !important;
}
&:is(:hover, :focus):not([aria-current="page"]) {
box-shadow: 0 0 0 2px var(--citrus-dark);
}
}
}

View file

@ -0,0 +1,12 @@
nav {
padding: 0 var(--pad-xl) var(--pad-xl) 0 !important;
& ul {
margin: 0 !important;
}
& details {
border: 0 !important;
}
& a, button {
border: 0 !important;
}
}

View file

@ -0,0 +1,10 @@
:root {
--citrus-primary: rgb(255, 190, 0);
--citrus-secondary: rgb(255, 110, 0);
--citrus-light: rgb(255, 236, 180);
--citrus-dark: rgb(105, 50, 0);
--checker: url('/assets/img/theme/citrus/checker.png');
--checker-dark: url('/assets/img/theme/citrus/checker-dark.png');
--dot: url('/assets/img/theme/citrus/dot.png');
--dot-dark: url('/assets/img/theme/citrus/dot-dark.png');
}