diff options
| author | Tomas Bzatek <tbzatek@users.sourceforge.net> | 2018-12-15 21:29:26 +0100 |
|---|---|---|
| committer | Tomas Bzatek <tbzatek@users.sourceforge.net> | 2018-12-15 21:29:26 +0100 |
| commit | 075b1ca114b7f817c64ebd4a5d2b32400d52d2df (patch) | |
| tree | e9efa268768a16c18dd92585f0add5c83a5212ee /templates/fluid/template_album.html | |
| parent | 465bca88f750c019f79f7da3b6c0d840b7d06d1e (diff) | |
| download | cataract-075b1ca114b7f817c64ebd4a5d2b32400d52d2df.tar.xz | |
templates/fluid: Tweak image sizes
Tested on various common resolutions with standard browser and system toolbars.
Diffstat (limited to 'templates/fluid/template_album.html')
| -rw-r--r-- | templates/fluid/template_album.html | 10 |
1 files changed, 5 insertions, 5 deletions
diff --git a/templates/fluid/template_album.html b/templates/fluid/template_album.html index dbfb8d5..6f08b81 100644 --- a/templates/fluid/template_album.html +++ b/templates/fluid/template_album.html @@ -10,13 +10,13 @@ <script type="text/javascript">var NUM_PHOTOS = $(TOTAL_ITEMS);</script> <script type="text/javascript" src="$(TEMPLATES_PATH)scripts.js">onLoad();</script> <style> -@media screen and (min-width: 1600px) {<!-- $(BEGIN_IMG_LIST) --> +@media screen and (min-width: 1700px) {<!-- $(BEGIN_IMG_LIST) --> <!-- $(BEGIN_LIST_PICTURE_ALL_SIZES) --><!-- $(ifdef(HAVE_IMG_SIZE_ORIGINAL)) --> div.photo#photo-$(ITEM_INDEX) img { width: $(IMG_SIZE_W__ORIGINAL)px; height: $(IMG_SIZE_H__ORIGINAL)px; }<!-- $(endif(HAVE_IMG_SIZE_ORIGINAL)) --><!-- $(END_LIST_PICTURE_ALL_SIZES) --> <!-- $(END_IMG_LIST) --> } -@media screen and (min-width: 2100px) {<!-- $(BEGIN_IMG_LIST) --> +@media screen and (min-width: 2300px) {<!-- $(BEGIN_IMG_LIST) --> <!-- $(BEGIN_LIST_PICTURE_ALL_SIZES) --><!-- $(ifdef(HAVE_IMG_SIZE_HIRES)) --> div.photo#photo-$(ITEM_INDEX) img { width: $(IMG_SIZE_W__HIRES)px; height: $(IMG_SIZE_H__HIRES)px; }<!-- $(endif(HAVE_IMG_SIZE_HIRES)) --><!-- $(END_LIST_PICTURE_ALL_SIZES) --> <!-- $(END_IMG_LIST) --> @@ -61,9 +61,9 @@ <div class="photo" id="photo-$(ITEM_INDEX)"> <div class="position_marker" id="i$(ITEM_INDEX)"></div> <picture> - <!-- $(ifdef(HAVE_IMG_SIZE_HIRES)) --><source media="(min-width: 2100px)" srcset="$(IMG_SRC__HIRES)$(ifdef(HAVE_IMG_SIZE_HIRES_HIDPI_1.5X)), $(IMG_SRC__HIRES_HIDPI_1.5X) 1.5x$(endif(HAVE_IMG_SIZE_HIRES_HIDPI_1.5X))$(ifdef(HAVE_IMG_SIZE_HIRES_HIDPI_2X)), $(IMG_SRC__HIRES_HIDPI_2X) 2x$(endif(HAVE_IMG_SIZE_HIRES_HIDPI_2X))"><!-- $(endif(HAVE_IMG_SIZE_HIRES)) --> - <!-- $(ifdef(HAVE_IMG_SIZE_ORIGINAL)) --><source media="(min-width: 1600px)" srcset="$(IMG_SRC__ORIGINAL)$(ifdef(HAVE_IMG_SIZE_ORIGINAL_HIDPI_1.5X)), $(IMG_SRC__ORIGINAL_HIDPI_1.5X) 1.5x$(endif(HAVE_IMG_SIZE_ORIGINAL_HIDPI_1.5X))$(ifdef(HAVE_IMG_SIZE_ORIGINAL_HIDPI_2X)), $(IMG_SRC__ORIGINAL_HIDPI_2X) 2x$(endif(HAVE_IMG_SIZE_ORIGINAL_HIDPI_2X))"><!-- $(endif(HAVE_IMG_SIZE_ORIGINAL)) --> - <source media="(max-width: 1600px)" srcset="$(IMG_SRC)$(ifdef(HAVE_IMG_SIZE_PREVIEW_HIDPI_1.5X)), $(IMG_SRC__PREVIEW_HIDPI_1.5X) 1.5x$(endif(HAVE_IMG_SIZE_PREVIEW_HIDPI_1.5X))$(ifdef(HAVE_IMG_SIZE_PREVIEW_HIDPI_2X)), $(IMG_SRC__PREVIEW_HIDPI_2X) 2x$(endif(HAVE_IMG_SIZE_PREVIEW_HIDPI_2X))"> + <!-- $(ifdef(HAVE_IMG_SIZE_HIRES)) --><source media="(min-width: 2300px)" srcset="$(IMG_SRC__HIRES)$(ifdef(HAVE_IMG_SIZE_HIRES_HIDPI_1.5X)), $(IMG_SRC__HIRES_HIDPI_1.5X) 1.5x$(endif(HAVE_IMG_SIZE_HIRES_HIDPI_1.5X))$(ifdef(HAVE_IMG_SIZE_HIRES_HIDPI_2X)), $(IMG_SRC__HIRES_HIDPI_2X) 2x$(endif(HAVE_IMG_SIZE_HIRES_HIDPI_2X))"><!-- $(endif(HAVE_IMG_SIZE_HIRES)) --> + <!-- $(ifdef(HAVE_IMG_SIZE_ORIGINAL)) --><source media="(min-width: 1700px)" srcset="$(IMG_SRC__ORIGINAL)$(ifdef(HAVE_IMG_SIZE_ORIGINAL_HIDPI_1.5X)), $(IMG_SRC__ORIGINAL_HIDPI_1.5X) 1.5x$(endif(HAVE_IMG_SIZE_ORIGINAL_HIDPI_1.5X))$(ifdef(HAVE_IMG_SIZE_ORIGINAL_HIDPI_2X)), $(IMG_SRC__ORIGINAL_HIDPI_2X) 2x$(endif(HAVE_IMG_SIZE_ORIGINAL_HIDPI_2X))"><!-- $(endif(HAVE_IMG_SIZE_ORIGINAL)) --> + <source media="(max-width: 1699px)" srcset="$(IMG_SRC)$(ifdef(HAVE_IMG_SIZE_PREVIEW_HIDPI_1.5X)), $(IMG_SRC__PREVIEW_HIDPI_1.5X) 1.5x$(endif(HAVE_IMG_SIZE_PREVIEW_HIDPI_1.5X))$(ifdef(HAVE_IMG_SIZE_PREVIEW_HIDPI_2X)), $(IMG_SRC__PREVIEW_HIDPI_2X) 2x$(endif(HAVE_IMG_SIZE_PREVIEW_HIDPI_2X))"> <img src="$(IMG_SRC)" width="$(IMG_SIZE_W)" height="$(IMG_SIZE_H)" alt="" id="$(value(BORDER_STYLE))"/> </picture> <div class="photo-content"> |