50 lines
1.2 KiB
SCSS
50 lines
1.2 KiB
SCSS
.upload {
|
|
position: relative;
|
|
input[type=file] {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
opacity: 0;
|
|
outline: none;
|
|
&.file-draggable {
|
|
z-index: -1;
|
|
}
|
|
}
|
|
.upload-draggable {
|
|
display: inline-block;
|
|
cursor: pointer;
|
|
padding: 0.25em;
|
|
border: 1px dashed $grey-light;
|
|
border-radius: $radius-large;
|
|
&.is-disabled {
|
|
opacity: 0.5;
|
|
cursor: not-allowed;
|
|
}
|
|
&.is-loading {
|
|
position: relative;
|
|
pointer-events: none;
|
|
opacity: 0.5;
|
|
&:after {
|
|
@include loader;
|
|
top: 0;
|
|
left: calc(50% - 1.5em);
|
|
width: 3em;
|
|
height: 3em;
|
|
border-width: 0.25em;
|
|
}
|
|
}
|
|
&:hover,
|
|
&.is-hovered {
|
|
@each $name, $pair in $colors {
|
|
$color: nth($pair, 1);
|
|
&.is-#{$name} {
|
|
border-color: $color;
|
|
background: rgba($color, 0.05);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|