dropdown menu more cleanup and styling

collective · Jun 28, 2024 · eb49bf6 · eb49bf6
1 parent 261b1f2
commit eb49bf6
Showing 1 changed file with 7 additions and 5 deletions.
diff --git a/packages/hydra-js/hydra.js b/packages/hydra-js/hydra.js
@@ -306,35 +306,37 @@ class Bridge {
         display: none;
         position: absolute;
         top: 100%;
-        right: -100%;
+        right: -200%;
         background: white;
         border: 1px solid #ccc;
         border-radius: 4px;
         box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
         z-index: 100;
         margin-top: -8px;
+        width: 180px;
+        box-sizing: border-box;
       }
       .volto-hydra-dropdown-menu.visible {
         display: block;
       }
       .volto-hydra-dropdown-item {
         display: flex;
-        justify-content: space-between;
+        justify-content: flex-start;
         align-items: center;
-        padding: 0.5em 1em;
+        padding: 10px;
         cursor: pointer;
         transition: background 0.2s;
       }
       .volto-hydra-dropdown-item svg {
-        margin-right: 0.5em;
+        margin-right: 1em;
       }
       .volto-hydra-dropdown-item:hover {
         background: #f0f0f0;
       }
       .volto-hydra-divider {
         height: 1px;
         background: rgba(0, 0, 0, 0.1);
-        margin: 0.5em 1em;
+        margin: 0 1em;
       }
     `;
     document.head.appendChild(style);