mirror of
https://github.com/slint-ui/slint.git
synced 2025-08-09 13:18:58 +00:00
6da8120dfa
* Update docs/reference/src/language/builtins/globals.md Co-authored-by: Simon Hausmann <simon.hausmann@slint.dev> * Update docs/reference/src/language/builtins/globals.md Co-authored-by: Simon Hausmann <simon.hausmann@slint.dev> * Update docs/reference/src/language/builtins/globals.md Co-authored-by: Simon Hausmann <simon.hausmann@slint.dev> * Update docs/reference/src/language/builtins/globals.md Co-authored-by: Simon Hausmann <simon.hausmann@slint.dev> * Update docs/reference/src/language/builtins/globals.md Co-authored-by: Simon Hausmann <simon.hausmann@slint.dev> --------- Co-authored-by: Florian Blasius <florian.blasius@slint-ui.com> Co-authored-by: Simon Hausmann <simon.hausmann@slint.dev> Co-authored-by: Florian Blasius <flovansl@fedora.fritz.box>
76 lines
3.3 KiB
Text
76 lines
3.3 KiB
Text
// Copyright © SixtyFPS GmbH <info@slint.dev>
|
|
// SPDX-License-Identifier: GPL-3.0-only OR LicenseRef-Slint-Royalty-free-1.1 OR LicenseRef-Slint-commercial
|
|
|
|
|
|
import { ColorSchemeSelector } from "color-scheme.slint";
|
|
|
|
// typo settings
|
|
struct TextStyle {
|
|
font-size: relative-font-size,
|
|
font-weight: int
|
|
}
|
|
|
|
export global MaterialFontSettings {
|
|
out property <TextStyle> label-large: {
|
|
font-size: 14 * 0.0625rem,
|
|
font-weight: 500
|
|
};
|
|
out property <TextStyle> label-medium: {
|
|
font-size: 12 * 0.0625rem,
|
|
font-weight: 500
|
|
};
|
|
out property <TextStyle> body-large: {
|
|
font-size: 16 * 0.0625rem,
|
|
font-weight: 400
|
|
};
|
|
out property <TextStyle> body-small: {
|
|
font-size: 12 * 0.0625rem,
|
|
font-weight: 400
|
|
};
|
|
out property <TextStyle> title-small: {
|
|
font-size: 14 * 0.0625rem,
|
|
font-weight: 500
|
|
};
|
|
}
|
|
|
|
export global Elevation {
|
|
out property <length> level0: 0px;
|
|
out property <length> level1: 1px;
|
|
out property <length> level2: 2px;
|
|
}
|
|
|
|
export global MaterialPalette {
|
|
// base palette
|
|
out property <brush> background: !root.dark-color-scheme ? #f8f3f9 : #2a282d;
|
|
out property <brush> foreground: !root.dark-color-scheme ? #1C1B1F : #E6E1E5;
|
|
out property <brush> alternate-background: !root.dark-color-scheme ? #FFFBFE : #1C1B1F;
|
|
out property <brush> alternate-foreground: !root.dark-color-scheme ? #1C1B1F : #E6E1E5;
|
|
out property <brush> control-background: !root.dark-color-scheme ? #E8DEF8 : #4A4458;
|
|
out property <brush> control-foreground: !root.dark-color-scheme ? #1E192B : #E8DEF8;
|
|
out property <brush> accent-background: !root.dark-color-scheme ? #6750A4 : #D0BCFF;
|
|
out property <brush> accent-foreground: !root.dark-color-scheme ? #FFFFFF : #371E73;
|
|
out property <brush> selection-background: !root.dark-color-scheme ? #6750A44D : #D0BCFF4D;
|
|
out property <brush> selection-foreground: !root.dark-color-scheme ? #1C1B1F : #E6E1E5;
|
|
out property <brush> border: !root.dark-color-scheme ? #79747E : #938F99;
|
|
|
|
// additional palette
|
|
out property <brush> control-background-variant: !root.dark-color-scheme ? #E7E0EC.darker(0.2) : #49454F;
|
|
out property <brush> control-foreground-variant: !root.dark-color-scheme ? #49454E : #CAC4D0;
|
|
out property <brush> control-background-tint: !root.dark-color-scheme ? #6750A4 : #D0BCFF;
|
|
out property <brush> accent-container: !root.dark-color-scheme ? #4F378B : #4F378B;
|
|
out property <brush> accent-ripple: !root.dark-color-scheme ? #D0BCFF : #6750A4;
|
|
out property <brush> shadow: #000000;
|
|
out property <brush> border-variant: !root.dark-color-scheme ? #C4C7C5 : #444746;
|
|
out property <brush> foreground-alt: !root.dark-color-scheme ? #1C1B1F : #E6E1E5;
|
|
out property <brush> secondary-ripple: !root.dark-color-scheme ? #fffc : #000000;
|
|
in-out property <bool> dark-color-scheme: ColorSchemeSelector.dark-color-scheme;
|
|
}
|
|
|
|
export global Icons {
|
|
out property <image> arrow-downward: @image-url("_arrow-downward.svg");
|
|
out property <image> arrow-drop-down: @image-url("_arrow-drop-down.svg");
|
|
out property <image> arrow-drop-up: @image-url("_arrow-drop-up.svg");
|
|
out property <image> arrow-upward: @image-url("_arrow-upward.svg");
|
|
out property <image> check-mark: @image-url("_check-mark.svg");
|
|
out property <image> expand-more: @image-url("_expand-more.svg");
|
|
}
|