310 lines
5.0 KiB
SCSS
310 lines
5.0 KiB
SCSS
// <style scoped lang="scss">
|
|
.btn-default {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
color: #444444;
|
|
font-size: 0.9rem;
|
|
padding: 0 1em;
|
|
height: 32px;
|
|
line-height: 1;
|
|
}
|
|
|
|
.btn-default:hover {
|
|
color: #00b6e3;
|
|
background-color: transparent;
|
|
border-color: transparent;
|
|
}
|
|
|
|
.c-btn-danger {
|
|
color: #dc3545;
|
|
}
|
|
|
|
.file-list {
|
|
height: 7em;
|
|
overflow: auto;
|
|
margin: 0;
|
|
// margin-right: 2em;
|
|
|
|
.file-list-item {
|
|
&:hover {
|
|
background-color: #c8f8ff;
|
|
}
|
|
}
|
|
}
|
|
|
|
.file-icon-container {
|
|
.icon {
|
|
font-size: 1.7rem;
|
|
}
|
|
}
|
|
.drop-container {
|
|
background: #fff;
|
|
border-radius: 1em;
|
|
position: absolute;
|
|
max-width: 35em;
|
|
margin: auto;
|
|
height: 20em;
|
|
left: 0;
|
|
right: 0;
|
|
top: 0;
|
|
bottom: 0;
|
|
display: flex;
|
|
pointer-events: none;
|
|
|
|
span {
|
|
border: 3px dashed #b8ecff80;
|
|
flex: 1;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
padding: 1em;
|
|
border-radius: 1em;
|
|
margin: 1.5em;
|
|
|
|
animation-name: movingBorder;
|
|
animation-duration: 2s;
|
|
animation-iteration-count: infinite;
|
|
// animation-fill-mode: forwards;
|
|
animation-direction: alternate-reverse;
|
|
}
|
|
|
|
&.replays {
|
|
left: 1em;
|
|
right: 1em;
|
|
}
|
|
|
|
@keyframes movingBorder {
|
|
from {
|
|
border: 3px dashed #b8ecff80;
|
|
}
|
|
to {
|
|
border: 3px dashed #b8ecff;
|
|
}
|
|
}
|
|
}
|
|
|
|
.dropped-list {
|
|
background: #fff;
|
|
border-radius: 1em;
|
|
position: absolute;
|
|
max-width: 35em;
|
|
margin: auto;
|
|
height: 26em;
|
|
left: 0;
|
|
right: 0;
|
|
top: 0;
|
|
bottom: 0;
|
|
padding: 1em;
|
|
overflow: auto;
|
|
z-index: 5;
|
|
box-shadow: 0px 0px 1px 1px #eee;
|
|
|
|
.uploading-animation {
|
|
background: rgba(255, 255, 255, 0.9);
|
|
border-radius: 1em;
|
|
position: absolute;
|
|
max-width: 35em;
|
|
margin: auto;
|
|
height: 26em;
|
|
left: 0;
|
|
right: 0;
|
|
top: 0;
|
|
bottom: 0;
|
|
padding: 1em;
|
|
overflow: auto;
|
|
z-index: 5;
|
|
box-shadow: 0px 0px 1px 1px #eee;
|
|
|
|
display: flex;
|
|
align-content: center;
|
|
justify-content: center;
|
|
|
|
.loading-container {
|
|
background: inherit;
|
|
}
|
|
|
|
z-index: -1;
|
|
}
|
|
|
|
&.uploading {
|
|
.uploading-animation {
|
|
z-index: 99;
|
|
}
|
|
}
|
|
|
|
&.replays {
|
|
left: 1em;
|
|
right: 1em;
|
|
}
|
|
|
|
.heading-part {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
ul {
|
|
list-style: none;
|
|
}
|
|
}
|
|
|
|
.custom-control {
|
|
padding-left: 0;
|
|
padding-right: 1.2rem;
|
|
|
|
.custom-control-input {
|
|
left: unset;
|
|
right: 0;
|
|
width: 1.2rem;
|
|
height: 1.45rem;
|
|
|
|
&:checked ~ .custom-control-label::before {
|
|
// border-color: #3DEF90;
|
|
border-color: transparent;
|
|
background-color: transparent;
|
|
}
|
|
|
|
&:checked ~ .custom-control-label::after {
|
|
background-image: url("#{$VITE_COMMON_ASSETS_URL}/img/checked.svg");
|
|
background-size: cover;
|
|
}
|
|
}
|
|
|
|
.custom-control-label::before {
|
|
border-radius: 0.45rem;
|
|
left: unset;
|
|
right: -1.2rem;
|
|
width: 1.2rem;
|
|
height: 1.2rem;
|
|
border-color: #bac4ce;
|
|
}
|
|
|
|
.custom-control-label::after {
|
|
left: unset;
|
|
right: -1.2rem;
|
|
width: 1.2rem;
|
|
height: 1.2rem;
|
|
}
|
|
}
|
|
|
|
.select-options {
|
|
height: 0;
|
|
overflow: hidden;
|
|
transition: height 0.2s;
|
|
|
|
position: absolute;
|
|
left: 0;
|
|
right: 0;
|
|
background: #fff;
|
|
z-index: 2;
|
|
top: 0.5em;
|
|
|
|
.btn {
|
|
font-size: 0.8rem;
|
|
}
|
|
|
|
&.show {
|
|
height: auto;
|
|
overflow: auto;
|
|
transition: height 0.2s;
|
|
}
|
|
}
|
|
|
|
.multiselect {
|
|
min-width: 11em;
|
|
|
|
// * {
|
|
// font-size: 0.8em;
|
|
// }
|
|
}
|
|
|
|
// mehdi
|
|
// .group-info {
|
|
// .group-description {
|
|
// max-width: 30em !important;
|
|
// }
|
|
// }
|
|
#replays {
|
|
.group-description {
|
|
// max-height: 3em;
|
|
max-height: 1.6em;
|
|
overflow: auto;
|
|
}
|
|
}
|
|
// .hiden {
|
|
// display: none;
|
|
// }
|
|
|
|
// .open {
|
|
// position: relative;
|
|
|
|
// margin: auto 5px;
|
|
|
|
// span {
|
|
// font-size: 1.4rem;
|
|
// position: relative;
|
|
// right: 8px;
|
|
|
|
// &:hover {
|
|
// border-radius: 50%;
|
|
// background-color: #bac4ce;
|
|
// color: black;
|
|
// }
|
|
// }
|
|
// }
|
|
|
|
// @media only screen and (min-width: 768px) and (max-width: 991.98px) {
|
|
// // .group-info .group-description {
|
|
// // max-width: 20em !important;
|
|
// // }
|
|
// .hiden1 {
|
|
// display: none;
|
|
// }
|
|
// }
|
|
|
|
// @media only screen and (min-width: 576px) and (max-width: 766.98px) {
|
|
// // .group-info .group-description {
|
|
// // max-width: 17em !important;
|
|
// // }
|
|
// .hiden2 {
|
|
// display: none;
|
|
// }
|
|
// }
|
|
|
|
// @media (max-width: 575.98px) {
|
|
// // .group-info .group-description {
|
|
// // max-width: 17em !important;
|
|
// // }
|
|
// .hiden3 {
|
|
// display: none;
|
|
// }
|
|
|
|
// .menu-multiselect {
|
|
// display: flex;
|
|
// width: 100%;
|
|
// height: 3rem !important;
|
|
// background-color: #fff;
|
|
// position: relative;
|
|
|
|
// align-items: center;
|
|
// flex-direction: row-reverse;
|
|
// }
|
|
|
|
// #replays {
|
|
// position: fixed;
|
|
// top: 0;
|
|
// background-color: #fff;
|
|
// z-index: 9999;
|
|
// width: 100%;
|
|
// height: 100%;
|
|
|
|
// .replay-list {
|
|
// }
|
|
|
|
// .comment-form-container {
|
|
// bottom: -1em;
|
|
// }
|
|
// }
|
|
// }
|