royale-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From carlosrov...@apache.org
Subject [royale-asjs] 32/36: Preparing textfield, radio and check, but there're some bugs in compiler css that prevents to complete this task
Date Fri, 23 Mar 2018 07:57:32 GMT
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 a2aa0bc9bee3b4b4e6edaa06608ec6091e263bce
Author: Carlos Rovira <carlosrovira@apache.org>
AuthorDate: Wed Mar 21 21:42:40 2018 +0100

    Preparing textfield, radio and check, but there're some bugs in compiler css that prevents
to complete this task
---
 .../src/main/royale/TextInputPlayGround.mxml       |  4 +-
 .../royale/org/apache/royale/jewel/RadioButton.as  | 13 +++--
 .../components/{_check.sass => _checkbox.sass}     |  2 +-
 .../Jewel/src/main/sass/components/_radio.sass     | 18 -------
 .../src/main/sass/components/_radiobutton.sass}    |  2 +-
 .../Jewel/src/main/sass/components/_textfield.sass |  1 +
 .../projects/Jewel/src/main/sass/defaults.sass     |  4 +-
 .../JewelTheme/src/main/resources/defaults.css     | 33 ++++++++++--
 .../components/{_radio.sass => _checkbox.sass}     | 16 +++++-
 .../src/main/sass/components/_radiobutton.sass}    | 18 +++++--
 .../src/main/sass/components/_textfield.sass       | 58 ++++++++++++----------
 .../themes/JewelTheme/src/main/sass/defaults.sass  |  4 +-
 12 files changed, 107 insertions(+), 66 deletions(-)

diff --git a/examples/royale/JewelExample/src/main/royale/TextInputPlayGround.mxml b/examples/royale/JewelExample/src/main/royale/TextInputPlayGround.mxml
index 903bd68..83535ff 100644
--- a/examples/royale/JewelExample/src/main/royale/TextInputPlayGround.mxml
+++ b/examples/royale/JewelExample/src/main/royale/TextInputPlayGround.mxml
@@ -38,9 +38,9 @@ limitations under the License.
 	<j:TextField text="Text Input" width="120" height="40"/>
 
 	<html:H4 text="Jewel CheckBox"/>
-	<j:CheckBox/>
+	<j:CheckBox text="label"/>
 	
 	<html:H4 text="Jewel RadioButton"/>
-	<j:RadioButton/>
+	<j:RadioButton text="label"/>
 
 </js:Group>
diff --git a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/RadioButton.as
b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/RadioButton.as
index b4a8e91..fd9f037 100644
--- a/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/RadioButton.as
+++ b/frameworks/projects/Jewel/src/main/royale/org/apache/royale/jewel/RadioButton.as
@@ -61,13 +61,20 @@ package org.apache.royale.jewel
 		{
 			super(upState, overState, downState, hitTestState);
 
-            typeNames = "jewel radio"
+            typeNames = "jewel radiobutton"
 		}
     }
 
     COMPILE::JS
     public class RadioButton extends org.apache.royale.html.RadioButton
     {
+        public function RadioButton()
+		{
+			super();
+
+            typeNames = "jewel radiobutton";
+		}
+
         /**
          * @private
          * 
@@ -87,8 +94,6 @@ package org.apache.royale.jewel
          */
         override protected function createElement():WrappedHTMLElement
         {
-            
-
             icon = new RadioButtonIcon()
             icon.id = '_radio_' + org.apache.royale.jewel.RadioButton.radioCounter++;
 
@@ -101,8 +106,6 @@ package org.apache.royale.jewel
             (textNode as WrappedHTMLElement).royale_wrapper = this;
 			(icon.element as WrappedHTMLElement).royale_wrapper = this;
 
-            typeNames = 'RadioButton';
-
             return element;
         }
     }
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_check.sass b/frameworks/projects/Jewel/src/main/sass/components/_checkbox.sass
similarity index 98%
rename from frameworks/projects/Jewel/src/main/sass/components/_check.sass
rename to frameworks/projects/Jewel/src/main/sass/components/_checkbox.sass
index a4b504a..f4369fe 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_check.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_checkbox.sass
@@ -17,7 +17,7 @@
 //
 ////////////////////////////////////////////////////////////////////////////////
 
