CSS Snippets

CSS Snippets.css

/* 1. Sidebar list slide out */

.sidebar {
  position: absolute;
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
  background-color: #313134; 
  border-left: 2px solid #202022;
  
  /* Initially Hidden */
  width: $sidebar_width;
  right: 0;
  @include transform( translate( $sidebar_width, 0px) );

  /* Transition if available */
  @include transition-property(transform);
  @include transition-duration(0.25s);
  @include transition-timing-function(ease-in-out);

  height: 100%;

  ul {
    margin: 0;
    padding: 0;
    border-top: 1px solid #202022;
    border-bottom: 1px solid #424245;
  }

  li {
    cursor: pointer;
    padding: 0.5em 0.3em 0.6em 1.0em;
    line-height: 30px;
    list-style: none;
    border-bottom: 1px solid #202022;
    border-top: 1px solid #424245;
    color: #e1e1e1;
  }
}

.sidebar-expanded {
  @include transform( translate( 0px, 0px) );
}

/* 2. Container Max-Height */

html, body {
  height: 100%;
  min-height: 100%;
}