r/lumbung.space
0
0
Fork 0
forked from ruangrupa/lumbung.space
Code Issues Pull Requests Projects Releases Wiki Activity

recolor lumbung kios and lumbung gallery cards

Browse Source
This commit is contained in:
Aadil Ayub 2022-05-25 17:20:53 +05:00
parent c51d8647c7
commit e71e5d18ca
2 changed files with 51 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
themes/lumbung-theme/layouts/_default/baseof.html
View File

@ -30,8 +30,9 @@
}
// remove box around "previous" page nav link (couldn't handle this with CSS nth-child)
if (document.querySelector('[aria-label="Previous"]')) {
document.querySelector('[aria-label="Previous"]').parentElement.classList.add('previous-page-link')
}
// for toggling submenus in mobile navigation drawer
let submenuLinks = document.querySelectorAll('.drawer .has-submenu');
[...submenuLinks].forEach(submenuLink => {
@ -39,6 +40,16 @@
submenuLink.querySelector('.submenu').classList.toggle('opened')
})
})
// add classes for styling lumbung kios and lumbung gallery cards
let cards = document.querySelectorAll('.shout.card');
[...cards].forEach(card => {
if (card.querySelector('a[href="/tags/lumbungkios"]')) {
card.classList.add('lumbung-kios')
} else if (card.querySelector('a[href="/tags/lumbunggallery"]')) {
card.classList.add('lumbung-gallery')
}
})
</script>
</html>

38
themes/lumbung-theme/static/css/main.css
View File

@ -34,6 +34,9 @@
--gallery-light: #FCF4B9;
--gallery-dark: #846A00;
--kios-light: #F6D1BC;
--kios-dark: #E05732;
--shouts-dark: #CB001D;
--shouts-light: #FFD9DD;
@ -661,6 +664,41 @@ div.pen-source {
color: var(--social-dark);
}
/* gallery cards */
.card.shout.lumbung-gallery {
border-color: var(--gallery-dark);
background-color: var(--gallery-light);
color: var(--gallery-dark);
}
.card.shout.lumbung-gallery h2 a {
color: var(--gallery-dark);
}
.card.shout.lumbung-gallery .post-footer {
background: var(--gallery-light);
color: var(--gallery-dark);
border-top: 2px solid;
}
/* kios cards */
.card.shout.lumbung-kios {
border-color: var(--kios-dark);
background-color: var(--kios-light);
color: var(--kios-dark);
}
.card.shout.lumbung-kios h2 a {
color: var(--kios-dark);
}
.card.shout.lumbung-kios .post-footer {
background: var(--kios-light);
color: var(--kios-dark);
border-top: 2px solid;
}
/* calendar cards */