THU Hole react frontend
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

57 lines
1016 B

.sidebar-shadow {
opacity: 0;
background-color: black;
pointer-events: none;
transition: opacity 200ms ease-out;
position: fixed;
left: 0;
top: 0;
height: 100%;
width: 100%;
z-index: 20;
}
.sidebar-on .sidebar-shadow {
opacity: .3;
pointer-events: initial;
}
.sidebar {
transition: left 200ms ease-out;
position: fixed;
left: 100%;
top: 0;
height: 100%;
width: calc(100% - 700px);
padding: 1em;
background-color: rgba(255,255,255,.8);
z-index: 21;
overflow-y: auto;
}
.sidebar-on .sidebar {
left: 700px;
}
@media screen and (max-width: 1200px) {
.sidebar {
width: 550px;
}
.sidebar-on .sidebar {
left: calc(100% - 550px);
}
}
@media screen and (max-width: 600px) {
.sidebar {
width: calc(100% - 25px);
padding: 1em .5em;
}
.sidebar-on .sidebar {
left: 25px;
}
}
.sidebar-flow-item {
display: block;
}
.sidebar-flow-item .box {
width: 100%;
}