redstrate/redstrate.com
1
Fork 0
Code Activity Actions

Only show gallery type icons with Javascript, which are only layouted in JS anyway

Browse source
This commit is contained in:
Joshua Goins 2024-10-12 16:36:58 -04:00
parent 5192a8f066
commit 9a76dac0c5
3 changed files with 13 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
themes/red/assets/css/site.css
View file

@ -684,3 +684,7 @@ model-viewer {
.character span { .character span {
display: block; display: block;
} }
.gallery-type-icon-hidden {
visibility: hidden;
}

6
themes/red/assets/js/gallery.js
View file

@ -1,4 +1,10 @@
imagesLoaded(document.querySelector('.grid'), function(instance) { imagesLoaded(document.querySelector('.grid'), function(instance) {
var typeIcons = document.getElementsByClassName('gallery-type-icon-hidden');
for(var i = 0; i < typeIcons.length; i++) {
typeIcons[i].classList.remove("gallery-type-icon-hidden");
}
new Masonry('.grid', { new Masonry('.grid', {
itemSelector: '.grid-item', itemSelector: '.grid-item',
columnWidth: '.grid-sizer', columnWidth: '.grid-sizer',

6
themes/red/layouts/partials/render-art.html
View file

@ -11,19 +11,19 @@
{{ with $full }} {{ with $full }}
{{ if $.Params.threed }} {{ if $.Params.threed }}
{{ with resources.Get "3d.png" }} {{ with resources.Get "3d.png" }}
<img alt="3D cube icon" title="Viewable 3D" style="z-index: 1; position: absolute; left: 10px; top: 10px; border: none" src="{{ .RelPermalink }}"> <img class="gallery-type-icon-hidden" alt="3D cube icon" title="Viewable 3D" style="z-index: 1; position: absolute; left: 10px; top: 10px; border: none" src="{{ .RelPermalink }}">
{{ end }} {{ end }}
{{ end }} {{ end }}
{{ if $.Params.comic }} {{ if $.Params.comic }}
{{ with resources.Get "comic.png" }} {{ with resources.Get "comic.png" }}
<img alt="Comic icon" title="Viewable Comic" style="z-index: 1; position: absolute; left: 10px; top: 10px; border: none" src="{{ .RelPermalink }}"> <img class="gallery-type-icon-hidden" alt="Comic icon" title="Viewable Comic" style="z-index: 1; position: absolute; left: 10px; top: 10px; border: none" src="{{ .RelPermalink }}">
{{ end }} {{ end }}
{{ end }} {{ end }}
{{ if $.Params.animation }} {{ if $.Params.animation }}
{{ with resources.Get "play-circle.png" }} {{ with resources.Get "play-circle.png" }}
<img alt="Play animation icon" title="Viewable Animation" style="z-index: 1; position: absolute; left: 10px; top: 10px; border: none" src="{{ .RelPermalink }}"> <img class="gallery-type-icon-hidden" alt="Play animation icon" title="Viewable Animation" style="z-index: 1; position: absolute; left: 10px; top: 10px; border: none" src="{{ .RelPermalink }}">
{{ end }} {{ end }}
{{ end }} {{ end }}