openreplay/frontend/app/styles/main.css
2022-02-22 20:06:06 +01:00

144 lines
No EOL
1.9 KiB
CSS

#app {
padding: 0;
min-height: 100%;
display: flex;
flex-direction: column;
}
* {
border-color: #EEEEEE;
}
.page {
padding-top: 50px;
}
.page-margin {
padding-top: 81px;
}
.container-fit {
margin: 0 30px 0px;
}
.container {
margin: 0 30px 30px;
}
@media only screen and (max-width: 1380px) {
.container-70 {
width: 90%;
}
}
@media only screen and (min-width: 1380px) {
.container-70 {
width: 1280px;
}
}
.container-70 {
position: relative;
margin: 0 auto;
}
.container-90 {
width: 98%;
margin: 0 auto;
}
.side-menu {
width: 250px;
height: calc(100vh - 80px);
overflow-y: auto;
padding-right: 20px;
position: fixed;
top: 81px;
&::-webkit-scrollbar {
width: 0px;
}
&:hover {
&::-webkit-scrollbar {
width: 0px;
}
}
}
.side-menu-margined {
margin-left: 260px;
}
.top-header {
margin-bottom: 25px;
/* border: dashed thin gray; */
min-height: 40px;
display: flex;
align-items: center;
justify-content: space-between;
}
.page-title {
font-size: 22px;
margin-right: 15px;
& > span {
font-weight: 300;
}
& .title {
margin-right: 15px;
& span {
color: $gray-medium;
font-weight: 300;
}
}
}
.page-title-flex {
display: flex;
align-items: center;
}
[data-hidden=true] {
display: none !important;
}
[data-disabled=true] {
pointer-events: none;
opacity: .5;
}
.form-group {
margin-bottom: 25px;
& label {
display: inline-block;
margin-bottom: 5px;
}
}
.disabled {
opacity: 0.4;
pointer-events: none;
}
.hover {
&:hover {
background-color: $active-blue;
}
}
.text-dotted-underline {
text-decoration: underline dotted !important;
}
.divider {
width: 1px;
margin: 0 15px;
background-color: $gray-light;
}
.divider-h {
height: 1px;
width: 100%;
margin: 25px 0;
background-color: $gray-light;
}