assets/data/gallery_customizer.html in j1-template-2022.0.18 vs assets/data/gallery_customizer.html in j1-template-2022.1.0
- old
+ new
@@ -11,11 +11,11 @@
# by J1 Gallery customizer
#
# Product/Info:
# https://jekyll.one
#
- # Copyright (C) 2021 Juergen Adams
+ # Copyright (C) 2022 Juergen Adams
#
# J1 Template is licensed under the MIT License.
# See: https://github.com/jekyll-one-org/J1 Template/blob/master/LICENSE
# -----------------------------------------------------------------------------
# Test data:
@@ -49,17 +49,23 @@
{% if environment == 'prod' or environment == 'production' %}
{% assign production = true %}
{% endif %}
{% comment %} i18n: language selection (supported languages: en|de)
--------------------------------------------------------------------------------- {% endcomment %}
+NOTE: currently NOT used
+--------------------------------------------------------------------------------
{% if site.language == 'en' or site.language == 'de' %}
{% assign language = site.language %}
{% else %}
{% assign language = 'en' %}
{% endif %}
+-------------------------------------------------------------------------------- {% endcomment %}
+{% comment %} Set language fix to 'en'
+-------------------------------------------------------------------------------- {% endcomment %}
+{% assign language = 'en' %}
+
<!-- [INFO ] [j1.assets.data.banner.html ] [ set meta data (robots) to exclude HTML datafiles from index ] -->
<head>
<meta name="robots" content="noindex, nofollow" />
</head>
@@ -84,52 +90,30 @@
</ul>
</div>
</header>
{% comment %} i18n: translations
+ NOTE: currently NOT used
---------------------------------------------------------------------------- {% endcomment %}
{% if language == 'en' %}
<div id="drw_customizer" class="bmd-layout-drawer bg-faded">
<span class="navbar-brand ml-2 mb-3">Settings</span>
- <form id="jg-customizer-form" class="form-horizontal">
+ <form id="jg-customizer-form" class="form-horizontal ml-2 mr-4">
+ <div>
- <div class="mdc-list-group">
-
- <div class="col-md-12 mb-4">
- <div class="form-group">
- <label class="bmd-label-floating" for="rowHeight">Row Height [px]</label>
- <input id="rowHeight" name="rowHeight" class="form-control" type="number" value="{{customizer_options.gallery_settings.rowHeight}}">
- <span class="bmd-help">Image line height (min: 100px)</span>
- </div>
+ <div class="mt-0 mb-4 ml-2">
+ <div id="jgSlider_row_heigth" class="range-slider"></div>
</div>
-
- <!-- div class="col-md-12">
- <div class="form-group">
- <label class="bmd-label-floating" for="rowHeightMax">Row Height Max [px]</label>
- <input id="rowHeightMax" name="rowHeightMax" class="form-control" type="number" value="{{customizer_options.gallery_settings.maxRowHeight}}">
- <span class="bmd-help">Maximum row height</span>
- </div>
- </div-->
-
- <div class="col-md-12 mb-4">
- <div class="form-group">
- <label class="bmd-label-floating" for="margins">Thumb Spacing [px]</label>
- <input id="margins" name="margins" class="form-control" type="number" value="{{customizer_options.gallery_settings.margins}}">
- <span class="bmd-help">Space between the preview images</span>
- </div>
+ <div class="mt-5 mb-3 ml-2">
+ <div id="jgSlider_thumb_spacing" class="range-slider"></div>
</div>
-
- <div class="col-md-12 mb-4">
- <div class="form-group">
- <label class="bmd-label-floating" for="border">Gallery Padding [px]</label>
- <input id="border" name="border" class="form-control" type="number" value="{{customizer_options.gallery_settings.border}}">
- <span class="bmd-help">Border size around the gallery</span>
- </div>
+ <div class="mt-5 mb-3 ml-2">
+ <div id="jgSlider_gallery_padding" class="range-slider"></div>
</div>
- <div class="ml-1 mt-5 mb-5">
+ <div class="mt-4">
<div class="switch">
<label>
<input id="captions" name="captions" type="checkbox" checked>
Enable Captions
</label>
@@ -155,100 +139,22 @@
</div>
</div>
<button type="button" name="reset-defaults"
- class="btn btn-flex btn-primary ml-2"
+ class="btn btn-flex btn-primary mt-5 ml-2"
aria-label="Reset Button"
style="min-width: 12rem">
<i class="mdi mdi-close mdi-24px mdi-md_white mr-1"></i>
Reset
</button>
- <!-- div class="mt-1">
- <a id="reset-defaults" href="#void"
- class="btn btn-flex btn-md btn-primary mr-2 mb-2" style="min-width: 10rem">
- <i class="mdi mdi-eye mdi-24px mdi-md_white mr-1"></i>
- Reset to defaults
- </a>
- </div -->
-
</form>
</div>
{% endif %}
- {% if language == 'de' %}
- <div id="drw_customizer" class="bmd-layout-drawer bg-faded">
- <span class="navbar-brand ml-2 mb-3">Einstellungen</span>
- <form id="jg-customizer-form" class="form-horizontal">
-
- <div class="mdc-list-group">
- <div class="col-md-12 mb-4">
-
- <div class="form-group">
- <label class="bmd-label-floating" for="rowHeight">Zeilenhöhe [px]</label>
- <input id="rowHeight" name="rowHeight" class="form-control" type="number" value="{{customizer_options.gallery_settings.rowHeight}}">
- <span class="bmd-help">Höhe einer Bildzeile (min: 100px)</span>
- </div>
- </div>
-
- <div class="col-md-12 mb-4">
- <div class="form-group">
- <label class="bmd-label-floating" for="margins">Bildabstand [px]</label>
- <input id="margins" name="margins" class="form-control" type="number" value="{{customizer_options.gallery_settings.margins}}">
- <span class="bmd-help">Abstände der Vorschaubilder</span>
- </div>
- </div>
-
- <div class="col-md-12 mb-4">
- <div class="form-group">
- <label class="bmd-label-floating" for="border">Gallerierahmen [px]</label>
- <input id="border" name="border" class="form-control" type="number" value="{{customizer_options.gallery_settings.border}}">
- <span class="bmd-help">Randgröße um die Gallerie</span>
- </div>
- </div>
-
- <div class="ml-1 mt-5 mb-5">
- <div class="switch">
- <label>
- <input id="captions" name="captions" type="checkbox" checked>
- Untertitel aktivieren
- </label>
- </div>
- <div class="switch">
- <label>
- <input id="random" name="random" type="checkbox">
- Zufällige Bildanzeige
- </label>
- </div>
- <div class="switch">
- <label>
- <input id="justify_last_row" name="justify_last_row" type="checkbox">
- Letzte Reihe ausrichten
- </label>
- </div>
- <div class="switch">
- <label>
- <input id="hide_last_row" name="hide_last_row" type="checkbox">
- Letzte Reihe ausblenden
- </label>
- </div>
- </div>
-
- </div>
-
- <button type="button" name="reset-defaults"
- class="btn btn-flex btn-primary ml-2"
- aria-label="Reset Button"
- style="min-width: 12rem">
- <i class="mdi mdi-close mdi-24px mdi-md_white mr-1"></i>
- Zurücksetzen
- </button>
-
- </form>
- </div>
- {% endif %}
-
+ {% comment %} Main
+ ---------------------------------------------------------------------------- {% endcomment %}
<!-- main content -->
<div class="bmd-layout-content">
<div class="raw_container" style="padding-right: 0px; padding-left: 0px;">
<div id="jg_customizer" ></div>
</div>