From 423f372d88dbfce980730c8b170f55f2d60199dc Mon Sep 17 00:00:00 2001 From: mkpaz Date: Sun, 11 Sep 2022 08:13:44 +0400 Subject: [PATCH] Initial commit --- .gitignore | 2 + LICENSE | 21 +++++++ README.md | 10 ++++ pom.xml | 93 +++++++++++++++++++++++++++++++ src/sample-theme.scss | 124 ++++++++++++++++++++++++++++++++++++++++++ 5 files changed, 250 insertions(+) create mode 100644 .gitignore create mode 100755 LICENSE create mode 100644 README.md create mode 100755 pom.xml create mode 100644 src/sample-theme.scss diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..8b84bc4 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +/dist +/target diff --git a/LICENSE b/LICENSE new file mode 100755 index 0000000..994d1fc --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) [2022] [mkpaz] + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/README.md b/README.md new file mode 100644 index 0000000..10355f2 --- /dev/null +++ b/README.md @@ -0,0 +1,10 @@ +# AtlantaFX Sample Theme + +This is an example of creating custom JavaFX CSS theme based on [AtlantaFX](https://github.com/mkpaz/atlantafx) stylesheet. Just clone the repository and use it as a starting point for creating your own theme. + +Compile and grab resulting CSS from `dist/` directory: + +```sh +# you can also (optionally) watch for changes +mvn compile [-Pwatch] +``` diff --git a/pom.xml b/pom.xml new file mode 100755 index 0000000..6ad83f9 --- /dev/null +++ b/pom.xml @@ -0,0 +1,93 @@ + + + 4.0.0 + + io.github.mkpaz + atlantafx-sample-theme + jar + 1.0.0 + + + UTF-8 + UTF-8 + + 1.54.4 + 1.0.0 + + ${project.basedir}/src + ${project.basedir}/dist + + + + + io.github.mkpaz + atlantafx-styles + ${atlantafx.version} + + + + + + + + org.apache.maven.plugins + maven-dependency-plugin + 3.3.0 + + + unpack + generate-resources + + unpack + + + + + io.github.mkpaz + atlantafx-styles + ${atlantafx.version} + jar + true + ${project.build.directory} + + + + + + + + + us.hebi.sass + sass-cli-maven-plugin + 1.0.1 + + + ${scss.inputDir}/sample-theme.scss:${css.outputDir}/sample-theme.css + --no-source-map + + + + + run-sass + compile + + run + + + + + + + + + + watch + + true + + + + + diff --git a/src/sample-theme.scss b/src/sample-theme.scss new file mode 100644 index 0000000..049a20f --- /dev/null +++ b/src/sample-theme.scss @@ -0,0 +1,124 @@ +@use "sass:color"; + +/* + * Based on Material color palette + */ + +// modify color scale +@forward "../target/atlantafx/styles/settings/color-scale" with ( + + $dark: black, + $light: white, + + $base-0: #fafafa, + $base-1: #f5f5f5, + $base-2: #eeeeee, + $base-3: #e0e0e0, + $base-4: #bdbdbd, + $base-5: #9e9e9e, + $base-6: #757575, + $base-7: #616161, + $base-8: #424242, + $base-9: #212121, + + $accent-0: #e8eaf6, + $accent-1: #c5cae9, + $accent-2: #9fa8da, + $accent-3: #7986cb, + $accent-4: #5c6bc0, + $accent-5: #3f51b5, + $accent-6: #3949ab, + $accent-7: #303f9f, + $accent-8: #283593, + $accent-9: #1a237e, + + $success-0: #e8f5e9, + $success-1: #c8e6c9, + $success-2: #a5d6a7, + $success-3: #b5cba3, + $success-4: #81c784, + $success-5: #66bb6a, + $success-6: #4caf50, + $success-7: #388e3c, + $success-8: #2e7d32, + $success-9: #1b5e20, + + $warning-0: #fff8e1, + $warning-1: #ffecb3, + $warning-2: #ffe082, + $warning-3: #ffd54f, + $warning-4: #ffca28, + $warning-5: #ffc107, + $warning-6: #ffb300, + $warning-7: #ffa000, + $warning-8: #ff8f00, + $warning-9: #ff6f00, + + $danger-0: #fbe9e7, + $danger-1: #ffccbc, + $danger-2: #ffab91, + $danger-3: #ff8a65, + $danger-4: #ff7043, + $danger-5: #ff5722, + $danger-6: #f4511e, + $danger-7: #e64a19, + $danger-8: #d84315, + $danger-9: #bf360c +); +@use "../target/atlantafx/styles/settings/color-scale" as scale; + +// modify functional colors +@forward "../target/atlantafx/styles/settings/color-vars" with ( + + // TODO: NOT TESTED YET + + $fg-default: scale.$base-0, + $fg-muted: scale.$base-2, + $fg-subtle: scale.$base-3, + $fg-onEmphasis: scale.$light, + + $canvas-default: scale.$base-9, + $canvas-overlay: scale.$base-8, + $canvas-inset: scale.$dark, + $canvas-subtle: scale.$base-7, + + $border-default: scale.$base-6, + $border-muted: scale.$base-7, + $border-subtle: scale.$base-8, + + $neutral-emphasisPlus: scale.$base-6, + $neutral-emphasis: scale.$base-5, + $neutral-muted: color.change(scale.$base-4, $alpha: 0.4), + $neutral-subtle: color.change(scale.$base-4, $alpha: 0.1), + + $accent-fg: scale.$accent-3, + $accent-emphasis: scale.$accent-5, + $accent-muted: color.change(scale.$accent-4, $alpha: 0.4), + $accent-subtle: color.change(scale.$accent-4, $alpha: 0.15), + + $success-fg: scale.$success-3, + $success-emphasis: scale.$success-5, + $success-muted: color.change(scale.$success-4, $alpha: 0.35), + $success-subtle: color.change(scale.$success-4, $alpha: 0.15), + + $warning-fg: scale.$warning-3, + $warning-emphasis: scale.$warning-5, + $warning-muted: color.change(scale.$warning-5, $alpha: 0.35), + $warning-subtle: color.change(scale.$warning-5, $alpha: 0.15), + + $danger-fg: scale.$danger-3, + $danger-emphasis: scale.$danger-5, + $danger-muted: color.change(scale.$danger-4, $alpha: 0.35), + $danger-subtle: color.change(scale.$danger-4, $alpha: 0.15) +); + +// modify global config +// @forward "settings/config" with ( + // don't forget to signal whether it light or dark theme +// $darkMode: true +// ); + +@use "../target/atlantafx/styles/general"; + +// modify individual control settings +@use "../target/atlantafx/styles/components";