Learn more  » Push, build, and install  RubyGems npm packages Python packages Maven artifacts PHP packages Go Modules Bower components Debian packages RPM packages NuGet packages

vipera-npm-registry / motif-web-admin-core   js

Repository URL to install this package:

Version: 0.3.1 

/ assets / web-admin-core-toolbar.scss

/** TOOLBAR **/

app-root nav * {
  transition: none !important;
}

  nav {
    width:2.5rem;
    /*height:calc(100% - 4rem);*/
    display:flex;
    flex-direction:column;
    overflow-x: hidden;
    overflow: hidden;
  }

  nav div {
    padding:1rem .5rem;
    font-size:.8rem;
  }
  nav a {
    display:block;
    padding:.75rem .5rem;
    position:relative;
    text-transform:uppercase;
    font-size:.7rem;
    font-family:montserrat;
    white-space:nowrap;
    display:flex;
    align-items:center;
    flex:1;
    text-decoration:none;
    max-height: 60px;
  }
  nav a svg {
    fill:currentColor;
    width:1.5rem;
    height:1.5rem;
    opacity:.3;
    position:relative;
    z-index: 99999;
  }


  nav:hover a svg {
  opacity:1;
  }

  nav a:hover {
    transform:scale(1.1);
    transform-origin:left;
    border-color:transparent;
    z-index:9999;
  }

  nav a span {
    transform:scale(0);
    white-space:nowrap;
    display:none;
    opacity:0;
    position:absolute;
    left:0;
    padding-left:40px;
    z-index: 99999;
  }

  nav a:hover span {
  transform:scale(1);
    display:flex;
    align-items:center;
    padding-right:1rem;
    opacity:.1;
    top:0;
    bottom:0;
    z-index:99999;
  }

  nav a + a {
  }

  nav a.current + a {
  border:0;
  }
  nav a.current {
    border:0;
  }
  nav a.current:hover span {
  }
  nav a.current svg {
  opacity:1;
  }

  nav a.current {
    background: $main_background_color;
  }

  nav a.current:hover span {
    background: $main_background_color;
  }


  nav div {
    background: $part_background_color;
  }

  /*
  nav a:hover {
    background: $part_background_color;
  }
  */

  nav {
    background:$nav_background_color;
  }

  nav div {
    background:$nav_background_color;
    color:$nav_color;
  }

  nav a {
    color:$nav_color;
  }

  nav a:hover {
    /*background: $nav_hover_background_color;*/
    color:$nav_hover_color;
  }

  nav a:hover span {
    background: $nav_hover_background_color;
    color:$nav_hover_color;
    box-shadow:0 0 10px $nav_a_hover_box_shadow_color;
  }

  nav a + a {
    border-top:1px solid $nav_a_a_border_color;
  }

  nav a.current {
    color:$nav_a_current_color;
    background:$nav_a_current_background_color;
  }

  nav a.current:hover span {
    background:$nav_hover_background_color;
  }

  nav a .main-menu-icon-container {
    color: $nav_color;
    /* width: 1.5rem; */
    /* height: 1.5rem; */
    /*transition: all .1s;*/
    //opacity: 1;//.3;
    position: relative;
    z-index: 2;
  padding: 0;
  }

  nav:hover a .main-menu-icon-container {
  opacity:1;
  }

  nav a:hover span {
    transform:scale(1);
    display:flex;
    align-items:center;
    padding-right:1rem;
    opacity:1; top:0;
    bottom:0;
    box-shadow:0 0 10px rgba(0,0,0,.5); z-index:1;
  }

  nav a:hover .main-menu-icon-container  {
    color: $nav_hover_color;
  }

  /*
  nav a:hover { transition:all .1s; }
  */

  .button-icon {
  padding-right: 4px;
  }


  .wc-nav-scrollbar-view {
    overflow-x: hidden;
  }

  .main-toolbar-button-tooltip {
    font-family:montserrat;
    text-transform:uppercase;
    font-size:.7rem;
    color: #dadada !important;
    opacity: 0.8 !important;
  }

  .wc-nav-scrollbar {
    height: calc(100% - 4rem) !important;
  }
    
/******* DEBUG PURPOSE ONLY ********/
/*
.wc-nav-scrollbar {
  border: solid 1px red;
}
*/

/** END TOOLBAR **/