salix/front/core/components/dialog/style.scss

80 lines
2.0 KiB
SCSS

@import "effects";
.vn-dialog > .window {
position: relative;
& > .close {
@extend %clickable;
text-transform: uppercase;
background-color: transparent;
border: none;
border-radius: 1px;
position: absolute;
top: 0;
right: 0;
padding: 4px;
color: #666;
}
& > form {
padding: $spacing-lg;
& > h6 {
margin-bottom: $spacing-md;
}
& > .body > tpl-body {
display: block;
min-width: 256px;
}
& > .buttons > tpl-buttons {
display: block;
margin-top: 24px;
text-align: right;
button,
input[type="button"],
input[type="submit"],
input[type="reset"] {
text-transform: uppercase;
background-color: transparent;
border: none;
border-radius: 1px;
color: $color-button;
font-family: vn-font-bold;
padding: 11px;
margin: -11px;
margin-left: 11px;
&:hover,
&:focus {
color: lighten($color-button, 10%);
}
}
button {
background-color: $color-button;
color: white;
&:hover,
&:focus {
background-color: lighten($color-button, 10%);
color: white;
}
}
}
}
& > .loading-overlap {
position: absolute;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, .2);
display: flex;
align-items: center;
justify-content: center;
z-index: 1;
opacity: 0;
transition: opacity 200ms ease-in-out;
&.shown {
opacity: 1;
}
}
}