-.jewel.check
+.jewel.checkbox
 
 @media -royale-swf
 	CheckBox
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_radio.sass b/frameworks/projects/Jewel/src/main/sass/components/_radio.sass
deleted file mode 100644
index 0c6fb82..0000000
--- a/frameworks/projects/Jewel/src/main/sass/components/_radio.sass
+++ /dev/null
@@ -1,18 +0,0 @@
-////////////////////////////////////////////////////////////////////////////////
-//
-//  Licensed to the Apache Software Foundation (ASF) under one or more
-//  contributor license agreements.  See the NOTICE file distributed with
-//  this work for additional information regarding copyright ownership.
-//  The ASF licenses this file to You under the Apache License, Version 2.0
-//  (the "License"); you may not use this file except in compliance with
-//  the License.  You may obtain a copy of the License at
-//
-//      http://www.apache.org/licenses/LICENSE-2.0
-//
-//  Unless required by applicable law or agreed to in writing, software
-//  distributed under the License is distributed on an "AS IS" BASIS,
-//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-//  See the License for the specific language governing permissions and
-//  limitations under the License.
-//
-////////////////////////////////////////////////////////////////////////////////
diff --git a/frameworks/themes/JewelTheme/src/main/sass/components/_check.sass b/frameworks/projects/Jewel/src/main/sass/components/_radiobutton.sass
similarity index 98%
rename from frameworks/themes/JewelTheme/src/main/sass/components/_check.sass
rename to frameworks/projects/Jewel/src/main/sass/components/_radiobutton.sass
index 7608f63..e5ec802 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components/_check.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_radiobutton.sass
@@ -17,4 +17,4 @@
 //
 ////////////////////////////////////////////////////////////////////////////////
 
-.jewel.check
\ No newline at end of file
+.jewel.radiobutton
\ No newline at end of file
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_textfield.sass b/frameworks/projects/Jewel/src/main/sass/components/_textfield.sass
index 7742b3f..b1e8ea3 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_textfield.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_textfield.sass
@@ -22,3 +22,4 @@ TextField
 	//IBeadView: ClassReference("org.apache.royale.html.beads.TextInputWithBorderView")
 	//IBeadController: ClassReference("org.apache.royale.html.beads.controllers.EditableTextKeyboardController")
 
+.jewel.textfield
diff --git a/frameworks/projects/Jewel/src/main/sass/defaults.sass b/frameworks/projects/Jewel/src/main/sass/defaults.sass
index a113a73..dc2d096 100644
--- a/frameworks/projects/Jewel/src/main/sass/defaults.sass
+++ b/frameworks/projects/Jewel/src/main/sass/defaults.sass
@@ -22,9 +22,9 @@
 
 // Components
 @import "components/button"
-@import "components/check"
+@import "components/checkbox"
 @import "components/label"
-@import "components/radio"
+@import "components/radiobutton"
 @import "components/slider"
 @import "components/textbutton"
 @import "components/textfield"
diff --git a/frameworks/themes/JewelTheme/src/main/resources/defaults.css b/frameworks/themes/JewelTheme/src/main/resources/defaults.css
index cb1350f..5a5cc8f 100644
--- a/frameworks/themes/JewelTheme/src/main/resources/defaults.css
+++ b/frameworks/themes/JewelTheme/src/main/resources/defaults.css
@@ -173,11 +173,37 @@ span {
   cursor: unset;
 }
 
+.jewel.checkbox > input[type="checkbox"] {
+  width: 50px;
+  height: 50px;
+}
+
+.jewel.checkbox label {
+  cursor: auto;
+  position: relative;
+  display: block;
+  padding-left: 20px;
+  outline: none;
+}
+
 .jewel.label {
   font-family: "Lato", sans-serif;
   font-size: 14px;
 }
 
