From cddc4b63f1a2a4c164c3080c642c88f5fe8200d9 Mon Sep 17 00:00:00 2001 From: "(quasar) nebula" Date: Thu, 10 Apr 2025 13:59:49 -0300 Subject: content, css: coverColumnContent -> artworkColumnContent, etc --- src/content/dependencies/generateAlbumInfoPage.js | 2 +- src/content/dependencies/generatePageLayout.js | 16 +++++++------- .../dependencies/generateTrackArtworkColumn.js | 25 ++++++++++++++++++++++ .../dependencies/generateTrackCoverArtworks.js | 25 ---------------------- src/content/dependencies/generateTrackInfoPage.js | 12 +++++------ src/static/css/site.css | 12 +++++------ 6 files changed, 45 insertions(+), 47 deletions(-) create mode 100644 src/content/dependencies/generateTrackArtworkColumn.js delete mode 100644 src/content/dependencies/generateTrackCoverArtworks.js (limited to 'src') diff --git a/src/content/dependencies/generateAlbumInfoPage.js b/src/content/dependencies/generateAlbumInfoPage.js index 51329450..51632c99 100644 --- a/src/content/dependencies/generateAlbumInfoPage.js +++ b/src/content/dependencies/generateAlbumInfoPage.js @@ -116,7 +116,7 @@ export default { additionalNames: relations.additionalNamesBox, - coverColumnContent: [ + artworkColumnContent: [ (relations.cover ? relations.cover.slots({ showOriginDetails: true, diff --git a/src/content/dependencies/generatePageLayout.js b/src/content/dependencies/generatePageLayout.js index 9348acd8..070c7c82 100644 --- a/src/content/dependencies/generatePageLayout.js +++ b/src/content/dependencies/generatePageLayout.js @@ -93,7 +93,7 @@ export default { mutable: false, }, - coverColumnContent: { + artworkColumnContent: { type: 'html', mutable: false, }, @@ -262,15 +262,15 @@ export default { ? data.canonicalBase + pagePathStringFromRoot : null); - const firstItemInCoverColumn = - html.smooth(slots.coverColumnContent) + const firstItemInArtworkColumn = + html.smooth(slots.artworkColumnContent) .content[0]; const primaryCover = - (firstItemInCoverColumn && - html.resolve(firstItemInCoverColumn, {normalize: 'tag'}) + (firstItemInArtworkColumn && + html.resolve(firstItemInArtworkColumn, {normalize: 'tag'}) .attributes.has('class', 'cover-artwork') - ? firstItemInCoverColumn + ? firstItemInArtworkColumn : null); const titleContentsHTML = @@ -327,11 +327,11 @@ export default { [ titleHTML, - html.tag('div', {id: 'cover-art-column'}, + html.tag('div', {id: 'artwork-column'}, {[html.onlyIfContent]: true}, {class: 'isolate-tooltip-z-indexing'}, - slots.coverColumnContent), + slots.artworkColumnContent), subtitleHTML, diff --git a/src/content/dependencies/generateTrackArtworkColumn.js b/src/content/dependencies/generateTrackArtworkColumn.js new file mode 100644 index 00000000..1cd5bff0 --- /dev/null +++ b/src/content/dependencies/generateTrackArtworkColumn.js @@ -0,0 +1,25 @@ +export default { + contentDependencies: ['generateTrackCoverArtwork'], + + relations: (relation, track) => ({ + albumCover: + (!track.hasUniqueCoverArt && track.album.hasCoverArt + ? relation('generateTrackCoverArtwork', track.album.coverArtworks[0]) + : null), + + trackCovers: + (track.hasUniqueCoverArt + ? track.trackArtworks.map(artwork => + relation('generateTrackCoverArtwork', artwork)) + : null), + }), + + generate: (relations) => + [relations.albumCover, ...relations.trackCovers ?? []] + .filter(Boolean) + .map(cover => + cover.slots({ + showOriginDetails: true, + showReferenceLinks: true, + })), +}; diff --git a/src/content/dependencies/generateTrackCoverArtworks.js b/src/content/dependencies/generateTrackCoverArtworks.js deleted file mode 100644 index 1cd5bff0..00000000 --- a/src/content/dependencies/generateTrackCoverArtworks.js +++ /dev/null @@ -1,25 +0,0 @@ -export default { - contentDependencies: ['generateTrackCoverArtwork'], - - relations: (relation, track) => ({ - albumCover: - (!track.hasUniqueCoverArt && track.album.hasCoverArt - ? relation('generateTrackCoverArtwork', track.album.coverArtworks[0]) - : null), - - trackCovers: - (track.hasUniqueCoverArt - ? track.trackArtworks.map(artwork => - relation('generateTrackCoverArtwork', artwork)) - : null), - }), - - generate: (relations) => - [relations.albumCover, ...relations.trackCovers ?? []] - .filter(Boolean) - .map(cover => - cover.slots({ - showOriginDetails: true, - showReferenceLinks: true, - })), -}; diff --git a/src/content/dependencies/generateTrackInfoPage.js b/src/content/dependencies/generateTrackInfoPage.js index d2cdf416..7d531124 100644 --- a/src/content/dependencies/generateTrackInfoPage.js +++ b/src/content/dependencies/generateTrackInfoPage.js @@ -11,7 +11,7 @@ export default { 'generateContributionList', 'generatePageLayout', 'generateTrackArtistCommentarySection', - 'generateTrackCoverArtworks', + 'generateTrackArtworkColumn', 'generateTrackInfoPageFeaturedByFlashesList', 'generateTrackInfoPageOtherReleasesList', 'generateTrackList', @@ -58,10 +58,8 @@ export default { additionalNamesBox: relation('generateAdditionalNamesBox', track.additionalNames), - covers: - (track.hasUniqueCoverArt || track.album.hasCoverArt - ? relation('generateTrackCoverArtworks', track) - : null), + artworkColumn: + relation('generateTrackArtworkColumn', track), contentHeading: relation('generateContentHeading'), @@ -141,8 +139,8 @@ export default { color: data.color, styleRules: [relations.albumStyleRules], - coverColumnContent: - relations.covers, + artworkColumnContent: + relations.artworkColumn, mainContent: [ relations.releaseInfo, diff --git a/src/static/css/site.css b/src/static/css/site.css index 26696e93..e4057620 100644 --- a/src/static/css/site.css +++ b/src/static/css/site.css @@ -1436,19 +1436,19 @@ hr.cute, overflow: hidden; } -#cover-art-column .cover-artwork { +#artwork-column .cover-artwork { box-shadow: 0 2px 14px -6px var(--primary-color), 0 0 12px 12px #00000080; } -#cover-art-column .cover-artwork:not(:first-child) { +#artwork-column .cover-artwork:not(:first-child) { margin-top: 20px; margin-left: 30px; margin-right: 5px; } -#cover-art-column .cover-artwork:last-child:not(:first-child) { +#artwork-column .cover-artwork:last-child:not(:first-child) { margin-bottom: 25px; } @@ -3458,7 +3458,7 @@ main.long-content .content-sticky-heading-container .content-sticky-subheading-r /* Cover art floats to the right. It's positioned in HTML beneath the * heading, so pull it up a little to "float" on top. */ - #cover-art-column { + #artwork-column { float: right; width: 40%; max-width: 400px; @@ -3471,7 +3471,7 @@ main.long-content .content-sticky-heading-container .content-sticky-subheading-r /* ...Except on top-indexes, where cover art is displayed prominently * between the heading and subheading. */ - #content.top-index #cover-art-column { + #content.top-index #artwork-column { float: none; margin: 2em auto 2.5em auto; max-width: 375px; @@ -3578,7 +3578,7 @@ main.long-content .content-sticky-heading-container .content-sticky-subheading-r --responsive-padding-ratio: 0.02; } - #cover-art-column { + #artwork-column { margin: 25px 0 5px 0; width: 100%; max-width: unset; -- cgit 1.3.0-6-gf8a5