Drawer.scss

/* Drawer */
@import "template_mixin.scss";
.top-bar {
    position: absolute;
    z-index: 36;
    top: 0;
    left: 0;
    width: 100%;
    height: 34px;
    color: $font-color-light;
}

.esriRTL .top-bar {
    right: 0;
}
.top-bar-title{
    display:none;
    font-size:1.2em;
    overflow: hidden;
    margin-left:40px;
    margin-top:6px;
    max-width:50%;
    white-space: nowrap;
    text-overflow: ellipsis;
    @include respond-to(760){
        display:block;
    }

}
.esriRTL .top-bar-title{
    float:right;
    padding-right:10px;
}
.hamburger-button {
    position:absolute;
    top:9px;
    left:2px;
    cursor: pointer;
}

.hamburger-button:hover{
    @include opacity(0.3);
}
.esriRTL .hamburger-button {
    float:right;
    right:5px;
}

.border-container-outer {
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    border: 0;
    overflow: hidden;
}

.content-pane-left {
    width: 0px;
    max-width: $panel-width;
    height: 100%;
    padding: 0;
    margin: 0;
    border: 0;
    background: #fff;
    overflow: hidden;
    @include transition(width, 250ms, ease);

}

.app-loading .content-pane-left {
    width: 0;
}

.drawer-open .content-pane-left {
    width: 400px;
    overflow: auto;
    overflow-x: hidden;
    border-right: 1px solid $border-color;
}

.esriRTL .drawer-open .content-pane-left {
    border-right: 0;
    border-left: 1px solid $border-color;
}

.content-pane-center {
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    border: 0;
}