[Glitch] Improve hover and focus style in columns settings

Port 900481b7fa638119b826ed888fc8eaca962ecf55 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

1 files changed, 14 insertions, 5 deletions

diff --git a/app/javascript/flavours/glitch/styles/rtl.scss b/app/javascript/flavours/glitch/styles/rtl.scss
index f6a90d271..61e95ad24 100644
--- a/app/javascript/flavours/glitch/styles/rtl.scss
+++ b/app/javascript/flavours/glitch/styles/rtl.scss
@@ -112,6 +112,20 @@ body.rtl {
 
   .column-header__setting-arrows {
     float: left;
+
+    .column-header__setting-btn {
+      &:first-child {
+        padding-left: 7px;
+        padding-right: 5px;
+      }
+
+      &:last-child {
+        padding-right: 7px;
+        padding-left: 5px;
+        margin-right: 5px;
+        margin-left: 0;
+      }
+    }
   }
 
   .setting-toggle__label {
@@ -428,11 +442,6 @@ body.rtl {
     margin-left: 5px;
   }
 
-  .column-header__setting-arrows .column-header__setting-btn:last-child {
-    padding-left: 0;
-    padding-right: 10px;
-  }
-
   .simple_form .input.radio_buttons .radio > label input {
     left: auto;
     right: 0;