src/containers/drawer/style.less
.reframe-drawer {
flex: 1;
display: flex;
}
.reframe-drawer-panel {
background-color: #FFFFFF;
&.reframe-drawer-panel-left {
.translate-x-transition(-100%, 0, .25s);
left: 0;
}
&.reframe-drawer-panel-right {
.translate-x-transition(100%, 0, .25s);
right: 0;
}
position: absolute;
display: flex;
top: 0;
bottom: 0;
flex-direction: column;
@media only screen and (max-width: 380px) {
width: ~"calc(100% - 50px)";
}
@media only screen and (min-width: 381px) {
width: 320px;
}
}
.reframe-drawer-overlay {
.opacity-transition(0, 0.5, .25s);
.opacity(0.5);
background-color: #000;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}