tablet/theme.atlantafx.turquoise
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve color palette

Browse Source
This commit is contained in:
mkpaz 2022-09-17 14:26:47 +04:00
parent 423f372d88
commit ee119fdea7
1 changed files with 84 additions and 89 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

173
src/sample-theme.scss
View File

@ -1,122 +1,117 @@
@use "sass:color"; @use "sass:color";
/* /* Based on Material color palette */
* Based on Material color palette
*/
// modify color scale // modify color scale
@forward "../target/atlantafx/styles/settings/color-scale" with ( @forward "../target/atlantafx/styles/settings/color-scale" with (
$dark: black, $dark: black,
$light: white, $light: white,
$base-0: #fafafa, $base-0: #f7f7f7,
$base-1: #f5f5f5, $base-1: #f1f1f1,
$base-2: #eeeeee, $base-2: #eeeeee,
$base-3: #e0e0e0, $base-3: #e0e0e0,
$base-4: #bdbdbd, $base-4: #bdbdbd,
$base-5: #9e9e9e, $base-5: #9e9e9e,
$base-6: #757575, $base-6: #757575,
$base-7: #616161, $base-7: #616161,
$base-8: #424242, $base-8: #424242,
$base-9: #212121, $base-9: #212121,
$accent-0: #e8eaf6, $accent-0: #e8eaf6,
$accent-1: #c5cae9, $accent-1: #c5cae9,
$accent-2: #9fa8da, $accent-2: #9fa8da,
$accent-3: #7986cb, $accent-3: #7986cb,
$accent-4: #5c6bc0, $accent-4: #5c6bc0,
$accent-5: #3f51b5, $accent-5: #3f51b5,
$accent-6: #3949ab, $accent-6: #3949ab,
$accent-7: #303f9f, $accent-7: #303f9f,
$accent-8: #283593, $accent-8: #283593,
$accent-9: #1a237e, $accent-9: #1a237e,
$success-0: #e8f5e9, $success-0: #e0f2f1,
$success-1: #c8e6c9, $success-1: #b2dfdb,
$success-2: #a5d6a7, $success-2: #80cbc4,
$success-3: #b5cba3, $success-3: #4db6ac,
$success-4: #81c784, $success-4: #26a69a,
$success-5: #66bb6a, $success-5: #009688,
$success-6: #4caf50, $success-6: #00897b,
$success-7: #388e3c, $success-7: #00796b,
$success-8: #2e7d32, $success-8: #00695c,
$success-9: #1b5e20, $success-9: #004d40,
$warning-0: #fff8e1, $warning-0: #fbe9e7,
$warning-1: #ffecb3, $warning-1: #ffccbc,
$warning-2: #ffe082, $warning-2: #ffab91,
$warning-3: #ffd54f, $warning-3: #ff8a65,
$warning-4: #ffca28, $warning-4: #ff7043,
$warning-5: #ffc107, $warning-5: #ff5722,
$warning-6: #ffb300, $warning-6: #f4511e,
$warning-7: #ffa000, $warning-7: #e64a19,
$warning-8: #ff8f00, $warning-8: #d84315,
$warning-9: #ff6f00, $warning-9: #bf360c,
$danger-0: #fbe9e7, $danger-0: #fce4ec,
$danger-1: #ffccbc, $danger-1: #f8bbd0,
$danger-2: #ffab91, $danger-2: #f48fb1,
$danger-3: #ff8a65, $danger-3: #f06292,
$danger-4: #ff7043, $danger-4: #ec407a,
$danger-5: #ff5722, $danger-5: #e91e63,
$danger-6: #f4511e, $danger-6: #d81b60,
$danger-7: #e64a19, $danger-7: #c2185b,
$danger-8: #d84315, $danger-8: #ad1457,
$danger-9: #bf360c $danger-9: #880e4f
); );
@use "../target/atlantafx/styles/settings/color-scale" as scale; @use "../target/atlantafx/styles/settings/color-scale" as scale;
// modify functional colors // modify functional colors
@forward "../target/atlantafx/styles/settings/color-vars" with ( @forward "../target/atlantafx/styles/settings/color-vars" with (
// TODO: NOT TESTED YET $fg-default: scale.$base-8,
$fg-muted: scale.$base-7,
$fg-default: scale.$base-0, $fg-subtle: scale.$base-6,
$fg-muted: scale.$base-2,
$fg-subtle: scale.$base-3,
$fg-onEmphasis: scale.$light, $fg-onEmphasis: scale.$light,
$canvas-default: scale.$base-9, $canvas-default: scale.$light,
$canvas-overlay: scale.$base-8, $canvas-overlay: scale.$light,
$canvas-inset: scale.$dark, $canvas-inset: scale.$base-1,
$canvas-subtle: scale.$base-7, $canvas-subtle: scale.$base-0,
$border-default: scale.$base-6, $border-default: color.change(scale.$base-4, $alpha: 0.7),
$border-muted: scale.$base-7, $border-muted: scale.$base-3,
$border-subtle: scale.$base-8, $border-subtle: scale.$base-2,
$neutral-emphasisPlus: scale.$base-6, $neutral-emphasisPlus: scale.$base-8,
$neutral-emphasis: scale.$base-5, $neutral-emphasis: scale.$base-7,
$neutral-muted: color.change(scale.$base-4, $alpha: 0.4), $neutral-muted: scale.$base-5,
$neutral-subtle: color.change(scale.$base-4, $alpha: 0.1), $neutral-subtle: scale.$base-2,
$accent-fg: scale.$accent-3, $accent-fg: scale.$accent-5,
$accent-emphasis: scale.$accent-5, $accent-emphasis: scale.$accent-5,
$accent-muted: color.change(scale.$accent-4, $alpha: 0.4), $accent-muted: color.change(scale.$accent-4, $alpha: 0.3),
$accent-subtle: color.change(scale.$accent-4, $alpha: 0.15), $accent-subtle: color.change(scale.$accent-4, $alpha: 0.15),
$success-fg: scale.$success-3, $success-fg: scale.$success-7,
$success-emphasis: scale.$success-5, $success-emphasis: scale.$success-6,
$success-muted: color.change(scale.$success-4, $alpha: 0.35), $success-muted: color.change(scale.$success-4, $alpha: 0.3),
$success-subtle: color.change(scale.$success-4, $alpha: 0.15), $success-subtle: color.change(scale.$success-4, $alpha: 0.1),
$warning-fg: scale.$warning-3, $warning-fg: scale.$warning-7,
$warning-emphasis: scale.$warning-5, $warning-emphasis: scale.$warning-7,
$warning-muted: color.change(scale.$warning-5, $alpha: 0.35), $warning-muted: color.change(scale.$warning-5, $alpha: 0.3),
$warning-subtle: color.change(scale.$warning-5, $alpha: 0.15), $warning-subtle: color.change(scale.$warning-5, $alpha: 0.1),
$danger-fg: scale.$danger-3, $danger-fg: scale.$danger-7,
$danger-emphasis: scale.$danger-5, $danger-emphasis: scale.$danger-7,
$danger-muted: color.change(scale.$danger-4, $alpha: 0.35), $danger-muted: color.change(scale.$danger-4, $alpha: 0.3),
$danger-subtle: color.change(scale.$danger-4, $alpha: 0.15) $danger-subtle: color.change(scale.$danger-4, $alpha: 0.1)
); );
// modify global config // modify global config
// @forward "settings/config" with ( @forward "../target/atlantafx/styles/settings/config" with (
// don't forget to signal whether it light or dark theme $darkMode: false
// $darkMode: true );
// );
@use "../target/atlantafx/styles/general"; @use "../target/atlantafx/styles/general";