From 660d6fd951796e920392adc032bba43c250ecd41 Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Sun, 4 Apr 2021 16:01:33 -0300 Subject: cover art in info card --- static/client.js | 5 ++++- static/site.css | 22 +++++++++++++++++++++- 2 files changed, 25 insertions(+), 2 deletions(-) (limited to 'static') diff --git a/static/client.js b/static/client.js index aae0919..60bf62b 100644 --- a/static/client.js +++ b/static/client.js @@ -78,7 +78,7 @@ function getFlashListAndIndex() { // TODO: This should also use urlSpec. function fetchData(type, directory) { - return fetch(rebase(`data/${type}/${directory}/data.json`, 'rebaseData')) + return fetch(rebase(`${type}/${directory}/data.json`, 'rebaseData')) .then(res => res.json()); } @@ -225,6 +225,9 @@ const infoCard = (() => { const albumLink = container.querySelector('.info-card-album a'); link(albumLink, 'album', data.links.album); + + const img = container.querySelector('.info-card-art'); + img.src = rebase(data.cover.path, 'rebaseMedia'); }); } diff --git a/static/site.css b/static/site.css index e13ec10..59f13c5 100644 --- a/static/site.css +++ b/static/site.css @@ -752,7 +752,9 @@ li > ul { } .info-card { - background-color: rgba(0, 0, 0, 0.8); + background-color: black; + color: white; + border: 1px dotted var(--primary-color); border-radius: 3px; box-shadow: 0 5px 5px black; @@ -773,6 +775,24 @@ li > ul { } } +.info-card-art-container { + float: right; + + width: 40%; + margin: 5px; + font-size: 0.8em; +} + +.info-card-art-container .image-container { + padding: 2px; +} + +.info-card-art { + display: block; + width: 100%; + height: 100%; +} + .info-card-name { font-size: 1em; border-bottom: 1px dotted; -- cgit 1.3.0-6-gf8a5