_includes/batch-conversion.html in appscms-tools-theme-3.0.2 vs _includes/batch-conversion.html in appscms-tools-theme-3.0.3

- old
+ new

@@ -1,66 +1,66 @@ -{%- 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-color:{{boxColor}};" class="btn" id="submit-button"> - Convert - <img src="/assets/images/convert.svg" width="20px" alt="convert-files"> - </button> - </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-color:{{boxColor}};" class="btn" id="submit-button"> + Convert + <img src="/assets/images/convert.svg" width="20px" alt="convert-files"> + </button> + </div> </div> \ No newline at end of file