[royale-asjs] branch develop updated: jewel-styles: application main color and alert color updates to get some colored main background light and desaturated based on primary color as default

[carlosrovira]

This is an automated email from the ASF dual-hosted git repository.

carlosrovira pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git


The following commit(s) were added to refs/heads/develop by this push:
     new 238dcd1  jewel-styles: application main color and alert color updates 
to get some colored main background light and desaturated based on primary 
color as default
238dcd1 is described below

commit 238dcd1d75115dc75aedd02273d0a84d97062d73
Author: Carlos Rovira <carlosrov...@apache.org>
AuthorDate: Thu Feb 20 00:14:06 2020 +0100

    jewel-styles: application main color and alert color updates to get some 
colored main background light and desaturated based on primary color as default
---
 frameworks/themes/JewelTheme/src/main/resources/defaults.css         | 4 ++--
 frameworks/themes/JewelTheme/src/main/sass/_variables.sass           | 4 ++--
 .../themes/JewelTheme/src/main/sass/components-primary/_alert.sass   | 5 ++++-
 3 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/frameworks/themes/JewelTheme/src/main/resources/defaults.css 
b/frameworks/themes/JewelTheme/src/main/resources/defaults.css
index 3cfb53c..7bc7813 100644
--- a/frameworks/themes/JewelTheme/src/main/resources/defaults.css
+++ b/frameworks/themes/JewelTheme/src/main/resources/defaults.css
@@ -17,7 +17,7 @@
 @namespace j "library://ns.apache.org/royale/jewel";
 @namespace "http://www.w3.org/1999/xhtml";;
 .jewel.application {
-  background: white;
+  background: #f5f8fa;
   font-family: "Lato", sans-serif;
   color: #808080;
   padding: 0px;
@@ -95,7 +95,7 @@ hr {
   min-width: 320px;
   min-height: 240px;
   border: 0px solid;
-  background-color: white;
+  background: white;
   box-shadow: 0px 20px 65px 0px rgba(0, 0, 0, 0.8);
   border-radius: 3px;
   opacity: 0;
diff --git a/frameworks/themes/JewelTheme/src/main/sass/_variables.sass 
b/frameworks/themes/JewelTheme/src/main/sass/_variables.sass
index 81c1946..aaea241 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/_variables.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/_variables.sass
@@ -64,6 +64,6 @@ $disabled-border-color: darken($disabled-color, 10%)
     $disabled-border-color: darken($disabled-color, 20%)
 
 // BACKGROUND
-$background-color: lighten($light-color, 45%)
+$background-color: desaturate(lighten($primary-color, 38%), 50%)
 @if $dark
-    $background-color: darken($dark-color, 35%)
\ No newline at end of file
+    $background-color: desaturate(darken($primary-color, 50%), 50%)
\ No newline at end of file
diff --git 
a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_alert.sass 
b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_alert.sass
index f8390cd..60cb315 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_alert.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_alert.sass
@@ -56,7 +56,10 @@ $alert-modal-opacity: .5
     min-height: $alert-min-height
     
     border: 0px solid
-    background-color: $background-color
+    @if $dark
+        background: lighten($background-color, 10%)
+    @else
+        background: lighten($background-color, 10%)
     box-shadow: 0px 20px 65px 0px rgba(0,0,0,0.8)
     border-radius: $alert-border-radius