react-toolbox-build4server/react-toolbox/js/menu/style.menu.css

Builds react-toolbox in such a way that it's components can be required and used in node - most likely for server-side rendered webapps - without having to depend on webpack to build your entire server-side project

.rt-menu_menu-root {
  position: relative;
  display: inline-block; }
  .rt-menu_menu-root.rt-menu_menu-top-left {
    position: absolute;
    top: 0;
    left: 0; }
    .rt-menu_menu-root.rt-menu_menu-top-left > .rt-menu_menu-outline {
      -webkit-transform-origin: 0 0;
      transform-origin: 0 0; }
  .rt-menu_menu-root.rt-menu_menu-top-right {
    position: absolute;
    top: 0;
    right: 0; }
    .rt-menu_menu-root.rt-menu_menu-top-right > .rt-menu_menu-outline {
      -webkit-transform-origin: 100% 0;
      transform-origin: 100% 0; }
  .rt-menu_menu-root.rt-menu_menu-bottom-left {
    position: absolute;
    bottom: 0;
    left: 0; }
    .rt-menu_menu-root.rt-menu_menu-bottom-left > .rt-menu_menu-outline {
      -webkit-transform-origin: 0 100%;
      transform-origin: 0 100%; }
  .rt-menu_menu-root.rt-menu_menu-bottom-right {
    position: absolute;
    right: 0;
    bottom: 0; }
    .rt-menu_menu-root.rt-menu_menu-bottom-right > .rt-menu_menu-outline {
      -webkit-transform-origin: 100% 100%;
      transform-origin: 100% 100%; }
  .rt-menu_menu-root:not(.rt-menu_menu-static) {
    z-index: 200;
    pointer-events: none; }
    .rt-menu_menu-root:not(.rt-menu_menu-static) > .rt-menu_menu-outline {
      opacity: 0;
      -webkit-transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
      transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      -webkit-transform: scale(0);
      transform: scale(0);
      will-change: transform; }
    .rt-menu_menu-root:not(.rt-menu_menu-static) > .rt-menu_menu-menu {
      position: absolute;
      top: 0;
      left: 0;
      opacity: 0; }
    .rt-menu_menu-root:not(.rt-menu_menu-static).rt-menu_menu-rippled:not(.rt-menu_menu-active) > .rt-menu_menu-outline {
      -webkit-transition-delay: 0.3s;
      transition-delay: 0.3s; }
    .rt-menu_menu-root:not(.rt-menu_menu-static).rt-menu_menu-rippled:not(.rt-menu_menu-active) > .rt-menu_menu-menu {
      -webkit-transition-delay: 0.3s;
      transition-delay: 0.3s; }
    .rt-menu_menu-root:not(.rt-menu_menu-static).rt-menu_menu-active {
      pointer-events: all; }
      .rt-menu_menu-root:not(.rt-menu_menu-static).rt-menu_menu-active > .rt-menu_menu-outline {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1); }
      .rt-menu_menu-root:not(.rt-menu_menu-static).rt-menu_menu-active > .rt-menu_menu-menu {
        opacity: 1;
        -webkit-transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), clip 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), clip 0.3s cubic-bezier(0.4, 0, 0.2, 1); }

.rt-menu_menu-outline {
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  background-color: white;
  border-radius: 0.2rem; }

.rt-menu_menu-menu {
  position: relative;
  display: block;
  padding: 0.8rem 0;
  text-align: left;
  white-space: nowrap;
  list-style: none; }