mirror of
https://github.com/slint-ui/slint.git
synced 2025-08-02 18:03:07 +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>
77 lines
3.9 KiB
Text
77 lines
3.9 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";
|
|
|
|
export struct TextStyle {
|
|
font-size: relative-font-size,
|
|
font-weight: int,
|
|
}
|
|
|
|
export global CupertinoFontSettings {
|
|
out property <int> light-font-weight: 300;
|
|
out property <int> regular-font-weight: 400;
|
|
out property <int> semibold-font-weight: 600;
|
|
|
|
out property <TextStyle> body: {
|
|
font-size: 13 * 0.0769rem,
|
|
font-weight: regular-font-weight
|
|
};
|
|
|
|
// needed?
|
|
out property <TextStyle> body-strong: {
|
|
font-size: 14 * 0.0769rem,
|
|
font-weight: semibold-font-weight
|
|
};
|
|
}
|
|
|
|
export global CupertinoPalette {
|
|
in-out property <bool> dark-color-scheme: ColorSchemeSelector.dark-color-scheme;
|
|
|
|
// base palette
|
|
out property <brush> background: dark-color-scheme ? #282828 : #ffffff;
|
|
out property <brush> foreground: dark-color-scheme ? #ffffff : #000000;
|
|
out property <brush> alternate-background: dark-color-scheme ? #2c2c2c : #00000005;
|
|
out property <brush> alternate-foreground: dark-color-scheme ? #ffffff : #000000;
|
|
out property <brush> control-background: dark-color-scheme ? #616161 : #ffffff;
|
|
out property <brush> control-foreground: dark-color-scheme ? #ffffff : #000000;
|
|
out property <brush> accent-background: dark-color-scheme ? #0055d1 : #007AFF;
|
|
out property <brush> accent-foreground: #f0f0f0;
|
|
out property <brush> selection-background: dark-color-scheme ? #0055d14D : #007AFF4D;
|
|
out property <brush> selection-foreground: dark-color-scheme ? #ffffff : #000000;
|
|
out property <brush> border: dark-color-scheme ? #ffffff26 : #00000026;
|
|
|
|
// additional palette
|
|
out property <brush> tertiary-background: dark-color-scheme ? #1e1e1e : #ffffff;
|
|
out property <brush> quaternary-background: dark-color-scheme ? #1c1c1c : #f0f0f0;
|
|
out property <brush> secondary-accent-background: dark-color-scheme ? #2076ee : #0063ea;
|
|
out property <brush> tertiary-accent-background: dark-color-scheme ? #487aff : #66A1E3;
|
|
out property <brush> foreground-neg: dark-color-scheme ? #000000 : #ffffff;
|
|
out property <brush> foreground-secondary: dark-color-scheme ? #ffffff40 : #00000040;
|
|
out property <brush> secondary-control-background: dark-color-scheme ? #7a7a7a : #f0f0f0;
|
|
out property <brush> tertiary-control-background: dark-color-scheme ? #616161B3 : #ffffffB3;
|
|
out property <brush> quaternary-control-background: dark-color-scheme ? #61616180 : #ffffff80;
|
|
out property <brush> alternate-control-background: dark-color-scheme ? #414141 : #dadada;
|
|
out property <brush> hover: dark-color-scheme ? #2e2e2e : #e3e3e3;
|
|
out property <brush> pressed: dark-color-scheme ? #b6b6b6 : #f0f0f0;
|
|
out property <brush> popup-border: dark-color-scheme ? #525252 :#0000000A;
|
|
out property <brush> decent-border: dark-color-scheme ? #ffffff14 : #00000014;
|
|
out property <brush> control-background-thumb: dark-color-scheme ? #cacaca : #ffffff;
|
|
out property <brush> separator: dark-color-scheme ? #000000 : #d9d9d9;
|
|
|
|
// FIXME: dark color
|
|
out property <brush> dimmer: @linear-gradient(180deg, #FFFFFFFF 100%, #FFFFFF00 0%);
|
|
}
|
|
|
|
export global Icons {
|
|
out property <image> arrow-down: @image-url("_arrow-down.svg");
|
|
out property <image> arrow-up: @image-url("_arrow-up.svg");
|
|
out property <image> check-mark: @image-url("_check-mark.svg");
|
|
out property <image> chevron-down: @image-url("_chevron-down.svg");
|
|
out property <image> chevron-up: @image-url("_chevron-up.svg");
|
|
out property <image> down: @image-url("_down.svg");
|
|
out property <image> dropdown: @image-url("_dropdown.svg");
|
|
out property <image> left: @image-url("_left.svg");
|
|
out property <image> right: @image-url("_right.svg");
|
|
out property <image> up: @image-url("_up.svg");
|
|
}
|