@import '_settings.less';

.main {
  .make-row();
  padding-top: 30px;
  padding-left: 250px;
  transition: all 0.4s ease 0s;
}

.sidebar-wrapper {
  margin-top: 5em;
  margin-left: -175px;
  left: 250px;
  width: 250px;
  position: fixed;
  height: 100%;
  overflow-y: auto;
  z-index: 1000;
  transition: all 0.4s ease 0s;

}

.sidebar-nav {
  position: absolute;
  top: 0;
  width: 250px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.content {
  width: 500px;
  margin-top: 5em;
  margin-left: 4em;

  .title-image {
    max-width: 20em;
    .center-block();
  }

}

@import '_settings.less';

@sidebar-width: 280px;

.main {
  .make-row();
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.sidebar-wrapper {
  z-index: 1000;
  position: fixed;
  left: @sidebar-width;
  width: 0;
  height: 100%;
  margin-left: -1 * @sidebar-width;
  overflow-y: auto;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.sidebar-nav {
  position: absolute;
  width: @sidebar-width;
  margin-left: 2em;
}

.content-wrapper {
  width: 100%;
  position: absolute;
}

.content {
  margin-left:  1em;
  margin-right: 1em;
}

@media(min-width:768px) {
  .main {
    padding-left: @sidebar-width * .95;
  }
  .sidebar-wrapper {
    width: @sidebar-width;
  }
  .content-wrapper {
    position: relative;
    padding: 0;
    margin: 0;
  }
  .sidebar-nav {
    margin-top: 6em;
  }
  .content {
    width: 500px;
    margin-top: 6em;
    margin-right: 3em;
  }
}

Fix documentation sidebar on mobile devices
Fix documentation sidebar on mobile devices

Signed-off-by: Michael Barton <1d6e1cf70ec6f9ab28d3ea4b27a49a77654d370e@michaelbarton.me.uk>
