[royale-asjs] 42/49: textfield flat and placeholder styles

[ca...@apache.org]

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

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

commit 1faf223f6d584bb6f23be710279ebf9a48004d2b
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Sat Mar 24 19:46:46 2018 +0100

    textfield flat and placeholder styles
---
 .../src/main/sass/components/_textfield.sass       | 39 +++++++++++++++++-----
 1 file changed, 31 insertions(+), 8 deletions(-)

diff --git a/frameworks/themes/JewelTheme/src/main/sass/components/_textfield.sass b/frameworks/themes/JewelTheme/src/main/sass/components/_textfield.sass
index 6e38184..4165f6d 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components/_textfield.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components/_textfield.sass
@@ -51,20 +51,43 @@ $textfield-border-radius: 3px
 			weight: normal
 		color: $textfield-text-color
 
-		background: linear-gradient(lighten($default-color, 15%), lighten($default-color, 10%))
-		border: 1px solid darken($default-color, 15%)
+		@if $flat
+			border: 0px solid
+			background: $default-color
+		@else
+			background: linear-gradient(lighten($default-color, 15%), lighten($default-color, 10%))
+			border: 1px solid darken($default-color, 15%)
+			//box-shadow: none
 		border-radius: $textfield-border-radius
-		//transition: transition
-
-		box-shadow: none
-
+		
+		@if $transitions-enable
+		transition:
+			duration: $transition-duration
+			timing-function: $transition-timing
+		
 		&:focus
-			border: 1px solid darken($primary-color, 15%)
+			@if $flat
+				background: lighten($primary-color, 25%)
+			@else
+				border: 1px solid darken($primary-color, 15%)
 		
-		//:hover 
+		//&:hover 
 		//    padding: 5px;
 		//    background-color: #DFDFDF;
 
+		&::placeholder
+			color: lighten($textfield-text-color, 15%)
+
+		&[disabled]
+			cursor: unset
+			border: 1px solid darken($disabled-color, 20%)
+			background: $disabled-color
+			box-shadow: none
+			color: darken($disabled-color, 20%)
+			
+			&::placeholder
+				color: darken($disabled-color, 20%)
+
 .jewel.textfield
 	@if $dark
 		+textfield-theme($font-dark-color)

-- 
To stop receiving notification emails like this one, please contact
carlosrovira@apache.org.