+.jewel.radiobutton > input[type="radio"] {
+  width: 50px;
+  height: 50px;
+}
+
+.jewel.checkbox label {
+  cursor: auto;
+  position: relative;
+  display: block;
+  padding-left: 20px;
+  outline: none;
+}
+
 .jewel.textbutton {
   cursor: pointer;
   display: inline-block;
@@ -350,9 +376,10 @@ span {
   margin: 0;
 }
 
-.jewel.textfield input {
-  font-size: 16px;
+.jewel.textfield > input {
   font-family: "Lato", sans-serif;
+  font-size: 14px;
+  font-weight: normal;
   border: none;
   border-bottom: 2px solid;
   border-bottom-color: #ff0000;
@@ -366,7 +393,7 @@ span {
   outline: none;
 }
 
-.jewel.textfield label {
+.jewel.textfield > label {
   bottom: 0;
   color: #ff0000;
   font-size: 13px;
diff --git a/frameworks/themes/JewelTheme/src/main/sass/components/_radio.sass b/frameworks/themes/JewelTheme/src/main/sass/components/_checkbox.sass
similarity index 77%
rename from frameworks/themes/JewelTheme/src/main/sass/components/_radio.sass
rename to frameworks/themes/JewelTheme/src/main/sass/components/_checkbox.sass
index 689f939..a96b39c 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components/_radio.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components/_checkbox.sass
@@ -17,4 +17,18 @@
 //
 ////////////////////////////////////////////////////////////////////////////////
 
-.jewel.radio
\ No newline at end of file
+.jewel.checkbox
+
+.jewel.checkbox 
+    > input[type="checkbox"]
+        width: 50px
+        height: 50px
+
+.jewel.checkbox
+    label
+        cursor: auto
+        position: relative
+        display: block
+        padding-left: 20px
+        outline: none
+        //font-size: @labelFontSize
\ No newline at end of file
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_textfield.sass b/frameworks/themes/JewelTheme/src/main/sass/components/_radiobutton.sass
similarity index 77%
copy from frameworks/projects/Jewel/src/main/sass/components/_textfield.sass
copy to frameworks/themes/JewelTheme/src/main/sass/components/_radiobutton.sass
index 7742b3f..00f4eb2 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_textfield.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components/_radiobutton.sass
@@ -17,8 +17,18 @@
 //
 ////////////////////////////////////////////////////////////////////////////////
 
-TextField
-	IBeadModel: ClassReference("org.apache.royale.html.beads.models.TextModel")
-	//IBeadView: ClassReference("org.apache.royale.html.beads.TextInputWithBorderView")
-	//IBeadController: ClassReference("org.apache.royale.html.beads.controllers.EditableTextKeyboardController")
+.jewel.radiobutton
 
+.jewel.radiobutton
+    > input[type="radio"]
+        width: 50px
+        height: 50px
+
+.jewel.checkbox
+    label
+        cursor: auto
+        position: relative
+        display: block
+        padding-left: 20px
+        outline: none
+        //font-size: @labelFontSize
\ No newline at end of file
diff --git a/frameworks/themes/JewelTheme/src/main/sass/components/_textfield.sass b/frameworks/themes/JewelTheme/src/main/sass/components/_textfield.sass
index d2d842a..62dcfd4 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/components/_textfield.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/components/_textfield.sass
@@ -25,35 +25,39 @@
 	max-width: 100%
 	margin: 0
 
-.jewel.textfield input
-	font-size: 16px
-	font-family: 'Lato', sans-serif
+.jewel.textfield
+	> input
+		font:
+			family: $font-stack 
+			size: $font-size
+			weight: normal
 
-	border: none
-	border-bottom: 2px solid
-	border-bottom-color: #ff0000
-	display: block
-	margin: 0
-	padding: 4 0
-	width: 100px
-	background: transparent
-	text-align: left
-	color: inherit
-	outline: none
+		border: none
+		border-bottom: 2px solid
+		border-bottom-color: #ff0000
+		display: block
+		margin: 0
+		padding: 4 0
+		width: 100px
+		background: transparent
+		text-align: left
+		color: inherit
+		outline: none
 
-.jewel.textfield label
-	bottom: 0
-	color: #ff0000
-	font-size: 13px
-	left: 0
-	right: 0
-	pointer-events: none
-	position: absolute
-	display: block
-	width: 100%
-	overflow: hidden
-	white-space: nowrap
-	text-align: left
+.jewel.textfield
+	> label
+		bottom: 0
+		color: #ff0000
+		font-size: 13px
+		left: 0
+		right: 0
+		pointer-events: none
+		position: absolute
+		display: block
+		width: 100%
+		overflow: hidden
+		white-space: nowrap
+		text-align: left
 
 //    padding: 5px;
 //    border: solid 1px #666666;
diff --git a/frameworks/themes/JewelTheme/src/main/sass/defaults.sass b/frameworks/themes/JewelTheme/src/main/sass/defaults.sass
index e377e4d..dad6b9a 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/defaults.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/defaults.sass
@@ -25,9 +25,9 @@
 
 // Components
 @import "components/button"
-@import "components/check"
+@import "components/checkbox"
 @import "components/label"
-@import "components/radio"
+@import "components/radiobutton"
 @import "components/slider"
 @import "components/textbutton"
 @import "components/textfield"

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

Mime
View raw message