From fb94d9d1d7883165c04cb4c4dbb2e9ef0bd20f5a Mon Sep 17 00:00:00 2001
From: Abdullah Alfaraj <abdullah.a.f2014@gmail.com>
Date: Sun, 19 Feb 2023 08:36:33 +0300
Subject: [PATCH] add a link button in between the width and height slider

---
 index.html | 32 ++++++++++++++++++++++----------
 1 file changed, 22 insertions(+), 10 deletions(-)

diff --git a/index.html b/index.html
index 0e35ea2..6299435 100644
--- a/index.html
+++ b/index.html
@@ -657,16 +657,16 @@
                     <!-- <button class="btnSquare" id="btnLoadViewer">Load</button> -->
                 </div>
                 <div style="display: flex">
-                <sp-slider
-                    show-value="true"
-                    id="slThumbnailSize"
-                    min="1"
-                    max="10"
-                    value="5"
+                    <sp-slider
+                        show-value="true"
+                        id="slThumbnailSize"
+                        min="1"
+                        max="10"
+                        value="5"
                         style="width: 100%"
-                >
-                    <sp-label slot="label">Thumbnail Size:</sp-label>
-                </sp-slider>
+                    >
+                        <sp-label slot="label">Thumbnail Size:</sp-label>
+                    </sp-slider>
                     <sp-checkbox
                         class="checkbox"
                         id="chSquareThumbnail"
@@ -1483,7 +1483,13 @@
                                 </sp-menu>
                             </sp-picker>
                         </div>
-                        <div style="display: flex">
+                        <div
+                            style="
+                                display: flex;
+                                justify-content: center;
+                                align-items: center;
+                            "
+                        >
                             <sp-slider
                                 show-value="false"
                                 id="slWidth"
@@ -1500,6 +1506,12 @@
                                     >512</sp-label
                                 >
                             </sp-slider>
+                            <button
+                                class="btnSquare linkSlider whiteChain"
+                                id="linkWidthHeight"
+                                title="maintain the ratio between width and height slider"
+                                data-b_link="true"
+                            ></button>
                             <sp-slider
                                 show-value="false"
                                 id="slHeight"