Category fixes

This commit is contained in:
Dennis Reimann
2023-09-08 10:45:44 +02:00
parent e5da7d8fb1
commit 98ea53074b
5 changed files with 31 additions and 12 deletions

View File

@@ -30,7 +30,7 @@
--color-accent: #f7931a;
--color-accent-highlight: #dd7901;
--color-derweg: #00B4CF;
--color-interview: #151515;
--color-special: #151515;
--color-secondary: var(--color-neutral-50);
--space-xs: .125rem;

View File

@@ -4,12 +4,25 @@
flex-wrap: wrap;
list-style: none;
margin: var(--space-l) 0 var(--space-xl);
font-size: var(--font-size-s);
& li {
margin: 0 var(--space-m) var(--space-m) 0;
}
& a {
--category-accent-fg : var(--color-neutral-0);
--category-accent-bg : var(--color-accent);
&.interviews,
&.on-tour,
&.verschiedenes {
--category-accent-bg : var(--color-special);
}
&.der-weg {
--category-accent-bg : var(--color-derweg);
}
display: inline-block;
text-align: center;
padding: var(--space-s) var(--space-l);
@@ -20,16 +33,19 @@
&:hover {
@media not all and (hover: none) {
color: var(--color-neutral-0);
background-color: var(--color-secondary);
color: var(--category-accent-fg);
border-color: var(--category-accent-bg);
background-color: var(--category-accent-bg);
text-decoration: none;
}
}
&.current {
color: var(--color-neutral-0);
background-color: var(--color-secondary);
color: var(--category-accent-fg);
border-color: var(--category-accent-bg);
background-color: var(--category-accent-bg);
text-decoration: none;
font-weight: var(--font-weight-bold);
}
}
}

View File

@@ -4,12 +4,13 @@ mixin sprite(id)
mixin categories(current)
ul.categories
li: a(href="/podcast/" class=(!current && 'current')) Alles
li: a(href="/podcast/news/" class=(current === 'News' && 'current')) News
li: a(href="/podcast/interviews/" class=(current === 'Interviews' && 'current')) Interviews
li: a(href="/podcast/lesestunde/" class=(current === 'Lesestunde' && 'current')) Lesestunde
li: a(href="/podcast/der-weg/" class=(current === 'Der Weg' && 'current')) Der Weg
li: a(href="/podcast/verschiedenes/" class=(current === 'Verschiedenes' && 'current')) Verschiedenes
li: a(href="/podcast/" class=(!current && 'current')).alles Alles
li: a(href="/podcast/news/" class=(current === 'News' && 'current')).news News
li: a(href="/podcast/interviews/" class=(current === 'Interviews' && 'current')).interviews Interviews
li: a(href="/podcast/lesestunde/" class=(current === 'Lesestunde' && 'current')).lesestunde Lesestunde
li: a(href="/podcast/der-weg/" class=(current === 'Der Weg' && 'current')).der-weg Der Weg
li: a(href="/podcast/on-tour/" class=(current === 'On Tour' && 'current')).on-tour On Tour
li: a(href="/podcast/verschiedenes/" class=(current === 'Verschiedenes' && 'current')).verschiedenes Verschiedenes
mixin member(m)
li.member(id=m.name)