jvetrau-ds 0.2.3 → 0.2.4

package/styles.css

@@ -2208,24 +2208,122 @@
   /* motion */
 }
 
+.dropdown__menu::before {
+  /* color */
+  content: '';
+
+  /* typography */
+
+  /* size */
+  position: absolute;
+
+  /* border */
+
+  /* depth */
+
+  /* motion */
+}
+
 .dropdown--bottom-start .dropdown__menu {
+  /* color */
+
+  /* typography */
+
+  /* size */
   top: calc(100% + var(--dropdown-offset));
   left: 0;
+
+  /* border */
+
+  /* depth */
+
+  /* motion */
 }
 
 .dropdown--bottom-end .dropdown__menu {
+  /* color */
+
+  /* typography */
+
+  /* size */
   top: calc(100% + var(--dropdown-offset));
   right: 0;
+
+  /* border */
+
+  /* depth */
+
+  /* motion */
 }
 
 .dropdown--top-start .dropdown__menu {
+  /* color */
+
+  /* typography */
+
+  /* size */
   bottom: calc(100% + var(--dropdown-offset));
   left: 0;
+
+  /* border */
+
+  /* depth */
+
+  /* motion */
 }
 
 .dropdown--top-end .dropdown__menu {
+  /* color */
+
+  /* typography */
+
+  /* size */
   right: 0;
   bottom: calc(100% + var(--dropdown-offset));
+
+  /* border */
+
+  /* depth */
+
+  /* motion */
+}
+
+.dropdown--bottom-start .dropdown__menu::before,
+.dropdown--bottom-end .dropdown__menu::before {
+  /* color */
+
+  /* typography */
+
+  /* size */
+  top: calc(-1 * var(--dropdown-offset));
+  right: 0;
+  left: 0;
+  height: var(--dropdown-offset);
+
+  /* border */
+
+  /* depth */
+
+  /* motion */
+}
+
+.dropdown--top-start .dropdown__menu::before,
+.dropdown--top-end .dropdown__menu::before {
+  /* color */
+
+  /* typography */
+
+  /* size */
+  right: 0;
+  bottom: calc(-1 * var(--dropdown-offset));
+  left: 0;
+  height: var(--dropdown-offset);
+
+  /* border */
+
+  /* depth */
+
+  /* motion */
 }
 
 .dropdown__item {
@@ -2269,23 +2367,67 @@
 }
 
 .dropdown__item:hover {
+  /* color */
   background: var(--dropdown-item-bg-hover);
+
+  /* typography */
+
+  /* size */
+
+  /* border */
+
+  /* depth */
+
+  /* motion */
 }
 
 .dropdown__item--selected {
+  /* color */
   background: var(--dropdown-item-bg-selected);
   color: var(--dropdown-item-color-selected);
+
+  /* typography */
+
+  /* size */
+
+  /* border */
+
+  /* depth */
+
+  /* motion */
 }
 
 .dropdown__item--disabled,
 .dropdown__item:disabled {
+  /* color */
   color: var(--dropdown-item-color-disabled);
+
+  /* typography */
+
+  /* size */
+
+  /* border */
+
+  /* depth */
+
+  /* motion */
   cursor: not-allowed;
 }
 
 .dropdown__item--disabled:hover,
 .dropdown__item:disabled:hover {
+  /* color */
   background: transparent;
+
+  /* typography */
+
+  /* size */
+
+  /* border */
+
+  /* depth */
+
+  /* motion */
 }
 
 /* src/components/field/field.css */
@@ -4823,6 +4965,51 @@
   /* motion */
 }
 
+.header__avatar-trigger {
+  /* color */
+  background: transparent;
+  color: inherit;
+
+  /* typography */
+  font: inherit;
+
+  /* size */
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+
+  margin: 0;
+  padding: 0;
+
+  /* border */
+  border: 0;
+
+  /* depth */
+
+  /* motion */
+  cursor: pointer;
+}
+
+.header__avatar-trigger:focus-visible {
+  /* color */
+
+  /* typography */
+
+  /* size */
+
+  /* border */
+  outline:
+    var(--size-border-width-focus)
+    solid
+    currentColor;
+  outline-offset:
+    var(--size-border-offset-focus);
+
+  /* depth */
+
+  /* motion */
+}
+
 /* src/patterns/masthead/masthead.css */
 .masthead {
   /* color */