diff options
author | Thedro Neely <thedroneely@gmail.com> | 2019-08-22 07:57:55 -0400 |
---|---|---|
committer | Thedro Neely <thedroneely@gmail.com> | 2019-08-22 07:57:55 -0400 |
commit | df1bd4612692dbf0d37e26022e19515ab1097b54 (patch) | |
tree | 6a7eb1321de8acdbdd4c72f7f65fcd3772416534 /generators | |
parent | 347281626b0ccde16ac9d7042c55d51677c9f2ee (diff) | |
download | thedroneely.com-df1bd4612692dbf0d37e26022e19515ab1097b54.tar.gz thedroneely.com-df1bd4612692dbf0d37e26022e19515ab1097b54.tar.bz2 thedroneely.com-df1bd4612692dbf0d37e26022e19515ab1097b54.zip |
public/css: Prevent responsive image reflow
Diffstat (limited to 'generators')
-rw-r--r-- | generators/hugo/themes/tdro/layouts/shortcodes/image.html | 11 |
1 files changed, 7 insertions, 4 deletions
diff --git a/generators/hugo/themes/tdro/layouts/shortcodes/image.html b/generators/hugo/themes/tdro/layouts/shortcodes/image.html index cc2ce0b..a49ed94 100644 --- a/generators/hugo/themes/tdro/layouts/shortcodes/image.html +++ b/generators/hugo/themes/tdro/layouts/shortcodes/image.html @@ -1,13 +1,16 @@ {{ safeHTML "<?php" }} -$width = '"' . getimagesize($_SERVER['DOCUMENT_ROOT'] . '{{.Get `source`}}')[0] . '"'; -$height = '"' . getimagesize($_SERVER['DOCUMENT_ROOT'] . '{{.Get `source`}}')[1] . '"'; +$width = getimagesize($_SERVER['DOCUMENT_ROOT'] . '{{.Get `source`}}')[0]; +$height = getimagesize($_SERVER['DOCUMENT_ROOT'] . '{{.Get `source`}}')[1]; +$ratio = ((($height / $width) * 100) > 100) ? $height . 'px' : $height / $width * 100 . '%'; {{ safeHTML "?>" }} <figure> <a href="{{.Get `source`}}" onclick="return false;"> + <div {{ safeHTMLAttr `<?php echo 'style=' . '"' . 'padding-bottom:' . $ratio . ';' . '"'; ?>` }}> <img data-image-zoom src="{{.Get `source`}}" alt="{{.Get `title`}}" title="{{.Get `title`}}" - {{ safeHTMLAttr "<?php echo 'width=' . $width; ?>" }} - {{ safeHTMLAttr "<?php echo 'height=' . $height; ?>" }} /> + {{ safeHTMLAttr `<?php echo 'width=' . '"' . $width . '"'; ?>` }} + {{ safeHTMLAttr `<?php echo 'height=' . '"' . $height . '"'; ?>` }} /> + </div> </a> <figcaption class="has-text-centered has-text-grey-dark">{{ .Inner }}</figcaption> </figure> |