165 lines
No EOL
3.8 KiB
SCSS
165 lines
No EOL
3.8 KiB
SCSS
@import "variables";
|
|
|
|
@mixin render_theme($theme) {
|
|
.uk-offcanvas {
|
|
.uk-nav > li > a {
|
|
&.active {
|
|
color: map_get(map_get($themes, $theme), 'primary');
|
|
}
|
|
}
|
|
}
|
|
|
|
.uk-logo img {
|
|
height: 38px;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.uk-button, .uk-input {
|
|
border: none;
|
|
color: map_get(map_get($themes, $theme), 'primary-text');
|
|
text-transform: none;
|
|
border-radius: 5px;
|
|
text-decoration: none;
|
|
background-color: map_get(map_get($themes, $theme), 'primary');
|
|
box-shadow: map_get(map_get($themes, $theme), 'shadow');
|
|
font-weight: bolder;
|
|
}
|
|
|
|
.uk-button-link {
|
|
color: lighten(map_get(map_get($themes, $theme), 'primary-text'), 20%);
|
|
font-weight: bolder;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.uk-card {
|
|
border-radius: 5px;
|
|
box-shadow: map_get(map_get($themes, $theme), 'shadow');
|
|
|
|
.uk-card-header {
|
|
border-bottom: 1px solid darken(map_get(map_get($themes, $theme), 'primary'), 10%)
|
|
}
|
|
|
|
.uk-card-footer {
|
|
border-top: 1px solid darken(map_get(map_get($themes, $theme), 'primary'), 10%)
|
|
}
|
|
|
|
.uk-card-title {
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
}
|
|
}
|
|
.uk-card-secondary {
|
|
background: #23272A;
|
|
}
|
|
|
|
.uk-border-circle {
|
|
box-shadow: map_get(map_get($themes, $theme), 'shadow');
|
|
}
|
|
|
|
@for $i from 1 through 6 {
|
|
.uk-h#{$i}, h#{$i} {
|
|
color: map_get(map_get($themes, $theme), 'primary-text-h')
|
|
}
|
|
}
|
|
|
|
@for $i from 10 through 100 {
|
|
@if $i % 10 == 0 {
|
|
.min-height-#{$i}vh {
|
|
min-height: #{$i}vh;
|
|
}
|
|
|
|
.max-height-#{$i}vh {
|
|
max-height: #{$i}vh;
|
|
}
|
|
|
|
.min-width-#{$i}vw {
|
|
max-width: #{$i}vw;
|
|
}
|
|
|
|
.max-width-#{$i}vw {
|
|
max-width: #{$i}vw;
|
|
}
|
|
}
|
|
}
|
|
|
|
.uk-switch {
|
|
position: relative;
|
|
display: inline-block;
|
|
height: 24px;
|
|
width: 42px;
|
|
|
|
input {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.uk-switch-slider {
|
|
background-color: rgba(0, 0, 0, 0.22);
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
border-radius: 500px;
|
|
bottom: 0;
|
|
cursor: pointer;
|
|
transition-property: background-color;
|
|
transition-duration: .05s;
|
|
box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.07);
|
|
|
|
&:before {
|
|
content: '';
|
|
background-color: #fff;
|
|
position: absolute;
|
|
width: 20px;
|
|
height: 20px;
|
|
left: 2px;
|
|
bottom: 2px;
|
|
border-radius: 50%;
|
|
transition-property: transform, box-shadow;
|
|
transition-duration: .05s;
|
|
}
|
|
}
|
|
|
|
input:checked + .uk-switch-slider {
|
|
background-color: #39f !important;
|
|
}
|
|
|
|
input:checked + .uk-switch-slider:before {
|
|
transform: translateX(18px);
|
|
}
|
|
|
|
.uk-switch-slider.uk-switch-on-off {
|
|
background-color: #f0506e;
|
|
}
|
|
input:checked + .uk-switch-slider.uk-switch-on-off {
|
|
background-color: #32d296 !important;
|
|
}
|
|
|
|
.uk-switch-slider.uk-switch-big:before {
|
|
transform: scale(1.2);
|
|
box-shadow: 0 0 6px rgba(0, 0, 0, 0.22);
|
|
}
|
|
.uk-switch-slider.uk-switch-small:before {
|
|
box-shadow: 0 0 6px rgba(0, 0, 0, 0.22);
|
|
}
|
|
input:checked + .uk-switch-slider.uk-switch-big:before {
|
|
transform: translateX(18px) scale(1.2);
|
|
}
|
|
}
|
|
|
|
html[data-theme="dark"] {
|
|
@include render_theme('dark')
|
|
}
|
|
|
|
html[data-theme="light"] {
|
|
@include render_theme('light')
|
|
}
|
|
|
|
.uk-label-success {
|
|
background-color: rgb(22, 101, 72);
|
|
}
|
|
|
|
.uk-label-warning {
|
|
background-color: rgb(145, 66, 4);
|
|
} |