Просмотр исходного кода

fix(ui): stabilize dropdown menu item layout

David Hill 1 месяц назад
Родитель
Сommit
23980fb62d

+ 1 - 1
packages/app/src/components/session/session-header.tsx

@@ -364,7 +364,7 @@ export function SessionHeader() {
                             aria-label={language.t("session.header.open.menu")}
                           />
                           <DropdownMenu.Portal>
-                            <DropdownMenu.Content>
+                            <DropdownMenu.Content class="[&_[data-slot=dropdown-menu-item]]:pl-1 [&_[data-slot=dropdown-menu-radio-item]]:pl-1">
                               <DropdownMenu.Group>
                                 <DropdownMenu.GroupLabel>{language.t("session.header.openIn")}</DropdownMenu.GroupLabel>
                                 <DropdownMenu.RadioGroup

+ 9 - 0
packages/ui/src/components/dropdown-menu.css

@@ -58,6 +58,11 @@
     }
   }
 
+  [data-slot="dropdown-menu-checkbox-item"],
+  [data-slot="dropdown-menu-radio-item"] {
+    padding-right: 28px;
+  }
+
   [data-slot="dropdown-menu-sub-trigger"] {
     &[data-expanded] {
       background: var(--surface-raised-base-hover);
@@ -70,6 +75,10 @@
     justify-content: center;
     width: 16px;
     height: 16px;
+    position: absolute;
+    right: 8px;
+    top: 50%;
+    transform: translateY(-50%);
   }
 
   [data-slot="dropdown-menu-item-label"] {