diff --git a/style.css b/style.css index fa4e7a1..6105177 100644 --- a/style.css +++ b/style.css @@ -4,65 +4,57 @@ body { padding: 1em; } -nav { - display: flex; - font-size: xx-large; -} - -menu { - padding: 0; - margin: 0; -} - -menu li { - marker: none; - list-style: none; - /* display: none; /* TODO: go vertical / dropdown on small screens */ */ -} - -menu:hover li { - transition: display 1s ease-in-out; - display: block; -} - -menu li.active { - display: inherit; -} - header { flex-shrink: 0; + & > nav { + display: flex; + font-size: xx-large; + & a { + text-decoration: none; + &:hover { + text-decoration: underline; + } + } + & > menu { + padding: 0; + margin: 0; + /* TODO: go vertical / dropdown on small screens + & li { display: none } + & li.active { display: inherit } + &:hover li { + transition: display 1s ease-in-out; + display: block; + } + */ + } + } } main { padding-left: 1.5rem; } -nav a { - text-decoration: none; - color: inherit -} - -nav a:hover { - text-decoration: underline -} - +/* used mostly by .zs/index */ ul li { display: flex; align-items: baseline; -} -ul li span { - min-width: 5em; - text-align: right; - padding-right: 1rem; - line-height: 1.5rem; - vertical-align: baseline; -} + & span { + min-width: 5em; + text-align: right; + padding-right: 1rem; + line-height: 1.5rem; + font-size: smaller; + } -ul li a { - font-size: larger; + & a { + font-size: larger; + } } +a { color: inherit } +li { list-style: none } + :root { --red: #f21332; --orange: #f27225;