cdransf/coryd.dev-eleventy
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore: improve minification

Browse source
This commit is contained in:
Cory Dransfeldt 2024-08-29 08:20:16 -07:00
parent 50da2beca1
commit 55326dab7d
No known key found for this signature in database
8 changed files with 69 additions and 57 deletions
Download patch file Download diff file Expand all files Collapse all files

20
src/assets/scripts/index.js
View file

@ -40,4 +40,24 @@ window.addEventListener('load', () => {
}
})
})()
;(() => {
const button = document.querySelector('[data-toggle-button]')
const content = document.querySelector('[data-toggle-content]')
const text = document.querySelectorAll('[data-toggle-content] p')
const minHeight = 500 // this needs to match the height set on [data-toggle-content].text-toggle-hidden in text-toggle.css
const interiorHeight = Array.from(text).reduce((acc, node) => acc + node.scrollHeight, 0)
if (!button || !content || !text) return
if (interiorHeight < minHeight) {
content.classList.remove('text-toggle-hidden')
button.style.display = 'none'
}
button.addEventListener('click', () => {
const isHidden = content.classList.toggle('text-toggle-hidden')
button.textContent = isHidden ? 'Show more' : 'Show less'
})
})
})

17
src/assets/scripts/text-toggle.js
View file

@ -1,17 +0,0 @@
window.addEventListener('load', () => {
const button = document.querySelector('[data-toggle-button]')
const content = document.querySelector('[data-toggle-content]')
const text = document.querySelectorAll('[data-toggle-content] p')
const minHeight = 500 // this needs to match the height set on [data-toggle-content].text-toggle-hidden in text-toggle.css
const interiorHeight = Array.from(text).reduce((acc, node) => acc + node.scrollHeight, 0)
if (interiorHeight < minHeight) {
content.classList.remove('text-toggle-hidden')
button.style.display = 'none'
}
button.addEventListener('click', () => {
const isHidden = content.classList.toggle('text-toggle-hidden')
button.textContent = isHidden ? 'Show more' : 'Show less'
})
})

4
src/pages/dynamic/music/artists/artist.html
View file

@ -11,9 +11,6 @@ schema: artist
{%- capture alt -%}
{{ artist.name }} / {{ artist.country }}
{%- endcapture -%}
{%- capture js -%}
{% render "../../../../assets/scripts/text-toggle.js" %}
{%- endcapture -%}
{%- capture playLabel -%}
{%- if artist.totalPlays == 1 -%}
play
@ -21,7 +18,6 @@ schema: artist
plays
{%- endif -%}
{%- endcapture -%}
<script>{{ js }}</script>
<noscript><style>[data-toggle-content].text-toggle-hidden {height: unset !important;overflow: unset !important;margin-bottom: unset !important;}[data-toggle-content].text-toggle-hidden::after {display: none !important;}</style></noscript>
<a href="/music" title="Go back to the music index page">{% tablericon "arrow-left" "Go back to the music index page" %} Back to music</a>
<article class="artist-focus">

4
src/pages/dynamic/music/genre.html
View file

@ -17,10 +17,6 @@ schema: genre
{% endif %}
{%- endcapture -%}
{%- assign mediaLinks = genre.artists | sortByPlaysDescending: "total_plays" | mediaLinks: "artist", 5 -%}
{%- capture js -%}
{% render "../../../assets/scripts/text-toggle.js" %}
{%- endcapture -%}
<script>{{ js }}</script>
<noscript><style>[data-toggle-content].text-toggle-hidden {height: unset !important;overflow: unset !important;margin-bottom: unset !important;}[data-toggle-content].text-toggle-hidden::after {display: none !important;}</style></noscript>
<a href="/music" title="Go back to the music index page">{% tablericon "arrow-left" "Go back to the music index page" %} Back to music</a>
<h2>{{ genre.name }}</h2>