@smui/menu/bare.css

Svelte Material UI - Menu

@keyframes mdc-ripple-fg-radius-in {
  from {
    animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
  }
  to {
    transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
  }
}
@keyframes mdc-ripple-fg-opacity-in {
  from {
    animation-timing-function: linear;
    opacity: 0;
  }
  to {
    opacity: var(--mdc-ripple-fg-opacity, 0);
  }
}
@keyframes mdc-ripple-fg-opacity-out {
  from {
    animation-timing-function: linear;
    opacity: var(--mdc-ripple-fg-opacity, 0);
  }
  to {
    opacity: 0;
  }
}
.mdc-elevation-overlay {
  position: absolute;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  /* @alternate */
  opacity: var(--mdc-elevation-overlay-opacity, 0);
  transition: opacity 280ms cubic-bezier(0.4, 0, 0.2, 1);
  background-color: #fff;
  /* @alternate */
  background-color: var(--mdc-elevation-overlay-color, #fff);
}

.mdc-menu {
  min-width: 112px;
  /* @alternate */
  min-width: var(--mdc-menu-min-width, 112px);
}
.mdc-menu .mdc-deprecated-list-item__meta {
  color: rgba(0, 0, 0, 0.87);
}
.mdc-menu .mdc-deprecated-list-item__graphic {
  color: rgba(0, 0, 0, 0.87);
}
.mdc-menu .mdc-menu-item--submenu-open .mdc-deprecated-list-item__ripple::before {
  opacity: 0.04;
}
.mdc-menu .mdc-menu-item--submenu-open .mdc-list-item__ripple::before {
  opacity: 0.04;
}
.mdc-menu .mdc-deprecated-list {
  color: rgba(0, 0, 0, 0.87);
}
.mdc-menu .mdc-deprecated-list,
.mdc-menu .mdc-list {
  /* @alternate */
  position: relative;
}
.mdc-menu .mdc-deprecated-list .mdc-elevation-overlay,
.mdc-menu .mdc-list .mdc-elevation-overlay {
  width: 100%;
  height: 100%;
  top: 0;
  /* @noflip */ /*rtl:ignore*/
  left: 0;
}
.mdc-menu .mdc-deprecated-list-divider {
  margin: 8px 0;
}
.mdc-menu .mdc-deprecated-list-item {
  user-select: none;
}
.mdc-menu .mdc-deprecated-list-item--disabled {
  cursor: auto;
}
.mdc-menu a.mdc-deprecated-list-item .mdc-deprecated-list-item__text,
.mdc-menu a.mdc-deprecated-list-item .mdc-deprecated-list-item__graphic {
  pointer-events: none;
}

.mdc-menu__selection-group {
  padding: 0;
  fill: currentColor;
}
.mdc-menu__selection-group .mdc-deprecated-list-item {
  /* @noflip */ /*rtl:ignore*/
  padding-left: 56px;
  /* @noflip */ /*rtl:ignore*/
  padding-right: 16px;
}
[dir=rtl] .mdc-menu__selection-group .mdc-deprecated-list-item, .mdc-menu__selection-group .mdc-deprecated-list-item[dir=rtl] {
  /*rtl:begin:ignore*/
  /* @noflip */ /*rtl:ignore*/
  padding-left: 16px;
  /* @noflip */ /*rtl:ignore*/
  padding-right: 56px;
  /*rtl:end:ignore*/
}

.mdc-menu__selection-group .mdc-menu__selection-group-icon {
  /* @noflip */ /*rtl:ignore*/
  left: 16px;
  /* @noflip */ /*rtl:ignore*/
  right: initial;
  display: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
[dir=rtl] .mdc-menu__selection-group .mdc-menu__selection-group-icon, .mdc-menu__selection-group .mdc-menu__selection-group-icon[dir=rtl] {
  /*rtl:begin:ignore*/
  /* @noflip */ /*rtl:ignore*/
  left: initial;
  /* @noflip */ /*rtl:ignore*/
  right: 16px;
  /*rtl:end:ignore*/
}

.mdc-menu-item--selected .mdc-menu__selection-group-icon {
  display: inline;
}

.mdc-menu-surface {
  display: none;
  position: absolute;
  box-sizing: border-box;
  max-width: calc(100vw - 32px);
  /* @alternate */
  max-width: var(--mdc-menu-max-width, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  /* @alternate */
  max-height: var(--mdc-menu-max-height, calc(100vh - 32px));
  margin: 0;
  padding: 0;
  transform: scale(1);
  transform-origin: top left;
  opacity: 0;
  overflow: auto;
  will-change: transform, opacity;
  z-index: 8;
  transition: opacity 0.03s linear, transform 0.12s cubic-bezier(0, 0, 0.2, 1), height 250ms cubic-bezier(0, 0, 0.2, 1);
  /* @alternate */
  box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);
  background-color: #fff;
  /* @alternate */
  background-color: var(--mdc-theme-surface, #fff);
  color: #000;
  /* @alternate */
  color: var(--mdc-theme-on-surface, #000);
  border-radius: 4px;
  /* @alternate */
  border-radius: var(--mdc-shape-medium, 4px);
  /* @noflip */ /*rtl:ignore*/
  transform-origin-left: top left;
  /* @noflip */ /*rtl:ignore*/
  transform-origin-right: top right;
}
.mdc-menu-surface:focus {
  outline: none;
}
.mdc-menu-surface--animating-open {
  display: inline-block;
  transform: scale(0.8);
  opacity: 0;
}
.mdc-menu-surface--open {
  display: inline-block;
  transform: scale(1);
  opacity: 1;
}
.mdc-menu-surface--animating-closed {
  display: inline-block;
  opacity: 0;
  transition: opacity 0.075s linear;
}
[dir=rtl] .mdc-menu-surface, .mdc-menu-surface[dir=rtl] {
  /*rtl:begin:ignore*/
  /* @noflip */ /*rtl:ignore*/
  transform-origin-left: top right;
  /* @noflip */ /*rtl:ignore*/
  transform-origin-right: top left;
  /*rtl:end:ignore*/
}

.mdc-menu-surface--anchor {
  position: relative;
  overflow: visible;
}

.mdc-menu-surface--fixed {
  position: fixed;
}

.mdc-menu-surface--fullwidth {
  width: 100%;
}

.smui-menu-surface--static {
  position: static;
  z-index: 0;
  display: inline-block;
  transform: scale(1);
  opacity: 1;
}

.mdc-menu__selection-group .mdc-list-item__graphic.mdc-menu__selection-group-icon {
  display: none;
}

.mdc-menu-item--selected .mdc-list-item__graphic.mdc-menu__selection-group-icon {
  display: inline;
}