Added margin to popup buttons

libredirect · Sep 19, 2024 · 67c564f · 67c564f
1 parent 7c52730
commit 67c564f
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 9 deletions.
diff --git a/src/pages/components/Label.svelte b/src/pages/components/Label.svelte
@@ -1,4 +1,4 @@
-<span>
+<span {...$$restProps}>
   <slot></slot>
 </span>
 

diff --git a/src/pages/popup_src/Buttons.svelte b/src/pages/popup_src/Buttons.svelte
@@ -106,7 +106,7 @@
         })
       }}
     >
-      <Label>{browser.i18n.getMessage("redirect") || "Redirect"}</Label>
+      <Label class="margin">{browser.i18n.getMessage("redirect") || "Redirect"}</Label>
       <RedirectIcon />
     </Row>
   {/if}
@@ -121,12 +121,12 @@
               window.close()
             })}
         >
-          <Label>{browser.i18n.getMessage("switchInstance") || "Switch Instance"}</Label>
+          <Label class="margin">{browser.i18n.getMessage("switchInstance") || "Switch Instance"}</Label>
           <SwitchInstanceIcon />
         </Row>
       {/if}
       <Row class="interactive" on:click={removeInstance}>
-        <Label>
+        <Label class="margin">
           {browser.i18n.getMessage("remove") || "Remove"}
           +
           {browser.i18n.getMessage("switchInstance") || "Switch Instance"}
@@ -135,15 +135,15 @@
       </Row>
     {:else}
       <Row class={"interactive " + (autoPicking ? "disabled" : "")} on:click={removeAndAutoPickInstance}>
-        <Label>
+        <Label class="margin">
           {browser.i18n.getMessage("remove") || "Remove"}
           +
           {browser.i18n.getMessage("autoPickInstance") || "Auto Pick Instance"}
         </Label>
         <AutoPickIcon />
       </Row>
       <Row class={"interactive " + (autoPicking ? "disabled" : "")} on:click={addAutoPickInstance}>
-        <Label>
+        <Label class="margin">
           {browser.i18n.getMessage("autoPickInstance") || "Auto Pick Instance"}
         </Label>
         <AutoPickIcon />
@@ -153,7 +153,7 @@
 
   {#if redirectToOriginal}
     <Row class="interactive" on:click={() => servicesHelper.copyRaw(url)}>
-      <Label>{browser.i18n.getMessage("copyOriginal") || "Copy Original"}</Label>
+      <Label class="margin">{browser.i18n.getMessage("copyOriginal") || "Copy Original"}</Label>
       <CopyIcon />
     </Row>
     <Row
@@ -166,7 +166,7 @@
         })
       }}
     >
-      <Label>{browser.i18n.getMessage("redirectToOriginal" || "Redirect to Original")}</Label>
+      <Label class="margin">{browser.i18n.getMessage("redirectToOriginal" || "Redirect to Original")}</Label>
       <RedirectToOriginalIcon />
     </Row>
   {/if}
@@ -195,7 +195,7 @@
         window.close()
       })}
   >
-    <Label>{browser.i18n.getMessage("settings")}</Label>
+    <Label class="margin">{browser.i18n.getMessage("settings")}</Label>
     <SettingsIcon />
   </Row>
 </div>
@@ -238,4 +238,13 @@
     margin-right: 0;
     margin-left: 5px;
   }
+
+  :global(.margin) {
+    margin-right: 5px;
+    margin-left: 0;
+  }
+  :global(.margin_rtl) {
+    margin-right: 0;
+    margin-left: 5px;
+  }
 </style>