61 lines
1.1 KiB
SCSS
61 lines
1.1 KiB
SCSS
$limeThemes: light, dark;
|
|
$theme: light;
|
|
|
|
@mixin use-theme($mode: null) {
|
|
@if $mode != null {
|
|
/* #ifndef APP-ANDROID || APP-IOS || APP-NVUE || APP-HARMONY */
|
|
@media (prefers-color-scheme: $mode) {
|
|
@content;
|
|
}
|
|
/* #endif */
|
|
/* #ifdef APP-ANDROID || APP-IOS || APP-NVUE || APP-HARMONY */
|
|
&.#{$mode} {
|
|
@content;
|
|
}
|
|
/* #endif */
|
|
} @else {
|
|
@each $mode in $limeThemes {
|
|
$theme: $mode !global;
|
|
/* #ifndef APP-ANDROID || APP-IOS || APP-NVUE || APP-HARMONY */
|
|
@media (prefers-color-scheme: $mode) {
|
|
@content;
|
|
}
|
|
/* #endif */
|
|
|
|
/* #ifdef APP-ANDROID || APP-IOS || APP-NVUE || APP-HARMONY */
|
|
&.#{$mode} {
|
|
@content;
|
|
}
|
|
/* #endif */
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
@mixin theme-dark {
|
|
/* #ifndef APP-ANDROID || APP-IOS || APP-NVUE || APP-HARMONY */
|
|
@media (prefers-color-scheme: dark) {
|
|
page {
|
|
@content;
|
|
}
|
|
}
|
|
/* #endif */
|
|
/* #ifdef APP-ANDROID || APP-IOS || APP-NVUE || APP-HARMONY */
|
|
.dark {
|
|
@content;
|
|
}
|
|
/* #endif */
|
|
/* #ifdef WEB */
|
|
:root[data-lime-theme='dark'] page {
|
|
@content;
|
|
}
|
|
/* #endif */
|
|
}
|
|
|
|
|
|
@function get-var($themes, $key) {
|
|
@return map-get($themes, $key)
|
|
}
|
|
|
|
|