You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@royale.apache.org by ca...@apache.org on 2020/01/10 19:12:38 UTC
[royale-asjs] branch develop updated: jewel-themes: massive changes
for flat themes
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 ae189db jewel-themes: massive changes for flat themes
ae189db is described below
commit ae189dbb4a7c1b34084b4b394dce877afc02fb56
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Fri Jan 10 20:03:41 2020 +0100
jewel-themes: massive changes for flat themes
---
.../JewelTheme/src/main/resources/defaults.css | 13 +++++++++----
.../themes/JewelTheme/src/main/sass/_mixins.sass | 10 +++++-----
.../src/main/sass/components-primary/_checkbox.sass | 9 ++++++---
.../src/main/sass/components-primary/_datagrid.sass | 8 ++++++--
.../src/main/sass/components-primary/_drawer.sass | 2 +-
.../main/sass/components-primary/_dropdownlist.sass | 21 +++++++++++----------
.../src/main/sass/components-primary/_list.sass | 2 +-
.../main/sass/components-primary/_radiobutton.sass | 9 ++++++---
.../src/main/sass/components-primary/_slider.sass | 14 +++++++-------
.../src/main/sass/components-primary/_table.sass | 4 ++--
.../main/sass/components-primary/_textinput.sass | 10 ++++++----
.../main/sass/components-primary/_topappbar.sass | 2 +-
12 files changed, 61 insertions(+), 43 deletions(-)
diff --git a/frameworks/themes/JewelTheme/src/main/resources/defaults.css b/frameworks/themes/JewelTheme/src/main/resources/defaults.css
index aaba6fc..8e45ff6 100644
--- a/frameworks/themes/JewelTheme/src/main/resources/defaults.css
+++ b/frameworks/themes/JewelTheme/src/main/resources/defaults.css
@@ -150,7 +150,6 @@ hr {
.jewel.badge {
border-radius: 500em;
- background: #d9d9d9;
color: #808080;
font-size: 0.85em !important;
line-height: 1em;
@@ -254,7 +253,8 @@ j|Card {
}
.jewel.checkbox input + span::after {
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0' y='0' width='22' height='22' fill-opacity='0'/%3E%3Cpolygon fill='%233CADF1' points='3.50018311 12.4854126 8.48547363 17.4989624 18.4641113 7.47589111 15.5010376 4.51739502 8.48547363 11.5650024 6.52087402 9.47265625'/%3E%3C/svg%3E") no-repeat center center;
- border: 1px solid transparent;
+ border: 1px solid #d9d9d9;
+ border-radius: 3px;
transition: all 0.3s ease;
transform: scale(0);
}
@@ -264,10 +264,12 @@ j|Card {
.jewel.checkbox input:focus + span::before, .jewel.checkbox input:checked:focus + span::before, .jewel.checkbox input:checked:active:focus + span::before {
background: linear-gradient(#cbe9fb, #9bd5f8);
border: 1px solid #0f88d1;
+ border-radius: 3px;
}
.jewel.checkbox input[disabled] + span::before {
background: #f3f3f3;
border: 1px solid #d9d9d9;
+ border-radius: 3px;
}
.jewel.checkbox input[disabled] + span {
color: silver;
@@ -514,17 +516,17 @@ j|Card {
.jewel.dropdownlist {
background-color: white;
+ border: 1px solid #b3b3b3;
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%233CADF1' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3 [...]
background-size: 1.08em;
background-position: right 0.7em center;
background-repeat: no-repeat;
- border: 1px solid #b3b3b3;
border-radius: 0.25rem;
}
.jewel.dropdownlist[disabled] {
background-color: #f3f3f3;
- background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23cccccc' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3 [...]
border: 1px solid #d9d9d9;
+ background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(0.000000, -1.000000)' fill='%23cccccc' fill-rule='nonzero'%3E%3Cg transform='translate(-2.000000, 0.000000)'%3E%3Cpolygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'%3E%3C/polygon%3 [...]
box-shadow: none;
color: silver;
}
@@ -754,6 +756,7 @@ j|FormItem {
.jewel.radiobutton input + span::after {
background: url("data:image/svg+xml,%3Csvg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0' y='0' width='22' height='22' fill-opacity='0'/%3E%3Ccircle fill='%233CADF1' cx='11' cy='11' r='6'/%3E%3C/svg%3E") no-repeat center center;
border: 1px solid transparent;
+ border-radius: 50%;
transition: all 0.3s ease;
transform: scale(0);
}
@@ -763,10 +766,12 @@ j|FormItem {
.jewel.radiobutton input:focus + span::before, .jewel.radiobutton input:checked:focus + span::before, .jewel.radiobutton input:checked:active:focus + span::before {
background: linear-gradient(#cbe9fb, #9bd5f8);
border: 1px solid #0f88d1;
+ border-radius: 50%;
}
.jewel.radiobutton input[disabled] + span::before {
background: #f3f3f3;
border: 1px solid #d9d9d9;
+ border-radius: 50%;
}
.jewel.radiobutton input[disabled] + span {
color: silver;
diff --git a/frameworks/themes/JewelTheme/src/main/sass/_mixins.sass b/frameworks/themes/JewelTheme/src/main/sass/_mixins.sass
index ef2d156..09e9d39 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/_mixins.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/_mixins.sass
@@ -21,7 +21,7 @@
@if ($state == "normal")
@if $flat
background: $bg-color
- border: 0px solid
+ border: 1px solid darken($bg-color, 8%)
@else
background: linear-gradient(lighten($bg-color, 5%), darken($bg-color, 5%))
border: 1px solid darken($bg-color, 15%)
@@ -31,7 +31,7 @@
@else if ($state == "hover")
@if $flat
background: darken($bg-color, 5%)
- border: 0px solid
+ border: 1px solid darken($bg-color, 8%)
@else
background: linear-gradient($bg-color, darken($bg-color, 10%))
border: 1px solid darken($bg-color, 20%)
@@ -39,7 +39,7 @@
@else if ($state == "active") or ($state == "selected")
@if $flat
background: darken($bg-color, 15%)
- border: 0px solid
+ border: 1px solid darken($bg-color, 8%)
@else
background: linear-gradient(darken($bg-color, 10%), darken($bg-color, 20%))
border: 1px solid darken($bg-color, 30%)
@@ -48,7 +48,7 @@
@else if ($state == "focus")
@if $flat
background: lighten($bg-color, 5%)
- border: 0px solid $bg-color
+ border: 1px solid darken($bg-color, 8%)
@else
border: 1px solid darken($bg-color, 15%)
box-shadow: inset 0px 0px 0px 1px rgba(lighten($bg-color, 50%), .5), inset 0 1px 0 rgba(lighten($bg-color, 55%), .6)
@@ -56,7 +56,7 @@
@else if ($state == "disabled")
@if $flat
background: $disabled-color !important
- border: 0px solid !important
+ border: 1px solid $disabled-border-color !important
@else
background: $disabled-color !important
border: 1px solid $disabled-border-color !important
diff --git a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_checkbox.sass b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_checkbox.sass
index e757ecc..6e7d409 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_checkbox.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_checkbox.sass
@@ -32,7 +32,7 @@ $checkbox-label-font-size: 16px
+ span::before
@if $flat
background: lighten($default-color, 15%)
- border: 1px solid transparent
+ border: 1px solid $default-color
@else
background: linear-gradient(lighten($default-color, 15%), lighten($default-color, 10%))
border: 1px solid darken($default-color, 15%)
@@ -40,7 +40,8 @@ $checkbox-label-font-size: 16px
+ span::after
background: encodeSVG("<svg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'><rect x='0' y='0' width='22' height='22' fill-opacity='0'/><polygon fill='#{$primary-color}' points='3.50018311 12.4854126 8.48547363 17.4989624 18.4641113 7.47589111 15.5010376 4.51739502 8.48547363 11.5650024 6.52087402 9.47265625'/></svg>") no-repeat center center
- border: 1px solid transparent
+ border: 1px solid $default-color
+ border-radius: $checkbox-border-radius
transition: all .3s ease
transform: scale(0)
@@ -55,15 +56,17 @@ $checkbox-label-font-size: 16px
@else
background: linear-gradient(lighten($primary-color, 30%), lighten($primary-color, 20%))
border: 1px solid darken($primary-color, 15%)
+ border-radius: $checkbox-border-radius
&[disabled]
& + span::before
background: $disabled-color
@if $flat
- border: 1px solid transparent
+ border: 1px solid $disabled-border-color
@else
border: 1px solid $disabled-border-color// .094em
+ border-radius: $checkbox-border-radius
& + span
color: $disabled-font-color
diff --git a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_datagrid.sass b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_datagrid.sass
index b3a49c4..f76cb14 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_datagrid.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_datagrid.sass
@@ -41,12 +41,16 @@
border-bottom-left-radius: $border-radius
border-bottom-right-radius: $border-radius
border-style: solid
- border-color: darken($default-color, 15%)
+ @if $flat
+ border-color: $default-color
+ @else
+ border-color: darken($default-color, 15%)
.jewel.list.column
border-radius: 0px
border-bottom-width: 0px
- box-shadow: inset 0px 1px 1px 0px rgba(0,0,0,0.25)
+ @if not $flat
+ box-shadow: inset 0px .5px 0px 0px rgba(0,0,0,0.25)
&.first
border-bottom-left-radius: $border-radius
diff --git a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_drawer.sass b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_drawer.sass
index 897deb6..4270818 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_drawer.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_drawer.sass
@@ -80,7 +80,7 @@ $drawer-fixed-width: 240px
.jewel.drawerheader
@if $flat
background: $primary-color
- border: 0px solid
+ border: 1px solid darken($primary-color, 8%)
@else
background: linear-gradient(lighten($primary-color, 5%), darken($primary-color, 5%))
border-bottom: 1px solid darken($primary-color, 20%)
diff --git a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_dropdownlist.sass b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_dropdownlist.sass
index fe94ceb..92171fe 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_dropdownlist.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_dropdownlist.sass
@@ -67,26 +67,26 @@ $dropdownlist-border-radius: $border-radius
// +dropdownlist-theme($default-color, $default-font-color)
@if $flat
- background: lighten($default-color, 15%)
- border: 0px solid
+ background-color: lighten($default-color, 15%)
+ border: 1px solid darken($default-color, 3%)
@else
background-color: lighten($default-color, 15%) // temporal until we fix compiler to join this on a backgroun property.
//linear-gradient(lighten($default-color, 15%), lighten($default-color, 10%)) // this in iOS doesn't work
- background-image: encodeSVG("<svg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'><g stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'><g transform='translate(0.000000, -1.000000)' fill='#{$primary-color}' fill-rule='nonzero'><g transform='translate(-2.000000, 0.000000)'><polygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'></polygon></g></g></g></svg>")
- background-size: 1.08em
- background-position: right .7em center
- background-repeat: no-repeat
border: 1px solid darken($default-color, 15%)
+ background-image: encodeSVG("<svg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'><g stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'><g transform='translate(0.000000, -1.000000)' fill='#{$primary-color}' fill-rule='nonzero'><g transform='translate(-2.000000, 0.000000)'><polygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'></polygon></g></g></g></svg>")
+ background-size: 1.08em
+ background-position: right .7em center
+ background-repeat: no-repeat
border-radius: $dropdownlist-border-radius
&[disabled]
@if $flat
- background: $disabled-color
- border: 0px solid
+ background-color: $disabled-color
+ border: 1px solid $disabled-border-color
@else
background-color: $disabled-color
- background-image: encodeSVG("<svg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'><g stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'><g transform='translate(0.000000, -1.000000)' fill='#{darken($disabled-color, 15%)}' fill-rule='nonzero'><g transform='translate(-2.000000, 0.000000)'><polygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'></polygon></g> [...]
border: 1px solid $disabled-border-color
+ background-image: encodeSVG("<svg viewBox='0 0 12 8' version='1.1' xmlns='http://www.w3.org/2000/svg'><g stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'><g transform='translate(0.000000, -1.000000)' fill='#{darken($disabled-color, 15%)}' fill-rule='nonzero'><g transform='translate(-2.000000, 0.000000)'><polygon transform='translate(8.000000, 4.705000) scale(1, -1) translate(-8.000000, -4.705000) ' points='3.41 8.41 8 3.83 12.59 8.41 14 7 8 1 2 7'></polygon></g></g> [...]
box-shadow: none
color: $disabled-font-color
@@ -105,6 +105,7 @@ $dropdownlist-border-radius: $border-radius
&:focus
@if $flat
- background: lighten($primary-color, 25%)
+ border: 1px solid $primary-color
+ // background: lighten($primary-color, 25%)
@else
border: 1px solid darken($primary-color, 15%)
\ No newline at end of file
diff --git a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_list.sass b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_list.sass
index 87a5730..34ccca9 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_list.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_list.sass
@@ -25,7 +25,7 @@ $list-border-radius: 3px
.jewel.list
@if $flat
background: lighten($default-color, 15%)
- border: 1px solid transparent
+ border: 1px solid $default-color
@else
background: linear-gradient(lighten($default-color, 15%), lighten($default-color, 10%))
border: 1px solid darken($default-color, 15%)
diff --git a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_radiobutton.sass b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_radiobutton.sass
index ba1e28e..d28f06d 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_radiobutton.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_radiobutton.sass
@@ -32,7 +32,7 @@ $radiobutton-label-font-size: 16px
+ span::before
@if $flat
background: lighten($default-color, 15%)
- border: 1px solid transparent
+ border: 1px solid $default-color
@else
background: linear-gradient(lighten($default-color, 15%), lighten($default-color, 10%))
border: 1px solid darken($default-color, 15%)
@@ -41,6 +41,7 @@ $radiobutton-label-font-size: 16px
+ span::after
background: encodeSVG("<svg viewBox='0 0 22 22' version='1.1' xmlns='http://www.w3.org/2000/svg'><rect x='0' y='0' width='22' height='22' fill-opacity='0'/><circle fill='#{$primary-color}' cx='11' cy='11' r='6'/></svg>") no-repeat center center
border: 1px solid transparent
+ border-radius: $radiobutton-border-radius
transition: all .3s ease
transform: scale(0)
@@ -51,19 +52,21 @@ $radiobutton-label-font-size: 16px
&:focus + span::before, &:checked:focus + span::before, &:checked:active:focus + span::before
@if $flat
background: lighten($primary-color, 25%)
- border: 1px solid transparent
+ border: 1px solid $primary-color
@else
background: linear-gradient(lighten($primary-color, 30%), lighten($primary-color, 20%))
border: 1px solid darken($primary-color, 15%)
+ border-radius: $radiobutton-border-radius
&[disabled]
& + span::before
background: $disabled-color
@if $flat
- border: 1px solid transparent
+ border: 1px solid $disabled-border-color
@else
border: 1px solid $disabled-border-color// .094em
+ border-radius: $radiobutton-border-radius
& + span
color: $disabled-font-color
diff --git a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_slider.sass b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_slider.sass
index 3dd5a84..46811b9 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_slider.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_slider.sass
@@ -32,7 +32,7 @@ $slider-scale-transform: 1.4
&::-ms-fill-lower
@if $flat
background: $primary-color
- border: 0
+ border: 1px solid darken($primary-color, 7%)
@else
background: linear-gradient(lighten($primary-color, 3%), darken($primary-color, 3%))
border: 1px solid darken($primary-color, 15%)
@@ -42,7 +42,7 @@ $slider-scale-transform: 1.4
&::-ms-fill-upper
@if $flat
background: lighten($default-color, 15%)
- border: 0
+ border: 1px solid lighten($default-color, 15%)
@else
background: linear-gradient(lighten($default-color, 15%), lighten($default-color, 5%))
border: 1px solid darken($default-color, 15%)
@@ -54,7 +54,7 @@ $slider-scale-transform: 1.4
height: $slider-thumb-size
@if $flat
background: $primary-color
- border: 0
+ border: 1px solid darken($primary-color, 8%)
@else
background: linear-gradient(lighten($primary-color, 3%), darken($primary-color, 3%))
border: 1px solid darken($primary-color, 15%)
@@ -66,7 +66,7 @@ $slider-scale-transform: 1.4
height: $slider-thumb-size
@if $flat
background: $primary-color
- border: 0
+ border: 1px solid darken($primary-color, 8%)
@else
background: linear-gradient(lighten($primary-color, 3%), darken($primary-color, 3%))
border: 1px solid darken($primary-color, 15%)
@@ -78,7 +78,7 @@ $slider-scale-transform: 1.4
height: $slider-thumb-size
@if $flat
background: $primary-color
- border: 0
+ border: 1px solid darken($primary-color, 8%)
@else
background: linear-gradient(lighten($primary-color, 3%), darken($primary-color, 3%))
border: 1px solid darken($primary-color, 15%)
@@ -127,7 +127,7 @@ $slider-scale-transform: 1.4
.slider-track-fill
@if $flat
background: $primary-color
- border: 0
+ border: 1px solid darken($primary-color, 7%)
@else
background: linear-gradient(lighten($primary-color, 3%), darken($primary-color, 3%))
border: 1px solid darken($primary-color, 15%)
@@ -137,7 +137,7 @@ $slider-scale-transform: 1.4
.slider-track
@if $flat
background: lighten($default-color, 15%)
- border: 0
+ border: 1px solid $default-color
@else
background: linear-gradient(lighten($default-color, 15%), lighten($default-color, 5%))
border: 1px solid darken($default-color, 15%)
diff --git a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_table.sass b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_table.sass
index e802609..9d8e131 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_table.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_table.sass
@@ -25,7 +25,7 @@ $simpletable-border-radius: $border-radius
.jewel.simpletable
@if $flat
background: lighten($default-color, 15%)
- border: 1px solid transparent
+ border: 1px solid $default-color
@else
background: linear-gradient(lighten($default-color, 15%), lighten($default-color, 10%))
border: 1px solid darken($default-color, 15%)
@@ -76,7 +76,7 @@ $table-border-radius: $border-radius
.jewel.table
@if $flat
background: lighten($default-color, 15%)
- border: 1px solid transparent
+ border: 1px solid $default-color
@else
background: linear-gradient(lighten($default-color, 15%), lighten($default-color, 10%))
border: 1px solid darken($default-color, 15%)
diff --git a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_textinput.sass b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_textinput.sass
index 6c86219..104c15e 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_textinput.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_textinput.sass
@@ -29,7 +29,7 @@ $textinput-border-radius: $border-radius
input
@if $flat
background: lighten($default-color, 15%)
- border: 0px solid
+ border: 1px solid $default-color
@else
background: linear-gradient(lighten($default-color, 15%), lighten($default-color, 10%))
border: 1px solid darken($default-color, 15%)
@@ -43,7 +43,8 @@ $textinput-border-radius: $border-radius
&:focus
@if $flat
- background: lighten($primary-color, 25%)
+ border: 1px solid $primary-color
+ // background: lighten($primary-color, 25%)
@else
border: 1px solid darken($primary-color, 15%)
@@ -98,7 +99,7 @@ $textarea-border-radius: $border-radius
textarea
@if $flat
background: lighten($default-color, 15%)
- border: 0px solid
+ border: 1px solid $default-color
@else
background: linear-gradient(lighten($default-color, 15%), lighten($default-color, 10%))
border: 1px solid darken($default-color, 15%)
@@ -112,7 +113,8 @@ $textarea-border-radius: $border-radius
&:focus
@if $flat
- background: lighten($primary-color, 25%)
+ border: 1px solid $primary-color
+ // background: lighten($primary-color, 25%)
@else
border: 1px solid darken($primary-color, 15%)
diff --git a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_topappbar.sass b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_topappbar.sass
index 82f4eb2..e21ffac 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components-primary/_topappbar.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components-primary/_topappbar.sass
@@ -30,7 +30,7 @@ $top-app-bar-button-padding: 12px
.topBarAppHeader
@if $flat
background: $primary-color
- border: 0px solid
+ border: 1px solid darken($primary-color, 8%)
@else
background: linear-gradient(lighten($primary-color, 5%), darken($primary-color, 5%))
border-top: 1px solid lighten($primary-color, 15%)