Update style/galerie_double_v/style.css

style/galerie_double_v/style.css

@@ -123,14 +123,29 @@
   font-size: 22px;
 }
 
-.toggle-quality-btn {
+/* Reset camera button repositioned */
+.reset-camera-btn {
   top: 17px;
-  right: 125px;
+  right: 120px;
+  font-size: 22px;
+  line-height: normal;
+  padding: 0;
 }
 
-.reset-camera-btn {
+/* New toggle-quality button:
+   - Placed to the left of the reset camera button.
+   - Longer horizontally to fit the text.
+   - Maintains the same height and uses horizontal padding for extra space.
+*/
+.toggle-quality-btn {
   top: 17px;
-  right: 180px;
+  right: 170px;
+  min-width: 120px;  /* Ensures the text fits */
+  height: 45px;
+  padding: 0 10px;
+  border-radius: 22.5px; /* Half the height for a pill shape */
+  text-align: center;
+  white-space: nowrap;
 }
 
 /* Adjust the reset icon position */
@@ -141,19 +156,19 @@
 
 /* --- Mobile adjustments: when the widget container has the "mobile" class --- */
 .ply-widget-container.mobile .widget-button {
-  width: 30px;    /* 45px * approx 0.67 */
-  height: 30px;   /* 45px * approx 0.67 */
-  font-size: 10px; /* 14px * approx 0.67 */
+  width: 30px;    /* 45px scaled down */
+  height: 30px;
+  font-size: 10px;
 }
 
 .ply-widget-container.mobile .help-toggle {
-  font-size: 15px; /* 22px scaled down */
+  font-size: 15px; /* Scaled down from 22px */
 }
 
 /* Adjust button positions for mobile */
 .ply-widget-container.mobile .close-btn {
-  top: 11px;    /* 17px * approx 0.67 */
-  left: 10px;   /* 15px * approx 0.67 */
+  top: 11px;    /* 17px scaled down */
+  left: 10px;   /* 15px scaled down */
 }
 
 .ply-widget-container.mobile .fullscreen-toggle {
@@ -163,15 +178,27 @@
 
 .ply-widget-container.mobile .help-toggle {
   top: 11px;
-  right: 47px;  /* scaled from 70px */
+  right: 47px;
 }
 
-.ply-widget-container.mobile .toggle-quality-btn {
+/* Mobile reset camera button remains at right:82px */
+.ply-widget-container.mobile .reset-camera-btn {
   top: 11px;
-  right: 84px;  /* placed between help and reset buttons */
+  right: 82px;
 }
 
-.ply-widget-container.mobile .reset-camera-btn {
+/* Mobile toggle-quality button:
+   - Placed to the left of the reset camera button.
+   - Has a longer (wider) layout to accommodate text.
+*/
+.ply-widget-container.mobile .toggle-quality-btn {
   top: 11px;
-  right: 121px;  /* shifted to allow space for the new button */
+  right: 110px;
+  min-width: 80px;
+  height: 30px;
+  padding: 0 5px;
+  border-radius: 15px;
+  text-align: center;
+  white-space: nowrap;
+  font-size: 10px;
 }