_includes/batch-conversion.html in appscms-tools-theme-4.8.3 vs _includes/batch-conversion.html in appscms-tools-theme-4.8.4
- old
+ new
@@ -1,141 +1,141 @@
-{%- assign boxColor = site.data[page.folderName][page.lang][page.fileName].color
--%}
-<div class="options-panel">
- <div class="title">Options</div>
- <div id="controls" class="text-left">
- <label>Amount</label>
- <div class="d-flex">
- {%- if page.effect == "blur" -%}
- <input
- class="w-100"
- type="range"
- min="0"
- max="50"
- value="25"
- step="0.5"
- id="applyFilter"
- data-filter="{{page.effect}}"
- data-scale="px"
- />
- <div class="d-flex align-items-center" id="counter"></div>
- {%- elsif page.effect == "opacity" -%}
- <input
- class="w-100"
- id="applyFilter"
- type="range"
- min="0"
- max="1"
- step="0.1"
- value="0.5"
- data-filter="{{page.effect}}"
- />
- <div class="d-flex align-items-center" id="counter"></div>
- {%- elsif page.effect == "saturate" -%}
- <input
- class="w-100"
- type="range"
- min="0"
- max="200"
- value="100"
- step="1"
- id="applyFilter"
- data-filter="{{page.effect}}"
- data-scale=""
- />
- <div class="d-flex align-items-center" id="counter"></div>
- {%- elsif page.effect == "hue-rotate" -%}
- <input
- class="w-100"
- type="range"
- min="0"
- max="360"
- value="180"
- step="1"
- id="applyFilter"
- data-filter="{{page.effect}}"
- data-scale="deg"
- />
- <div class="d-flex align-items-center" id="counter"></div>
- {%- elsif page.effect == "grayscale" -%}
- <input
- class="w-100"
- type="range"
- min="0"
- max="100"
- value="50"
- step="1"
- id="applyFilter"
- data-filter="{{page.effect}}"
- data-scale="%"
- />
- <div class="d-flex align-items-center" id="counter"></div>
- {%- elsif page.effect == "sepia" -%}
- <input
- class="w-100"
- type="range"
- min="0"
- max="100"
- value="50"
- step="1"
- id="applyFilter"
- data-filter="{{page.effect}}"
- data-scale="%"
- />
- <div class="d-flex align-items-center" id="counter"></div>
- {%- elsif page.effect == "gamma" -%}
- <input
- class="w-100"
- type="range"
- min="0"
- max="10"
- value="5"
- step="1"
- id="applyFilter"
- data-filter="{{page.effect}}"
- />
- {%- elsif page.panelTitle == "exposure" -%}
- <input
- class="w-100"
- type="range"
- min="-100"
- max="100"
- value="0"
- step="1"
- id="applyFilter"
- data-filter="{{page.effect}}"
- />
- {%- else -%}
- <input
- class="w-100"
- type="range"
- min="0"
- max="200"
- value="100"
- step="1"
- id="applyFilter"
- data-filter="{{page.effect}}"
- data-scale="%"
- />
- <div class="d-flex align-items-center" id="counter"></div>
- {%- endif -%}
- <br />
- </div>
- </div>
-
- <div class="download-format d-none">
- <span class="select-format-title">image's format</span>
- <select name="image-format" id="image-format">
- <option value="png">png</option>
- <option value="jpg">jpg</option>
- <option value="jpeg">jpeg</option>
- <option value="webp">webp</option>
- </select>
- </div>
-
- <div class="convertBtn-container">
- <button style="background:{{boxColor}};" class="btn" id="submit-button">
- Convert
- <img src="/assets/images/convert.svg" width="20px" alt="convert-files" />
- </button>
- </div>
-</div>
+{%- assign boxColor = site.data[page.folderName][page.lang][page.fileName].color
+-%}
+<div class="options-panel">
+ <div class="title">Options</div>
+ <div id="controls" class="text-left">
+ <label>Amount</label>
+ <div class="d-flex">
+ {%- if page.effect == "blur" -%}
+ <input
+ class="w-100"
+ type="range"
+ min="0"
+ max="50"
+ value="25"
+ step="0.5"
+ id="applyFilter"
+ data-filter="{{page.effect}}"
+ data-scale="px"
+ />
+ <div class="d-flex align-items-center" id="counter"></div>
+ {%- elsif page.effect == "opacity" -%}
+ <input
+ class="w-100"
+ id="applyFilter"
+ type="range"
+ min="0"
+ max="1"
+ step="0.1"
+ value="0.5"
+ data-filter="{{page.effect}}"
+ />
+ <div class="d-flex align-items-center" id="counter"></div>
+ {%- elsif page.effect == "saturate" -%}
+ <input
+ class="w-100"
+ type="range"
+ min="0"
+ max="200"
+ value="100"
+ step="1"
+ id="applyFilter"
+ data-filter="{{page.effect}}"
+ data-scale=""
+ />
+ <div class="d-flex align-items-center" id="counter"></div>
+ {%- elsif page.effect == "hue-rotate" -%}
+ <input
+ class="w-100"
+ type="range"
+ min="0"
+ max="360"
+ value="180"
+ step="1"
+ id="applyFilter"
+ data-filter="{{page.effect}}"
+ data-scale="deg"
+ />
+ <div class="d-flex align-items-center" id="counter"></div>
+ {%- elsif page.effect == "grayscale" -%}
+ <input
+ class="w-100"
+ type="range"
+ min="0"
+ max="100"
+ value="50"
+ step="1"
+ id="applyFilter"
+ data-filter="{{page.effect}}"
+ data-scale="%"
+ />
+ <div class="d-flex align-items-center" id="counter"></div>
+ {%- elsif page.effect == "sepia" -%}
+ <input
+ class="w-100"
+ type="range"
+ min="0"
+ max="100"
+ value="50"
+ step="1"
+ id="applyFilter"
+ data-filter="{{page.effect}}"
+ data-scale="%"
+ />
+ <div class="d-flex align-items-center" id="counter"></div>
+ {%- elsif page.effect == "gamma" -%}
+ <input
+ class="w-100"
+ type="range"
+ min="0"
+ max="10"
+ value="5"
+ step="1"
+ id="applyFilter"
+ data-filter="{{page.effect}}"
+ />
+ {%- elsif page.panelTitle == "exposure" -%}
+ <input
+ class="w-100"
+ type="range"
+ min="-100"
+ max="100"
+ value="0"
+ step="1"
+ id="applyFilter"
+ data-filter="{{page.effect}}"
+ />
+ {%- else -%}
+ <input
+ class="w-100"
+ type="range"
+ min="0"
+ max="200"
+ value="100"
+ step="1"
+ id="applyFilter"
+ data-filter="{{page.effect}}"
+ data-scale="%"
+ />
+ <div class="d-flex align-items-center" id="counter"></div>
+ {%- endif -%}
+ <br />
+ </div>
+ </div>
+
+ <div class="download-format d-none">
+ <span class="select-format-title">image's format</span>
+ <select name="image-format" id="image-format">
+ <option value="png">png</option>
+ <option value="jpg">jpg</option>
+ <option value="jpeg">jpeg</option>
+ <option value="webp">webp</option>
+ </select>
+ </div>
+
+ <div class="convertBtn-container">
+ <button style="background:{{boxColor}};" class="btn" id="submit-button">
+ Convert
+ <img src="/assets/images/convert.svg" width="20px" alt="convert-files" />
+ </button>
+ </div>
+</div>