fix: Sidebar item menu position (#293)

RocketChat · Oct 8, 2020 · 0fead45 · 0fead45
1 parent 9ccb237
commit 0fead45
Show file tree

Hide file tree

Showing 5 changed files with 6 additions and 2 deletions.
diff --git a/packages/fuselage/.loki/reference/chrome_iphone7_Sidebar_Default.png b/packages/fuselage/.loki/reference/chrome_iphone7_Sidebar_Default.png
diff --git a/packages/fuselage/.loki/reference/chrome_iphone7_Sidebar_Item_Default.png b/packages/fuselage/.loki/reference/chrome_iphone7_Sidebar_Item_Default.png
diff --git a/packages/fuselage/.loki/reference/chrome_laptop_Sidebar_Default.png b/packages/fuselage/.loki/reference/chrome_laptop_Sidebar_Default.png
diff --git a/packages/fuselage/.loki/reference/chrome_laptop_Sidebar_Item_Default.png b/packages/fuselage/.loki/reference/chrome_laptop_Sidebar_Item_Default.png
diff --git a/packages/fuselage/src/components/Sidebar/styles.scss b/packages/fuselage/src/components/Sidebar/styles.scss
@@ -52,7 +52,7 @@ $sidebar-item-color-selected: theme('sidebar-item-color-selected', colors.foregr
   &-item {
     @extend %sidebar-base;
     padding-block: lengths.padding(4);
-    padding-inline: lengths.padding(16);
+    padding-inline-start: lengths.padding(16);
 
     color: $sidebar-item-color;
 
@@ -151,9 +151,13 @@ $sidebar-item-color-selected: theme('sidebar-item-color-selected', colors.foregr
 
     &__menu {
       position: absolute;
+
+      top: 50%;
       right: 0;
 
-      margin-block: lengths.margin(4);
+      margin-inline: lengths.margin(4);
+
+      transform: translateY(-50%);
     }
 
     &__menu-wraper {