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.
 
 
 
 
 
 

129 lines
2.4 KiB

.modules{
height: calc(100vh - 50px);
width: 100%;
.sidebar{
height: calc(100vh - 50px);
padding: 50px;
.div-drag-container{
width: 100%;
height: 40px;
line-height: 40px;
margin: 20px 0 10px 0;
background: $grey;
border-radius: 5px;
color: white;
text-align: center;
font-size: $font-12;
.div-drag{
width: 100%;
height: 40px;
line-height: 40px;
background: $red;
color: white;
text-align: center;
font-size: $font-12;
border-radius: 5px;
cursor: grab;
}
}
}
.content{
background: $light-grey;
padding: 50px;
.dropdown{
height: 40px;
line-height: 36px;
padding: 0 10px;
background: white;
border: 2px solid $light-grey;
border-radius: 5px;
position: relative;
transition: .4s;
&.droppable{
&.drop-active{
border: 2px solid $red;
}
}
&.drop-inactive{
opacity: .4;
}
.label{
font-size: $font-12;
font-weight: bold;
color: black
}
.data{
position: absolute;
font-size: $font-10;
font-weight: bold;
color: black;
right: 10px;
top: 0;
}
&:after{
content:'\f107';
font-family: $icon;
position: absolute;
font-weight: bold;
color: $dark-grey;
top: 0;
right: -25px;
}
&.active{
border: 2px solid $grey;
&:after{
color: $grey;
}
}
}
.dropdown-links{
.link{
width: 100%;
height: 20px;
border-top: 1px solid $grey;
border-right: 1px solid $grey;
&:first-child{
border-left: 1px solid $grey;
}
&.source{
border: 0;
position: relative;
&:before{
content: '';
position: absolute;
right: 50%;
height: 100%;
border-left: 1px solid $grey;
}
}
}
}
.div-drop{
width: 100px;
padding: 10px;
margin: 20px 0 10px 0;
background: $grey;
color: white;
text-align: center;
font-size: $font-12;
border-radius: 5px;
}
}
}