fix: dropdown border and padding

nr2f1 · Dec 10, 2024 · 0be6674 · 0be6674
1 parent 389b33a
commit 0be6674
Showing 1 changed file with 6 additions and 12 deletions.
diff --git a/website/src/components/header/locale-selector.module.scss b/website/src/components/header/locale-selector.module.scss
@@ -44,12 +44,6 @@
 }
 
 .popup {
-  background-color: var(--background-primary);
-  border-radius: var(--border-radius-lg);
-  border: var(--spacing-0) solid var(--gray-300);
-  box-shadow:
-    0 12px 16px -4px rgba(16, 24, 40, 0.08),
-    0 4px 6px -2px rgba(16, 24, 40, 0.03);
   // It is important because styles are inlined
   top: var(--spacing-1) !important;
   z-index: 10;
@@ -64,11 +58,16 @@
 }
 
 .listbox {
+  background-color: var(--background-primary);
   border-radius: var(--border-radius-lg);
+  border: var(--spacing-0) solid var(--grey-300);
+  box-shadow:
+    0 12px 16px -4px rgba(16, 24, 40, 0.08),
+    0 4px 6px -2px rgba(16, 24, 40, 0.03);
   color: var(--foreground-inverse-primary);
   list-style: none;
   margin: 0;
-  padding: 0;
+  padding: var(--spacing-1) 0;
 }
 
 .option {
@@ -79,11 +78,6 @@
   padding: var(--spacing-2) var(--spacing-5);
   padding-right: calc((var(--spacing-5) * 2) + var(--spacing-2));
 
-  &:first-of-type {
-    border-top-left-radius: var(--border-radius-lg);
-    border-top-right-radius: var(--border-radius-lg);
-  }
-
   &:hover,
   &:focus {
     background-color: var(--navy-50);