From 0b20efeb113fd51291dee3e4cfa76e044c22ce2e Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Tue, 12 Jan 2021 12:31:33 -0400 Subject: traversing fandom --- static/client.js | 4 ++-- static/site.css | 69 ++++++++++++++++++++++++++++++++------------------------ 2 files changed, 41 insertions(+), 32 deletions(-) (limited to 'static') diff --git a/static/client.js b/static/client.js index 549fde29..83c82a29 100644 --- a/static/client.js +++ b/static/client.js @@ -167,8 +167,8 @@ fetch(rebase('data.json')).then(data => data.json()).then(data => { artistData = data.artistData; flashData = data.flashData; - officialAlbumData = albumData.filter(album => !album.isFanon); - fandomAlbumData = albumData.filter(album => album.isFanon); + officialAlbumData = albumData.filter(album => album.groups.includes('group:official')); + fandomAlbumData = albumData.filter(album => !album.groups.includes('group:official')); artistNames = artistData.filter(artist => !artist.alias).map(artist => artist.name); for (const element of elements1) element.style.display = 'none'; diff --git a/static/site.css b/static/site.css index 90f8ed3e..e76054ab 100644 --- a/static/site.css +++ b/static/site.css @@ -31,7 +31,7 @@ body::before { height: 100%; z-index: -1; - background-image: url("https://www.homestuck.com/images/desktops/johnhouse_1920x1080.jpg"); + background-image: url("bg.jpg"); background-position: center; background-size: cover; opacity: 0.5; @@ -41,7 +41,7 @@ body::before { background-color: var(--bg-color); color: rgb(var(--fg-shade), var(--fg-shade), var(--fg-shade)); - max-width: 1200px; + max-width: 1100px; margin: 10px auto 50px; padding: 15px; @@ -120,8 +120,12 @@ a:hover { } #header .chronology { - display: inline; - white-space: nowrap; + display: inline-block; +} + +#header .chronology .heading, +#header .chronology .buttons { + display: inline-block; } .nowrap { @@ -166,32 +170,6 @@ a:hover { font-size: 1em; } -@media (max-width: 780px) { - .sidebar:not(.no-hide) { - display: none; - } - - .layout-columns.vertical-when-thin { - flex-direction: column; - } - - .layout-columns.vertical-when-thin > *:not(:last-child) { - margin-bottom: 10px; - } - - .sidebar.no-hide { - max-width: unset !important; - flex-basis: unset !important; - margin-right: 0; - } -} - -@media (max-width: 600px) { - .content-columns { - columns: 1; - } -} - .sidebar, #content, #header, #skippers { background-color: rgba(var(--bg-shade), var(--bg-shade), var(--bg-shade), 0.6); border: 1px dotted var(--fg-color); @@ -729,3 +707,34 @@ li > ul { content: '.'; } } + +@media (max-width: 900px) { + .sidebar-column:not(.no-hide) { + display: none; + } + + .layout-columns.vertical-when-thin { + flex-direction: column; + } + + .layout-columns.vertical-when-thin > *:not(:last-child) { + margin-bottom: 10px; + } + + .sidebar-column.no-hide { + max-width: unset !important; + flex-basis: unset !important; + margin-right: 0 !important; + margin-left: 0 !important; + } + + .sidebar .news-entry:not(.first-news-entry) { + display: none; + } +} + +@media (max-width: 600px) { + .content-columns { + columns: 1; + } +} -- cgit 1.3.0-6-gf8a5