eryn/erynwells.me
1
0
Fork 0
Code Issues 8 Pull requests 1 Projects Releases Packages Activity Actions

Move all the root styles to fragment files

Browse source 
Create assets/styles/root to hold all the fragments of the root
stylesheet. This should make it easier to find and hack on style. Yay!
This commit is contained in:
Eryn Wells 2023-05-19 17:05:49 -07:00
parent 273c380fe6
commit 8029f97f9c
16 changed files with 692 additions and 665 deletions
Download patch file Download diff file Expand all files Collapse all files

87
assets/styles/root/050_site_header.css Normal file
View file

@ -0,0 +1,87 @@
@layer root {
header.site h1 > a:hover { text-decoration: none; }
header.site {
display: flex;
width: 100%;
z-index: 10000;
}
header.site h1 {
margin: 0;
order: 1;
}
header.site > .grid {
align-items: baseline;
display: flex;
flex-wrap: wrap;
gap: 0 0.5em;
margin: 0 auto;
max-width: var(--content-width);
padding: 1.5rem 3rem;
width: 100%;
}
header.site > .grid > nav {
align-items: center;
display: flex;
justify-content: start;
list-style: none;
}
header.site nav > li { display: block; }
header.site nav:first-of-type {
justify-content: start;
order: 2;
}
header.site nav:last-of-type {
justify-content: end;
order: 3;
}
@media (max-width: 516px) {
header.site > .platter {
border-left: none;
border-radius: 0;
border-right: none;
border-top: none;
}
header.site > .grid { max-width: none; }
}
@media (max-width: 435px) {
header.site nav:first-of-type { order: 5; }
}
nav.social > li { margin-inline-start: var(--nav-bulleted-spacing); }
nav.social > li:first-child { margin-inline-start: 0; }
.social {
display: block flex;
letter-spacing: 2px;
margin-left: auto;
order: 2;
}
.social > li > a {
background-image: var(--url);
background-repeat: no-repeat;
background-size: var(--menu-icon-size);
display: block;
height: var(--menu-icon-size);
width: var(--menu-icon-size);
}
.social > li > a > span {
display: none;
}
.social > li + li:before {
color: var(--dark);
padding: 0 0.5rem;
}
}