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 7e3fc97b61495798cd85c095126e5c2e91488313 Author: Carlos Rovira <[email protected]> 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 [email protected].
