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 2018/03/10 09:07:41 UTC
[royale-asjs] 10/13: wiring textbutton with variables
This is an automated email from the ASF dual-hosted git repository.
carlosrovira pushed a commit to branch jewel-ui
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git
commit 489e61764ac46d12ca35c04e7d76ef5c5c527daf
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Thu Mar 8 18:54:33 2018 +0100
wiring textbutton with variables
---
frameworks/themes/JewelTheme/pom.xml | 4 -
.../JewelTheme/src/main/resources/TextButton.css | 96 ----------------------
.../JewelTheme/src/main/resources/defaults.css | 45 +++++++++-
.../JewelTheme/src/main/sass/_textbutton.sass | 92 +++++++++++++++++++++
.../JewelTheme/src/main/sass/_variables.sass | 9 +-
.../themes/JewelTheme/src/main/sass/defaults.sass | 3 +
6 files changed, 147 insertions(+), 102 deletions(-)
diff --git a/frameworks/themes/JewelTheme/pom.xml b/frameworks/themes/JewelTheme/pom.xml
index f577bab..c431c4b 100644
--- a/frameworks/themes/JewelTheme/pom.xml
+++ b/frameworks/themes/JewelTheme/pom.xml
@@ -69,10 +69,6 @@
<path>../src/main/resources/Button.css</path>
</include-file>
<include-file>
- <name>TextButton.css</name>
- <path>../src/main/resources/TextButton.css</path>
- </include-file>
- <include-file>
<name>TextField.css</name>
<path>../src/main/resources/TextField.css</path>
</include-file>
diff --git a/frameworks/themes/JewelTheme/src/main/resources/TextButton.css b/frameworks/themes/JewelTheme/src/main/resources/TextButton.css
deleted file mode 100644
index 975a138..0000000
--- a/frameworks/themes/JewelTheme/src/main/resources/TextButton.css
+++ /dev/null
@@ -1,96 +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.
- *
- */
-
-@namespace "library://ns.apache.org/royale/jewel";
-
-/*
-* Jewel TextButton
-*/
-.textbutton, .textbutton:hover {
-
- cursor:pointer;
-
- /* Background: */
- border: none;
- border-radius: 3px;
-
- /*border:1px;*/ /*without this svg shows scaled and bigger*/
- /*border-image-source: url(assets/jewel-button.svg) ;
- border-image-slice: 4;
- border-image-width: 4;*/
-
- /*background-image: linear-gradient(#3BB0FF, #1E36FA);*/
- /*background-color: #006CEB;
- background-size: cover;
- background-repeat: no-repeat;
- background-clip: padding-box;*/
-
- /* TextField: */
- font-family: 'Lato-Bold', sans-serif;
- font-size: 14px;
- font-weight:bold;
- color: #fff;
- text-shadow: 0 1px 0 #555;
-
- padding: 10px 0px;
- display:inline-block;
- min-width: 80px;
-
- /*background: url(assets/4slicewithpattern.svg);
- background-size: cover;
- width: fit-content;
- height: fit-content;*/
- /*background: linear-gradient(#FF893B, #FA461E);
- border: 1px solid #A93116;
- border-radius: 3px;
- box-shadow: #E6B89B 0 1px 0 inset, #E6431D 0 -1px 0 inset, #aaa 0 1px 0 inset;
- */
-}
-
-.textbutton {
- background-color: #006CEB;
- transition-duration: 0.4s;
-}
-
-.textbutton:hover {
- background-color: #3389EF;
-
- /* button/large: */
- /*background: linear-gradient(#FD9958, #F76943);
- border: 1px solid #BC573C;
- line-height:16px;
- padding: 8px 16px;*/
-}
-
-.textbutton:active {
- background-color: #0056BC;
-
- /*box-shadow: #E6431D 0 1px 0 inset;
- text-shadow: 0 -1px 0 #5F3A29;*/
-}
-.textbutton:focus {
- outline: 0;
-}
-
-.textbutton[disabled] {
- background-color: #CCCCCC;
- color: #888;
- text-shadow: unset;
- cursor: unset;
-}
diff --git a/frameworks/themes/JewelTheme/src/main/resources/defaults.css b/frameworks/themes/JewelTheme/src/main/resources/defaults.css
index 29d83ac..3a2634f 100644
--- a/frameworks/themes/JewelTheme/src/main/resources/defaults.css
+++ b/frameworks/themes/JewelTheme/src/main/resources/defaults.css
@@ -30,7 +30,50 @@
body {
font: 100% "Lato-Bold", sans-serif;
- color: #333;
+ color: red;
+}
+
+/**
+ * Jewel TextButton
+ */
+.textbutton, .textbutton:hover {
+ cursor: pointer;
+ /* Background: */
+ border: none;
+ border-radius: 3px;
+ /* TextField: */
+ font-family: "Lato-Bold", sans-serif;
+ font-size: 14px;
+ font-weight: bold;
+ color: #fff;
+ text-shadow: 0 1px 0 #555;
+ padding: 10px 0px;
+ display: inline-block;
+ min-width: 80px;
+}
+
+.textbutton {
+ background-color: red;
+ transition-duration: 0.4s;
+}
+
+.textbutton:hover {
+ background-color: #3389EF;
+}
+
+.textbutton:active {
+ background-color: #0056BC;
+}
+
+.textbutton:focus {
+ outline: 0;
+}
+
+.textbutton[disabled] {
+ background-color: #CCCCCC;
+ color: #888888;
+ text-shadow: unset;
+ cursor: unset;
}
/*# sourceMappingURL=defaults.css.map */
diff --git a/frameworks/themes/JewelTheme/src/main/sass/_textbutton.sass b/frameworks/themes/JewelTheme/src/main/sass/_textbutton.sass
new file mode 100644
index 0000000..ee1c655
--- /dev/null
+++ b/frameworks/themes/JewelTheme/src/main/sass/_textbutton.sass
@@ -0,0 +1,92 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// 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.
+//
+////////////////////////////////////////////////////////////////////////////////
+
+/**
+ * Jewel TextButton
+ */
+.textbutton, .textbutton:hover
+
+ cursor: pointer
+
+ /* Background: */
+ border: none
+ border-radius: 3px
+
+ //border:1px; /*without this svg shows scaled and bigger*/
+ //border-image-source: url(assets/jewel-button.svg) ;
+ //border-image-slice: 4;
+ //border-image-width: 4;
+
+ //background-image: linear-gradient(#3BB0FF, #1E36FA);
+
+ //background-color: #006CEB;
+ //background-size: cover;
+ //background-repeat: no-repeat;
+ //background-clip: padding-box;
+
+ /* TextField: */
+ font-family: $font-stack
+ font-size: 14px
+ font-weight: bold
+ color: $font-normal-color
+ text-shadow: 0 1px 0 #555
+
+ padding: 10px 0px
+ display: inline-block
+ min-width: 80px
+
+ //background: url(assets/4slicewithpattern.svg);
+ //background-size: cover;
+ //width: fit-content;
+ //height: fit-content;
+
+ //background: linear-gradient(#FF893B, #FA461E);
+ //border: 1px solid #A93116;
+ //border-radius: 3px;
+ //box-shadow: #E6B89B 0 1px 0 inset, #E6431D 0 -1px 0 inset, #aaa 0 1px 0 inset;
+
+.textbutton
+ background-color: $primary-color
+ transition-duration: 0.4s
+
+
+.textbutton:hover
+ background-color: $hover-color
+
+ //background: linear-gradient(#FD9958, #F76943);
+ //border: 1px solid #BC573C;
+ //line-height:16px;
+ //padding: 8px 16px;
+
+.textbutton:active
+ background-color: $active-color
+
+ //box-shadow: #E6431D 0 1px 0 inset;
+ //text-shadow: 0 -1px 0 #5F3A29;
+
+.textbutton:focus
+ outline: 0
+
+
+.textbutton[disabled]
+ background-color: $disabled-color
+ color: $font-disabled-color
+ text-shadow: unset
+ cursor: unset
+
diff --git a/frameworks/themes/JewelTheme/src/main/sass/_variables.sass b/frameworks/themes/JewelTheme/src/main/sass/_variables.sass
index 33e2064..46227a0 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/_variables.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/_variables.sass
@@ -18,4 +18,11 @@
////////////////////////////////////////////////////////////////////////////////
$font-stack: 'Lato-Bold', sans-serif
-$primary-color: #333
\ No newline at end of file
+
+$primary-color: #006CEB
+$hover-color: #3389EF
+$active-color: #0056BC
+$disabled-color: #CCCCCC
+
+$font-normal-color: #fff
+$font-disabled-color: #888888
\ No newline at end of file
diff --git a/frameworks/themes/JewelTheme/src/main/sass/defaults.sass b/frameworks/themes/JewelTheme/src/main/sass/defaults.sass
index b45e844..aa62d14 100644
--- a/frameworks/themes/JewelTheme/src/main/sass/defaults.sass
+++ b/frameworks/themes/JewelTheme/src/main/sass/defaults.sass
@@ -33,3 +33,6 @@
body
font: 100% $font-stack
color: $primary-color
+
+// Components
+@import "textbutton"
\ No newline at end of file
--
To stop receiving notification emails like this one, please contact
carlosrovira@apache.org.