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/02/23 20:08:52 UTC
[royale-asjs] branch develop updated: jewel-themes: update with new
button outlined style
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 7493762 jewel-themes: update with new button outlined style
7493762 is described below
commit 7493762fc29fb28e3d03d2ca8c02a02757139c19
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Sun Feb 23 21:08:40 2020 +0100
jewel-themes: update with new button outlined style
---
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 205 +++++++++++++++++----
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 205 +++++++++++++++++----
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
.../src/main/resources/defaults.css | 63 +++++++
180 files changed, 17940 insertions(+), 1920 deletions(-)
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Amethyst-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Amethyst-Theme/defaults.css
index 5c01a61..ba6f213 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Amethyst-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Amethyst-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(201, 44, 198, 0.05);
+ border: 1px solid #9f239d;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #8a1e88;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(201, 44, 198, 0.15);
+ border: 1px solid #8a1e88;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #751a74;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #da58d8;
}
@@ -136,4 +165,38 @@
box-shadow: none;
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(201, 44, 198, 0.05);
+ border: 1px solid #9f239d;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #8a1e88;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(201, 44, 198, 0.15);
+ border: 1px solid #8a1e88;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #751a74;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Blue-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Blue-Theme/defaults.css
index 935e47d..b13a3d0 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Blue-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Blue-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(60, 173, 241, 0.05);
+ border: 1px solid #1198e9;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #0f88d1;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(60, 173, 241, 0.15);
+ border: 1px solid #0f88d1;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(60, 173, 241, 0.25);
+ border: 1px solid #0e7fc3;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #0d79ba;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #75c5f5;
}
@@ -136,4 +165,38 @@
box-shadow: none;
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(60, 173, 241, 0.05);
+ border: 1px solid #1198e9;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #0f88d1;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(60, 173, 241, 0.15);
+ border: 1px solid #0f88d1;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(60, 173, 241, 0.25);
+ border: 1px solid #0e7fc3;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #0d79ba;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(60, 173, 241, 0.25);
+ border: 1px solid #0e7fc3;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Emerald-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Emerald-Theme/defaults.css
index 116b9e6..8ae1741 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Emerald-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Emerald-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(140, 198, 60, 0.05);
+ border: 1px solid #71a02f;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #638c29;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(140, 198, 60, 0.15);
+ border: 1px solid #638c29;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(140, 198, 60, 0.25);
+ border: 1px solid #5a8126;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #557923;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #a8d46b;
}
@@ -136,4 +165,38 @@
box-shadow: none;
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(140, 198, 60, 0.05);
+ border: 1px solid #71a02f;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #638c29;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(140, 198, 60, 0.15);
+ border: 1px solid #638c29;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(140, 198, 60, 0.25);
+ border: 1px solid #5a8126;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #557923;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(140, 198, 60, 0.25);
+ border: 1px solid #5a8126;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Green-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Green-Theme/defaults.css
index 4c3982b..a16bbd7 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Green-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Green-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(58, 181, 73, 0.05);
+ border: 1px solid #2e8e39;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #277b32;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(58, 181, 73, 0.15);
+ border: 1px solid #277b32;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(58, 181, 73, 0.25);
+ border: 1px solid #246f2d;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #21682a;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #60cc6d;
}
@@ -136,4 +165,38 @@
box-shadow: none;
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(58, 181, 73, 0.05);
+ border: 1px solid #2e8e39;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #277b32;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(58, 181, 73, 0.15);
+ border: 1px solid #277b32;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(58, 181, 73, 0.25);
+ border: 1px solid #246f2d;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #21682a;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(58, 181, 73, 0.25);
+ border: 1px solid #246f2d;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Orange-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Orange-Theme/defaults.css
index 33ea575..2ed5e67 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Orange-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Orange-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(247, 148, 29, 0.05);
+ border: 1px solid #d97a08;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #c16c07;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(247, 148, 29, 0.15);
+ border: 1px solid #c16c07;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(247, 148, 29, 0.25);
+ border: 1px solid #b26406;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #a85e06;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #f9b058;
}
@@ -136,4 +165,38 @@
box-shadow: none;
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(247, 148, 29, 0.05);
+ border: 1px solid #d97a08;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #c16c07;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(247, 148, 29, 0.15);
+ border: 1px solid #c16c07;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(247, 148, 29, 0.25);
+ border: 1px solid #b26406;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #a85e06;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(247, 148, 29, 0.25);
+ border: 1px solid #b26406;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Red-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Red-Theme/defaults.css
index 53a8f38..e571a04 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Red-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Red-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(236, 28, 36, 0.05);
+ border: 1px solid #c51017;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #ad0e15;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(236, 28, 36, 0.15);
+ border: 1px solid #ad0e15;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(236, 28, 36, 0.25);
+ border: 1px solid #9f0d13;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #950d12;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #f1545a;
}
@@ -136,4 +165,38 @@
box-shadow: none;
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(236, 28, 36, 0.05);
+ border: 1px solid #c51017;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #ad0e15;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(236, 28, 36, 0.15);
+ border: 1px solid #ad0e15;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(236, 28, 36, 0.25);
+ border: 1px solid #9f0d13;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #950d12;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(236, 28, 36, 0.25);
+ border: 1px solid #9f0d13;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Sapphire-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Sapphire-Theme/defaults.css
index e3130c3..d466cae 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Sapphire-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Sapphire-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(44, 116, 190, 0.05);
+ border: 1px solid #225b95;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #1e4e80;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(44, 116, 190, 0.15);
+ border: 1px solid #1e4e80;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(44, 116, 190, 0.25);
+ border: 1px solid #1b4673;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #19416b;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #5193d7;
}
@@ -136,4 +165,38 @@
box-shadow: none;
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(44, 116, 190, 0.05);
+ border: 1px solid #225b95;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #1e4e80;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(44, 116, 190, 0.15);
+ border: 1px solid #1e4e80;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(44, 116, 190, 0.25);
+ border: 1px solid #1b4673;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #19416b;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(44, 116, 190, 0.25);
+ border: 1px solid #1b4673;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Sunflower-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Sunflower-Theme/defaults.css
index 4d7bad6..fa4e21b 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Sunflower-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Sunflower-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(248, 177, 63, 0.05);
+ border: 1px solid #f69d0e;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #e28f08;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(248, 177, 63, 0.15);
+ border: 1px solid #e28f08;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(248, 177, 63, 0.25);
+ border: 1px solid #d38508;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #ca7f07;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #fac97a;
}
@@ -136,4 +165,38 @@
box-shadow: none;
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(248, 177, 63, 0.05);
+ border: 1px solid #f69d0e;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #e28f08;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(248, 177, 63, 0.15);
+ border: 1px solid #e28f08;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(248, 177, 63, 0.25);
+ border: 1px solid #d38508;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #ca7f07;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(248, 177, 63, 0.25);
+ border: 1px solid #d38508;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Topaz-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Topaz-Theme/defaults.css
index aab573c..19a31f2 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Topaz-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Topaz-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(239, 90, 42, 0.05);
+ border: 1px solid #d64010;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #be390e;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(239, 90, 42, 0.15);
+ border: 1px solid #be390e;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(239, 90, 42, 0.25);
+ border: 1px solid #b0350d;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #a6320d;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #f38663;
}
@@ -136,4 +165,38 @@
box-shadow: none;
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(239, 90, 42, 0.05);
+ border: 1px solid #d64010;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #be390e;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(239, 90, 42, 0.15);
+ border: 1px solid #be390e;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(239, 90, 42, 0.25);
+ border: 1px solid #b0350d;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #a6320d;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(239, 90, 42, 0.25);
+ border: 1px solid #b0350d;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Turquoise-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Turquoise-Theme/defaults.css
index 49f786d..8b7e82d 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Turquoise-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Turquoise-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(41, 168, 159, 0.05);
+ border: 1px solid #1f7f78;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #1a6b65;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(41, 168, 159, 0.15);
+ border: 1px solid #1a6b65;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(41, 168, 159, 0.25);
+ border: 1px solid #175e59;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #155651;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #3ed0c6;
}
@@ -136,4 +165,38 @@
box-shadow: none;
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(41, 168, 159, 0.05);
+ border: 1px solid #1f7f78;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #1a6b65;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(41, 168, 159, 0.15);
+ border: 1px solid #1a6b65;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(41, 168, 159, 0.25);
+ border: 1px solid #175e59;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #155651;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(41, 168, 159, 0.25);
+ border: 1px solid #175e59;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Violet-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Violet-Theme/defaults.css
index 320a039..1a2f598 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Violet-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Violet-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(102, 44, 144, 0.05);
+ border: 1px solid #4a2069;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #3c1a55;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(102, 44, 144, 0.15);
+ border: 1px solid #3c1a55;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(102, 44, 144, 0.25);
+ border: 1px solid #34174a;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #2f1442;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #873abf;
}
@@ -136,4 +165,38 @@
box-shadow: none;
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(102, 44, 144, 0.05);
+ border: 1px solid #4a2069;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #3c1a55;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(102, 44, 144, 0.15);
+ border: 1px solid #3c1a55;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(102, 44, 144, 0.25);
+ border: 1px solid #34174a;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #2f1442;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(102, 44, 144, 0.25);
+ border: 1px solid #34174a;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Yellow-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Yellow-Theme/defaults.css
index 8bd62cf..57cd13c 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Yellow-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Emphasized-Yellow-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(226, 215, 11, 0.05);
+ border: 1px solid #b1a909;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #999207;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(226, 215, 11, 0.15);
+ border: 1px solid #999207;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(226, 215, 11, 0.25);
+ border: 1px solid #8a8407;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #817a06;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #f5eb35;
}
@@ -136,4 +165,38 @@
box-shadow: none;
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(226, 215, 11, 0.05);
+ border: 1px solid #b1a909;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #999207;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(226, 215, 11, 0.15);
+ border: 1px solid #999207;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(226, 215, 11, 0.25);
+ border: 1px solid #8a8407;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #817a06;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(226, 215, 11, 0.25);
+ border: 1px solid #8a8407;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Amethyst-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Amethyst-Theme/defaults.css
index 9dad98d..1d190ba 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Amethyst-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Amethyst-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -193,19 +167,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: #C92CC6;
border: 1px solid #a825a5;
@@ -236,6 +242,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(201, 44, 198, 0.05);
+ border: 1px solid #9f239d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #8a1e88;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(201, 44, 198, 0.15);
+ border: 1px solid #8a1e88;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #751a74;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1106,6 +1141,39 @@ a:active {
color: #220721;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1167,6 +1235,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: gray;
+ border: 1px solid #929292;
+ box-shadow: none;
+}
+
.jewel.togglebutton.primary {
background: #C92CC6;
border: 1px solid #a825a5;
@@ -1253,6 +1360,40 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(201, 44, 198, 0.05);
+ border: 1px solid #9f239d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #8a1e88;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(201, 44, 198, 0.15);
+ border: 1px solid #8a1e88;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #751a74;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: #8a1e88;
+ border: 1px solid #a825a5;
+ box-shadow: none;
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Blue-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Blue-Theme/defaults.css
index 4bafbd2..5e84c92 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Blue-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Blue-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -193,19 +167,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: #3CADF1;
border: 1px solid #169dee;
@@ -236,6 +242,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(60, 173, 241, 0.05);
+ border: 1px solid #1198e9;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #0f88d1;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(60, 173, 241, 0.15);
+ border: 1px solid #0f88d1;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(60, 173, 241, 0.25);
+ border: 1px solid #0e7fc3;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #0d79ba;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1106,6 +1141,39 @@ a:active {
color: #063b5b;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1167,6 +1235,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: gray;
+ border: 1px solid #929292;
+ box-shadow: none;
+}
+
.jewel.togglebutton.primary {
background: #3CADF1;
border: 1px solid #169dee;
@@ -1253,6 +1360,40 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(60, 173, 241, 0.05);
+ border: 1px solid #1198e9;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #0f88d1;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(60, 173, 241, 0.15);
+ border: 1px solid #0f88d1;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(60, 173, 241, 0.25);
+ border: 1px solid #0e7fc3;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #0d79ba;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: #0f88d1;
+ border: 1px solid #169dee;
+ box-shadow: none;
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Emerald-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Emerald-Theme/defaults.css
index 2aa2813..5daf240 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Emerald-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Emerald-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -193,19 +167,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: #8CC63C;
border: 1px solid #76a831;
@@ -236,6 +242,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(140, 198, 60, 0.05);
+ border: 1px solid #71a02f;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #638c29;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(140, 198, 60, 0.15);
+ border: 1px solid #638c29;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(140, 198, 60, 0.25);
+ border: 1px solid #5a8126;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #557923;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1106,6 +1141,39 @@ a:active {
color: #1d2a0c;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1167,6 +1235,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: gray;
+ border: 1px solid #929292;
+ box-shadow: none;
+}
+
.jewel.togglebutton.primary {
background: #8CC63C;
border: 1px solid #76a831;
@@ -1253,6 +1360,40 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(140, 198, 60, 0.05);
+ border: 1px solid #71a02f;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #638c29;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(140, 198, 60, 0.15);
+ border: 1px solid #638c29;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(140, 198, 60, 0.25);
+ border: 1px solid #5a8126;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #557923;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: #638c29;
+ border: 1px solid #76a831;
+ box-shadow: none;
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Green-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Green-Theme/defaults.css
index adad4ce..0923afa 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Green-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Green-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -193,19 +167,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: #3AB549;
border: 1px solid #30963d;
@@ -236,6 +242,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(58, 181, 73, 0.05);
+ border: 1px solid #2e8e39;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #277b32;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(58, 181, 73, 0.15);
+ border: 1px solid #277b32;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(58, 181, 73, 0.25);
+ border: 1px solid #246f2d;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #21682a;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1106,6 +1141,39 @@ a:active {
color: #081b0b;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1167,6 +1235,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: gray;
+ border: 1px solid #929292;
+ box-shadow: none;
+}
+
.jewel.togglebutton.primary {
background: #3AB549;
border: 1px solid #30963d;
@@ -1253,6 +1360,40 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(58, 181, 73, 0.05);
+ border: 1px solid #2e8e39;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #277b32;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(58, 181, 73, 0.15);
+ border: 1px solid #277b32;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(58, 181, 73, 0.25);
+ border: 1px solid #246f2d;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #21682a;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: #277b32;
+ border: 1px solid #30963d;
+ box-shadow: none;
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Orange-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Orange-Theme/defaults.css
index f441510..2b1cdb7 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Orange-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Orange-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -193,19 +167,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: #F7941D;
border: 1px solid #e38008;
@@ -236,6 +242,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(247, 148, 29, 0.05);
+ border: 1px solid #d97a08;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #c16c07;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(247, 148, 29, 0.15);
+ border: 1px solid #c16c07;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(247, 148, 29, 0.25);
+ border: 1px solid #b26406;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #a85e06;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1106,6 +1141,39 @@ a:active {
color: #462702;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1167,6 +1235,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: gray;
+ border: 1px solid #929292;
+ box-shadow: none;
+}
+
.jewel.togglebutton.primary {
background: #F7941D;
border: 1px solid #e38008;
@@ -1253,6 +1360,40 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(247, 148, 29, 0.05);
+ border: 1px solid #d97a08;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #c16c07;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(247, 148, 29, 0.15);
+ border: 1px solid #c16c07;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(247, 148, 29, 0.25);
+ border: 1px solid #b26406;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #a85e06;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: #c16c07;
+ border: 1px solid #e38008;
+ box-shadow: none;
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Red-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Red-Theme/defaults.css
index 6eabaef..cd8d663 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Red-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Red-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -193,19 +167,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: #EC1C24;
border: 1px solid #ce1118;
@@ -236,6 +242,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(236, 28, 36, 0.05);
+ border: 1px solid #c51017;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #ad0e15;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(236, 28, 36, 0.15);
+ border: 1px solid #ad0e15;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(236, 28, 36, 0.25);
+ border: 1px solid #9f0d13;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #950d12;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1106,6 +1141,39 @@ a:active {
color: #370507;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1167,6 +1235,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: gray;
+ border: 1px solid #929292;
+ box-shadow: none;
+}
+
.jewel.togglebutton.primary {
background: #EC1C24;
border: 1px solid #ce1118;
@@ -1253,6 +1360,40 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(236, 28, 36, 0.05);
+ border: 1px solid #c51017;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #ad0e15;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(236, 28, 36, 0.15);
+ border: 1px solid #ad0e15;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(236, 28, 36, 0.25);
+ border: 1px solid #9f0d13;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #950d12;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: #ad0e15;
+ border: 1px solid #ce1118;
+ box-shadow: none;
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Sapphire-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Sapphire-Theme/defaults.css
index 59d49f0..b3dac98 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Sapphire-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Sapphire-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -193,19 +167,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: #2C74BE;
border: 1px solid #24609d;
@@ -236,6 +242,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(44, 116, 190, 0.05);
+ border: 1px solid #225b95;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #1e4e80;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(44, 116, 190, 0.15);
+ border: 1px solid #1e4e80;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(44, 116, 190, 0.25);
+ border: 1px solid #1b4673;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #19416b;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1106,6 +1141,39 @@ a:active {
color: #060f18;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1167,6 +1235,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: gray;
+ border: 1px solid #929292;
+ box-shadow: none;
+}
+
.jewel.togglebutton.primary {
background: #2C74BE;
border: 1px solid #24609d;
@@ -1253,6 +1360,40 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(44, 116, 190, 0.05);
+ border: 1px solid #225b95;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #1e4e80;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(44, 116, 190, 0.15);
+ border: 1px solid #1e4e80;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(44, 116, 190, 0.25);
+ border: 1px solid #1b4673;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #19416b;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: #1e4e80;
+ border: 1px solid #24609d;
+ box-shadow: none;
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Sunflower-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Sunflower-Theme/defaults.css
index 532bdbd..a270b3a 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Sunflower-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Sunflower-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -193,19 +167,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: #F8B13F;
border: 1px solid #f7a118;
@@ -236,6 +242,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(248, 177, 63, 0.05);
+ border: 1px solid #f69d0e;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #e28f08;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(248, 177, 63, 0.15);
+ border: 1px solid #e28f08;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(248, 177, 63, 0.25);
+ border: 1px solid #d38508;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #ca7f07;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1106,6 +1141,39 @@ a:active {
color: #674104;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1167,6 +1235,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: gray;
+ border: 1px solid #929292;
+ box-shadow: none;
+}
+
.jewel.togglebutton.primary {
background: #F8B13F;
border: 1px solid #f7a118;
@@ -1253,6 +1360,40 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(248, 177, 63, 0.05);
+ border: 1px solid #f69d0e;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #e28f08;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(248, 177, 63, 0.15);
+ border: 1px solid #e28f08;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(248, 177, 63, 0.25);
+ border: 1px solid #d38508;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #ca7f07;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: #e28f08;
+ border: 1px solid #f7a118;
+ box-shadow: none;
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Topaz-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Topaz-Theme/defaults.css
index 5380b20..6f8791f 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Topaz-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Topaz-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -193,19 +167,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: #EF5A2A;
border: 1px solid #df4311;
@@ -236,6 +242,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(239, 90, 42, 0.05);
+ border: 1px solid #d64010;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #be390e;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(239, 90, 42, 0.15);
+ border: 1px solid #be390e;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(239, 90, 42, 0.25);
+ border: 1px solid #b0350d;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #a6320d;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1106,6 +1141,39 @@ a:active {
color: #481605;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1167,6 +1235,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: gray;
+ border: 1px solid #929292;
+ box-shadow: none;
+}
+
.jewel.togglebutton.primary {
background: #EF5A2A;
border: 1px solid #df4311;
@@ -1253,6 +1360,40 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(239, 90, 42, 0.05);
+ border: 1px solid #d64010;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #be390e;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(239, 90, 42, 0.15);
+ border: 1px solid #be390e;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(239, 90, 42, 0.25);
+ border: 1px solid #b0350d;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #a6320d;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: #be390e;
+ border: 1px solid #df4311;
+ box-shadow: none;
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Turquoise-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Turquoise-Theme/defaults.css
index 7b7d675..26c47a5 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Turquoise-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Turquoise-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -193,19 +167,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: #29A89F;
border: 1px solid #218780;
@@ -236,6 +242,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(41, 168, 159, 0.05);
+ border: 1px solid #1f7f78;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #1a6b65;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(41, 168, 159, 0.15);
+ border: 1px solid #1a6b65;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(41, 168, 159, 0.25);
+ border: 1px solid #175e59;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #155651;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1106,6 +1141,39 @@ a:active {
color: #010404;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1167,6 +1235,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: gray;
+ border: 1px solid #929292;
+ box-shadow: none;
+}
+
.jewel.togglebutton.primary {
background: #29A89F;
border: 1px solid #218780;
@@ -1253,6 +1360,40 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(41, 168, 159, 0.05);
+ border: 1px solid #1f7f78;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #1a6b65;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(41, 168, 159, 0.15);
+ border: 1px solid #1a6b65;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(41, 168, 159, 0.25);
+ border: 1px solid #175e59;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #155651;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: #1a6b65;
+ border: 1px solid #218780;
+ box-shadow: none;
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Violet-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Violet-Theme/defaults.css
index 305179c..5b4c204 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Violet-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Violet-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -193,19 +167,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: #662C90;
border: 1px solid #502271;
@@ -236,6 +242,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(102, 44, 144, 0.05);
+ border: 1px solid #4a2069;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #3c1a55;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(102, 44, 144, 0.15);
+ border: 1px solid #3c1a55;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(102, 44, 144, 0.25);
+ border: 1px solid #34174a;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #2f1442;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1106,6 +1141,39 @@ a:active {
color: black;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1167,6 +1235,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: gray;
+ border: 1px solid #929292;
+ box-shadow: none;
+}
+
.jewel.togglebutton.primary {
background: #662C90;
border: 1px solid #502271;
@@ -1253,6 +1360,40 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(102, 44, 144, 0.05);
+ border: 1px solid #4a2069;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #3c1a55;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(102, 44, 144, 0.15);
+ border: 1px solid #3c1a55;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(102, 44, 144, 0.25);
+ border: 1px solid #34174a;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #2f1442;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: #3c1a55;
+ border: 1px solid #502271;
+ box-shadow: none;
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Yellow-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Yellow-Theme/defaults.css
index a6c77de..7690ee7 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Yellow-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Primary-Yellow-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -193,19 +167,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: #E2D70B;
border: 1px solid #bbb209;
@@ -236,6 +242,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(226, 215, 11, 0.05);
+ border: 1px solid #b1a909;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #999207;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(226, 215, 11, 0.15);
+ border: 1px solid #999207;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(226, 215, 11, 0.25);
+ border: 1px solid #8a8407;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #817a06;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1106,6 +1141,39 @@ a:active {
color: #1f1e02;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1167,6 +1235,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: #d9d9d9;
border: 1px solid #c5c5c5;
box-shadow: none;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: gray;
+ border: 1px solid #929292;
+ box-shadow: none;
+}
+
.jewel.togglebutton.primary {
background: #E2D70B;
border: 1px solid #bbb209;
@@ -1253,6 +1360,40 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(226, 215, 11, 0.05);
+ border: 1px solid #b1a909;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #999207;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(226, 215, 11, 0.15);
+ border: 1px solid #999207;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(226, 215, 11, 0.25);
+ border: 1px solid #8a8407;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #817a06;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: #999207;
+ border: 1px solid #bbb209;
+ box-shadow: none;
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Amethyst-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Amethyst-Theme/defaults.css
index 0631fd0..a557fc0 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Amethyst-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Amethyst-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.secondary.outlined {
+ background: rgba(201, 44, 198, 0.05);
+ border: 1px solid #9f239d;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #8a1e88;
+ text-shadow: none;
+}
+.jewel.button.secondary.outlined:hover, .jewel.button.secondary.outlined:hover:focus {
+ background: rgba(201, 44, 198, 0.15);
+ border: 1px solid #8a1e88;
+}
+.jewel.button.secondary.outlined:active, .jewel.button.secondary.outlined:active:focus {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined:focus {
+ border: 1px solid #751a74;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.secondary.hovered {
background: #da58d8;
}
@@ -148,4 +177,38 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.secondary.outlined {
+ background: rgba(201, 44, 198, 0.05);
+ border: 1px solid #9f239d;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #8a1e88;
+ text-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:hover, .jewel.togglebutton.secondary.outlined:hover:focus {
+ background: rgba(201, 44, 198, 0.15);
+ border: 1px solid #8a1e88;
+}
+.jewel.togglebutton.secondary.outlined:active, .jewel.togglebutton.secondary.outlined:active:focus {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:focus {
+ border: 1px solid #751a74;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.secondary.outlined.selected {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Blue-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Blue-Theme/defaults.css
index aaec492..67633dc 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Blue-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Blue-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.secondary.outlined {
+ background: rgba(60, 173, 241, 0.05);
+ border: 1px solid #1198e9;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #0f88d1;
+ text-shadow: none;
+}
+.jewel.button.secondary.outlined:hover, .jewel.button.secondary.outlined:hover:focus {
+ background: rgba(60, 173, 241, 0.15);
+ border: 1px solid #0f88d1;
+}
+.jewel.button.secondary.outlined:active, .jewel.button.secondary.outlined:active:focus {
+ background: rgba(60, 173, 241, 0.25);
+ border: 1px solid #0e7fc3;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined:focus {
+ border: 1px solid #0d79ba;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.secondary.hovered {
background: #75c5f5;
}
@@ -148,4 +177,38 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.secondary.outlined {
+ background: rgba(60, 173, 241, 0.05);
+ border: 1px solid #1198e9;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #0f88d1;
+ text-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:hover, .jewel.togglebutton.secondary.outlined:hover:focus {
+ background: rgba(60, 173, 241, 0.15);
+ border: 1px solid #0f88d1;
+}
+.jewel.togglebutton.secondary.outlined:active, .jewel.togglebutton.secondary.outlined:active:focus {
+ background: rgba(60, 173, 241, 0.25);
+ border: 1px solid #0e7fc3;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:focus {
+ border: 1px solid #0d79ba;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.secondary.outlined.selected {
+ background: rgba(60, 173, 241, 0.25);
+ border: 1px solid #0e7fc3;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Emerald-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Emerald-Theme/defaults.css
index a89e91d..bcb91e3 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Emerald-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Emerald-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.secondary.outlined {
+ background: rgba(140, 198, 60, 0.05);
+ border: 1px solid #71a02f;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #638c29;
+ text-shadow: none;
+}
+.jewel.button.secondary.outlined:hover, .jewel.button.secondary.outlined:hover:focus {
+ background: rgba(140, 198, 60, 0.15);
+ border: 1px solid #638c29;
+}
+.jewel.button.secondary.outlined:active, .jewel.button.secondary.outlined:active:focus {
+ background: rgba(140, 198, 60, 0.25);
+ border: 1px solid #5a8126;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined:focus {
+ border: 1px solid #557923;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.secondary.hovered {
background: #a8d46b;
}
@@ -148,4 +177,38 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.secondary.outlined {
+ background: rgba(140, 198, 60, 0.05);
+ border: 1px solid #71a02f;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #638c29;
+ text-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:hover, .jewel.togglebutton.secondary.outlined:hover:focus {
+ background: rgba(140, 198, 60, 0.15);
+ border: 1px solid #638c29;
+}
+.jewel.togglebutton.secondary.outlined:active, .jewel.togglebutton.secondary.outlined:active:focus {
+ background: rgba(140, 198, 60, 0.25);
+ border: 1px solid #5a8126;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:focus {
+ border: 1px solid #557923;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.secondary.outlined.selected {
+ background: rgba(140, 198, 60, 0.25);
+ border: 1px solid #5a8126;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Green-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Green-Theme/defaults.css
index 27ea3c2..3650a11 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Green-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Green-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.secondary.outlined {
+ background: rgba(58, 181, 73, 0.05);
+ border: 1px solid #2e8e39;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #277b32;
+ text-shadow: none;
+}
+.jewel.button.secondary.outlined:hover, .jewel.button.secondary.outlined:hover:focus {
+ background: rgba(58, 181, 73, 0.15);
+ border: 1px solid #277b32;
+}
+.jewel.button.secondary.outlined:active, .jewel.button.secondary.outlined:active:focus {
+ background: rgba(58, 181, 73, 0.25);
+ border: 1px solid #246f2d;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined:focus {
+ border: 1px solid #21682a;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.secondary.hovered {
background: #60cc6d;
}
@@ -148,4 +177,38 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.secondary.outlined {
+ background: rgba(58, 181, 73, 0.05);
+ border: 1px solid #2e8e39;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #277b32;
+ text-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:hover, .jewel.togglebutton.secondary.outlined:hover:focus {
+ background: rgba(58, 181, 73, 0.15);
+ border: 1px solid #277b32;
+}
+.jewel.togglebutton.secondary.outlined:active, .jewel.togglebutton.secondary.outlined:active:focus {
+ background: rgba(58, 181, 73, 0.25);
+ border: 1px solid #246f2d;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:focus {
+ border: 1px solid #21682a;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.secondary.outlined.selected {
+ background: rgba(58, 181, 73, 0.25);
+ border: 1px solid #246f2d;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Orange-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Orange-Theme/defaults.css
index d0d0463..4e070b2 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Orange-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Orange-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.secondary.outlined {
+ background: rgba(247, 148, 29, 0.05);
+ border: 1px solid #d97a08;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #c16c07;
+ text-shadow: none;
+}
+.jewel.button.secondary.outlined:hover, .jewel.button.secondary.outlined:hover:focus {
+ background: rgba(247, 148, 29, 0.15);
+ border: 1px solid #c16c07;
+}
+.jewel.button.secondary.outlined:active, .jewel.button.secondary.outlined:active:focus {
+ background: rgba(247, 148, 29, 0.25);
+ border: 1px solid #b26406;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined:focus {
+ border: 1px solid #a85e06;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.secondary.hovered {
background: #f9b058;
}
@@ -148,4 +177,38 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.secondary.outlined {
+ background: rgba(247, 148, 29, 0.05);
+ border: 1px solid #d97a08;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #c16c07;
+ text-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:hover, .jewel.togglebutton.secondary.outlined:hover:focus {
+ background: rgba(247, 148, 29, 0.15);
+ border: 1px solid #c16c07;
+}
+.jewel.togglebutton.secondary.outlined:active, .jewel.togglebutton.secondary.outlined:active:focus {
+ background: rgba(247, 148, 29, 0.25);
+ border: 1px solid #b26406;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:focus {
+ border: 1px solid #a85e06;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.secondary.outlined.selected {
+ background: rgba(247, 148, 29, 0.25);
+ border: 1px solid #b26406;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Red-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Red-Theme/defaults.css
index e4a6a20..e678c06 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Red-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Red-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.secondary.outlined {
+ background: rgba(236, 28, 36, 0.05);
+ border: 1px solid #c51017;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #ad0e15;
+ text-shadow: none;
+}
+.jewel.button.secondary.outlined:hover, .jewel.button.secondary.outlined:hover:focus {
+ background: rgba(236, 28, 36, 0.15);
+ border: 1px solid #ad0e15;
+}
+.jewel.button.secondary.outlined:active, .jewel.button.secondary.outlined:active:focus {
+ background: rgba(236, 28, 36, 0.25);
+ border: 1px solid #9f0d13;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined:focus {
+ border: 1px solid #950d12;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.secondary.hovered {
background: #f1545a;
}
@@ -148,4 +177,38 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.secondary.outlined {
+ background: rgba(236, 28, 36, 0.05);
+ border: 1px solid #c51017;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #ad0e15;
+ text-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:hover, .jewel.togglebutton.secondary.outlined:hover:focus {
+ background: rgba(236, 28, 36, 0.15);
+ border: 1px solid #ad0e15;
+}
+.jewel.togglebutton.secondary.outlined:active, .jewel.togglebutton.secondary.outlined:active:focus {
+ background: rgba(236, 28, 36, 0.25);
+ border: 1px solid #9f0d13;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:focus {
+ border: 1px solid #950d12;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.secondary.outlined.selected {
+ background: rgba(236, 28, 36, 0.25);
+ border: 1px solid #9f0d13;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Sapphire-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Sapphire-Theme/defaults.css
index 7d2f53d..8c5d3d0 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Sapphire-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Sapphire-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.secondary.outlined {
+ background: rgba(44, 116, 190, 0.05);
+ border: 1px solid #225b95;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #1e4e80;
+ text-shadow: none;
+}
+.jewel.button.secondary.outlined:hover, .jewel.button.secondary.outlined:hover:focus {
+ background: rgba(44, 116, 190, 0.15);
+ border: 1px solid #1e4e80;
+}
+.jewel.button.secondary.outlined:active, .jewel.button.secondary.outlined:active:focus {
+ background: rgba(44, 116, 190, 0.25);
+ border: 1px solid #1b4673;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined:focus {
+ border: 1px solid #19416b;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.secondary.hovered {
background: #5193d7;
}
@@ -148,4 +177,38 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.secondary.outlined {
+ background: rgba(44, 116, 190, 0.05);
+ border: 1px solid #225b95;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #1e4e80;
+ text-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:hover, .jewel.togglebutton.secondary.outlined:hover:focus {
+ background: rgba(44, 116, 190, 0.15);
+ border: 1px solid #1e4e80;
+}
+.jewel.togglebutton.secondary.outlined:active, .jewel.togglebutton.secondary.outlined:active:focus {
+ background: rgba(44, 116, 190, 0.25);
+ border: 1px solid #1b4673;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:focus {
+ border: 1px solid #19416b;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.secondary.outlined.selected {
+ background: rgba(44, 116, 190, 0.25);
+ border: 1px solid #1b4673;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Sunflower-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Sunflower-Theme/defaults.css
index 045543f..96c8769 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Sunflower-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Sunflower-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.secondary.outlined {
+ background: rgba(248, 177, 63, 0.05);
+ border: 1px solid #f69d0e;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #e28f08;
+ text-shadow: none;
+}
+.jewel.button.secondary.outlined:hover, .jewel.button.secondary.outlined:hover:focus {
+ background: rgba(248, 177, 63, 0.15);
+ border: 1px solid #e28f08;
+}
+.jewel.button.secondary.outlined:active, .jewel.button.secondary.outlined:active:focus {
+ background: rgba(248, 177, 63, 0.25);
+ border: 1px solid #d38508;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined:focus {
+ border: 1px solid #ca7f07;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.secondary.hovered {
background: #fac97a;
}
@@ -148,4 +177,38 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.secondary.outlined {
+ background: rgba(248, 177, 63, 0.05);
+ border: 1px solid #f69d0e;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #e28f08;
+ text-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:hover, .jewel.togglebutton.secondary.outlined:hover:focus {
+ background: rgba(248, 177, 63, 0.15);
+ border: 1px solid #e28f08;
+}
+.jewel.togglebutton.secondary.outlined:active, .jewel.togglebutton.secondary.outlined:active:focus {
+ background: rgba(248, 177, 63, 0.25);
+ border: 1px solid #d38508;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:focus {
+ border: 1px solid #ca7f07;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.secondary.outlined.selected {
+ background: rgba(248, 177, 63, 0.25);
+ border: 1px solid #d38508;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Topaz-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Topaz-Theme/defaults.css
index 91a6d30..3b6c5dc 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Topaz-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Topaz-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.secondary.outlined {
+ background: rgba(239, 90, 42, 0.05);
+ border: 1px solid #d64010;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #be390e;
+ text-shadow: none;
+}
+.jewel.button.secondary.outlined:hover, .jewel.button.secondary.outlined:hover:focus {
+ background: rgba(239, 90, 42, 0.15);
+ border: 1px solid #be390e;
+}
+.jewel.button.secondary.outlined:active, .jewel.button.secondary.outlined:active:focus {
+ background: rgba(239, 90, 42, 0.25);
+ border: 1px solid #b0350d;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined:focus {
+ border: 1px solid #a6320d;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.secondary.hovered {
background: #f38663;
}
@@ -148,4 +177,38 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.secondary.outlined {
+ background: rgba(239, 90, 42, 0.05);
+ border: 1px solid #d64010;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #be390e;
+ text-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:hover, .jewel.togglebutton.secondary.outlined:hover:focus {
+ background: rgba(239, 90, 42, 0.15);
+ border: 1px solid #be390e;
+}
+.jewel.togglebutton.secondary.outlined:active, .jewel.togglebutton.secondary.outlined:active:focus {
+ background: rgba(239, 90, 42, 0.25);
+ border: 1px solid #b0350d;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:focus {
+ border: 1px solid #a6320d;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.secondary.outlined.selected {
+ background: rgba(239, 90, 42, 0.25);
+ border: 1px solid #b0350d;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Turquoise-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Turquoise-Theme/defaults.css
index 2af7477..91037fa 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Turquoise-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Turquoise-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.secondary.outlined {
+ background: rgba(41, 168, 159, 0.05);
+ border: 1px solid #1f7f78;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #1a6b65;
+ text-shadow: none;
+}
+.jewel.button.secondary.outlined:hover, .jewel.button.secondary.outlined:hover:focus {
+ background: rgba(41, 168, 159, 0.15);
+ border: 1px solid #1a6b65;
+}
+.jewel.button.secondary.outlined:active, .jewel.button.secondary.outlined:active:focus {
+ background: rgba(41, 168, 159, 0.25);
+ border: 1px solid #175e59;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined:focus {
+ border: 1px solid #155651;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.secondary.hovered {
background: #3ed0c6;
}
@@ -148,4 +177,38 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.secondary.outlined {
+ background: rgba(41, 168, 159, 0.05);
+ border: 1px solid #1f7f78;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #1a6b65;
+ text-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:hover, .jewel.togglebutton.secondary.outlined:hover:focus {
+ background: rgba(41, 168, 159, 0.15);
+ border: 1px solid #1a6b65;
+}
+.jewel.togglebutton.secondary.outlined:active, .jewel.togglebutton.secondary.outlined:active:focus {
+ background: rgba(41, 168, 159, 0.25);
+ border: 1px solid #175e59;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:focus {
+ border: 1px solid #155651;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.secondary.outlined.selected {
+ background: rgba(41, 168, 159, 0.25);
+ border: 1px solid #175e59;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Violet-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Violet-Theme/defaults.css
index fe0e278..c8dc917 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Violet-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Violet-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.secondary.outlined {
+ background: rgba(102, 44, 144, 0.05);
+ border: 1px solid #4a2069;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #3c1a55;
+ text-shadow: none;
+}
+.jewel.button.secondary.outlined:hover, .jewel.button.secondary.outlined:hover:focus {
+ background: rgba(102, 44, 144, 0.15);
+ border: 1px solid #3c1a55;
+}
+.jewel.button.secondary.outlined:active, .jewel.button.secondary.outlined:active:focus {
+ background: rgba(102, 44, 144, 0.25);
+ border: 1px solid #34174a;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined:focus {
+ border: 1px solid #2f1442;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.secondary.hovered {
background: #873abf;
}
@@ -148,4 +177,38 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.secondary.outlined {
+ background: rgba(102, 44, 144, 0.05);
+ border: 1px solid #4a2069;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #3c1a55;
+ text-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:hover, .jewel.togglebutton.secondary.outlined:hover:focus {
+ background: rgba(102, 44, 144, 0.15);
+ border: 1px solid #3c1a55;
+}
+.jewel.togglebutton.secondary.outlined:active, .jewel.togglebutton.secondary.outlined:active:focus {
+ background: rgba(102, 44, 144, 0.25);
+ border: 1px solid #34174a;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:focus {
+ border: 1px solid #2f1442;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.secondary.outlined.selected {
+ background: rgba(102, 44, 144, 0.25);
+ border: 1px solid #34174a;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Yellow-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Yellow-Theme/defaults.css
index 32ff73d..031063e 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Yellow-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-Flat-Secondary-Yellow-Theme/defaults.css
@@ -51,6 +51,35 @@
text-shadow: unset;
}
+.jewel.button.secondary.outlined {
+ background: rgba(226, 215, 11, 0.05);
+ border: 1px solid #b1a909;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #999207;
+ text-shadow: none;
+}
+.jewel.button.secondary.outlined:hover, .jewel.button.secondary.outlined:hover:focus {
+ background: rgba(226, 215, 11, 0.15);
+ border: 1px solid #999207;
+}
+.jewel.button.secondary.outlined:active, .jewel.button.secondary.outlined:active:focus {
+ background: rgba(226, 215, 11, 0.25);
+ border: 1px solid #8a8407;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined:focus {
+ border: 1px solid #817a06;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.secondary.hovered {
background: #f5eb35;
}
@@ -148,4 +177,38 @@ a:active {
box-shadow: none;
}
+.jewel.togglebutton.secondary.outlined {
+ background: rgba(226, 215, 11, 0.05);
+ border: 1px solid #b1a909;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #999207;
+ text-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:hover, .jewel.togglebutton.secondary.outlined:hover:focus {
+ background: rgba(226, 215, 11, 0.15);
+ border: 1px solid #999207;
+}
+.jewel.togglebutton.secondary.outlined:active, .jewel.togglebutton.secondary.outlined:active:focus {
+ background: rgba(226, 215, 11, 0.25);
+ border: 1px solid #8a8407;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:focus {
+ border: 1px solid #817a06;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.secondary.outlined.selected {
+ background: rgba(226, 215, 11, 0.25);
+ border: 1px solid #8a8407;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Amethyst-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Amethyst-Theme/defaults.css
index 3480d47..7e4b626 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Amethyst-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Amethyst-Theme/defaults.css
@@ -50,6 +50,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(201, 44, 198, 0.05);
+ border: 1px solid #9f239d;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #8a1e88;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(201, 44, 198, 0.15);
+ border: 1px solid #8a1e88;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #751a74;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #da58d8;
}
@@ -134,4 +163,38 @@
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(201, 44, 198, 0.05);
+ border: 1px solid #9f239d;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #8a1e88;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(201, 44, 198, 0.15);
+ border: 1px solid #8a1e88;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #751a74;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Blue-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Blue-Theme/defaults.css
index 5945faf..7b1bcfb 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Blue-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Blue-Theme/defaults.css
@@ -50,6 +50,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(60, 173, 241, 0.05);
+ border: 1px solid #1198e9;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #0f88d1;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(60, 173, 241, 0.15);
+ border: 1px solid #0f88d1;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(60, 173, 241, 0.25);
+ border: 1px solid #0e7fc3;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #0d79ba;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #75c5f5;
}
@@ -134,4 +163,38 @@
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(60, 173, 241, 0.05);
+ border: 1px solid #1198e9;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #0f88d1;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(60, 173, 241, 0.15);
+ border: 1px solid #0f88d1;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(60, 173, 241, 0.25);
+ border: 1px solid #0e7fc3;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #0d79ba;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(60, 173, 241, 0.25);
+ border: 1px solid #0e7fc3;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Emerald-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Emerald-Theme/defaults.css
index 95a1fec..3563bc2 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Emerald-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Emerald-Theme/defaults.css
@@ -50,6 +50,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(140, 198, 60, 0.05);
+ border: 1px solid #71a02f;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #638c29;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(140, 198, 60, 0.15);
+ border: 1px solid #638c29;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(140, 198, 60, 0.25);
+ border: 1px solid #5a8126;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #557923;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #a8d46b;
}
@@ -134,4 +163,38 @@
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(140, 198, 60, 0.05);
+ border: 1px solid #71a02f;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #638c29;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(140, 198, 60, 0.15);
+ border: 1px solid #638c29;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(140, 198, 60, 0.25);
+ border: 1px solid #5a8126;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #557923;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(140, 198, 60, 0.25);
+ border: 1px solid #5a8126;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Green-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Green-Theme/defaults.css
index e6f05f2..1a11d92 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Green-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Green-Theme/defaults.css
@@ -50,6 +50,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(58, 181, 73, 0.05);
+ border: 1px solid #2e8e39;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #277b32;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(58, 181, 73, 0.15);
+ border: 1px solid #277b32;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(58, 181, 73, 0.25);
+ border: 1px solid #246f2d;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #21682a;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #60cc6d;
}
@@ -134,4 +163,38 @@
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(58, 181, 73, 0.05);
+ border: 1px solid #2e8e39;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #277b32;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(58, 181, 73, 0.15);
+ border: 1px solid #277b32;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(58, 181, 73, 0.25);
+ border: 1px solid #246f2d;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #21682a;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(58, 181, 73, 0.25);
+ border: 1px solid #246f2d;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Orange-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Orange-Theme/defaults.css
index 8c47d0d..93b4873 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Orange-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Orange-Theme/defaults.css
@@ -50,6 +50,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(247, 148, 29, 0.05);
+ border: 1px solid #d97a08;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #c16c07;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(247, 148, 29, 0.15);
+ border: 1px solid #c16c07;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(247, 148, 29, 0.25);
+ border: 1px solid #b26406;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #a85e06;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #f9b058;
}
@@ -134,4 +163,38 @@
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(247, 148, 29, 0.05);
+ border: 1px solid #d97a08;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #c16c07;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(247, 148, 29, 0.15);
+ border: 1px solid #c16c07;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(247, 148, 29, 0.25);
+ border: 1px solid #b26406;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #a85e06;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(247, 148, 29, 0.25);
+ border: 1px solid #b26406;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Red-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Red-Theme/defaults.css
index 88c42eb..34bd84a 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Red-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Red-Theme/defaults.css
@@ -50,6 +50,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(236, 28, 36, 0.05);
+ border: 1px solid #c51017;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #ad0e15;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(236, 28, 36, 0.15);
+ border: 1px solid #ad0e15;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(236, 28, 36, 0.25);
+ border: 1px solid #9f0d13;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #950d12;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #f1545a;
}
@@ -134,4 +163,38 @@
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(236, 28, 36, 0.05);
+ border: 1px solid #c51017;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #ad0e15;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(236, 28, 36, 0.15);
+ border: 1px solid #ad0e15;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(236, 28, 36, 0.25);
+ border: 1px solid #9f0d13;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #950d12;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(236, 28, 36, 0.25);
+ border: 1px solid #9f0d13;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Sapphire-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Sapphire-Theme/defaults.css
index f8ce11f..5eb2368 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Sapphire-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Sapphire-Theme/defaults.css
@@ -50,6 +50,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(44, 116, 190, 0.05);
+ border: 1px solid #225b95;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #1e4e80;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(44, 116, 190, 0.15);
+ border: 1px solid #1e4e80;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(44, 116, 190, 0.25);
+ border: 1px solid #1b4673;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #19416b;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #5193d7;
}
@@ -134,4 +163,38 @@
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(44, 116, 190, 0.05);
+ border: 1px solid #225b95;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #1e4e80;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(44, 116, 190, 0.15);
+ border: 1px solid #1e4e80;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(44, 116, 190, 0.25);
+ border: 1px solid #1b4673;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #19416b;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(44, 116, 190, 0.25);
+ border: 1px solid #1b4673;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Sunflower-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Sunflower-Theme/defaults.css
index f0cdf55..e55723d 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Sunflower-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Sunflower-Theme/defaults.css
@@ -50,6 +50,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(248, 177, 63, 0.05);
+ border: 1px solid #f69d0e;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #e28f08;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(248, 177, 63, 0.15);
+ border: 1px solid #e28f08;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(248, 177, 63, 0.25);
+ border: 1px solid #d38508;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #ca7f07;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #fac97a;
}
@@ -134,4 +163,38 @@
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(248, 177, 63, 0.05);
+ border: 1px solid #f69d0e;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #e28f08;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(248, 177, 63, 0.15);
+ border: 1px solid #e28f08;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(248, 177, 63, 0.25);
+ border: 1px solid #d38508;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #ca7f07;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(248, 177, 63, 0.25);
+ border: 1px solid #d38508;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Topaz-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Topaz-Theme/defaults.css
index 7dbb1dd..a9b45cb 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Topaz-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Topaz-Theme/defaults.css
@@ -50,6 +50,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(239, 90, 42, 0.05);
+ border: 1px solid #d64010;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #be390e;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(239, 90, 42, 0.15);
+ border: 1px solid #be390e;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(239, 90, 42, 0.25);
+ border: 1px solid #b0350d;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #a6320d;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #f38663;
}
@@ -134,4 +163,38 @@
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(239, 90, 42, 0.05);
+ border: 1px solid #d64010;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #be390e;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(239, 90, 42, 0.15);
+ border: 1px solid #be390e;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(239, 90, 42, 0.25);
+ border: 1px solid #b0350d;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #a6320d;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(239, 90, 42, 0.25);
+ border: 1px solid #b0350d;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Turquoise-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Turquoise-Theme/defaults.css
index 24f9006..d9737cd 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Turquoise-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Turquoise-Theme/defaults.css
@@ -50,6 +50,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(41, 168, 159, 0.05);
+ border: 1px solid #1f7f78;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #1a6b65;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(41, 168, 159, 0.15);
+ border: 1px solid #1a6b65;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(41, 168, 159, 0.25);
+ border: 1px solid #175e59;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #155651;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #3ed0c6;
}
@@ -134,4 +163,38 @@
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(41, 168, 159, 0.05);
+ border: 1px solid #1f7f78;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #1a6b65;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(41, 168, 159, 0.15);
+ border: 1px solid #1a6b65;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(41, 168, 159, 0.25);
+ border: 1px solid #175e59;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #155651;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(41, 168, 159, 0.25);
+ border: 1px solid #175e59;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Violet-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Violet-Theme/defaults.css
index e926296..4d804f1 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Violet-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Violet-Theme/defaults.css
@@ -50,6 +50,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(102, 44, 144, 0.05);
+ border: 1px solid #4a2069;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #3c1a55;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(102, 44, 144, 0.15);
+ border: 1px solid #3c1a55;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(102, 44, 144, 0.25);
+ border: 1px solid #34174a;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #2f1442;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #873abf;
}
@@ -134,4 +163,38 @@
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(102, 44, 144, 0.05);
+ border: 1px solid #4a2069;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #3c1a55;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(102, 44, 144, 0.15);
+ border: 1px solid #3c1a55;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(102, 44, 144, 0.25);
+ border: 1px solid #34174a;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #2f1442;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(102, 44, 144, 0.25);
+ border: 1px solid #34174a;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Yellow-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Yellow-Theme/defaults.css
index 2e14bc3..a9e213e 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Yellow-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Emphasized-Yellow-Theme/defaults.css
@@ -50,6 +50,35 @@
text-shadow: unset;
}
+.jewel.button.emphasized.outlined {
+ background: rgba(226, 215, 11, 0.05);
+ border: 1px solid #b1a909;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #999207;
+ text-shadow: none;
+}
+.jewel.button.emphasized.outlined:hover, .jewel.button.emphasized.outlined:hover:focus {
+ background: rgba(226, 215, 11, 0.15);
+ border: 1px solid #999207;
+}
+.jewel.button.emphasized.outlined:active, .jewel.button.emphasized.outlined:active:focus {
+ background: rgba(226, 215, 11, 0.25);
+ border: 1px solid #8a8407;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined:focus {
+ border: 1px solid #817a06;
+ box-shadow: none;
+}
+.jewel.button.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.emphasized.hovered {
background: #f5eb35;
}
@@ -134,4 +163,38 @@
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.emphasized.outlined {
+ background: rgba(226, 215, 11, 0.05);
+ border: 1px solid #b1a909;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #999207;
+ text-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:hover, .jewel.togglebutton.emphasized.outlined:hover:focus {
+ background: rgba(226, 215, 11, 0.15);
+ border: 1px solid #999207;
+}
+.jewel.togglebutton.emphasized.outlined:active, .jewel.togglebutton.emphasized.outlined:active:focus {
+ background: rgba(226, 215, 11, 0.25);
+ border: 1px solid #8a8407;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined:focus {
+ border: 1px solid #817a06;
+ box-shadow: none;
+}
+.jewel.togglebutton.emphasized.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.emphasized.outlined.selected {
+ background: rgba(226, 215, 11, 0.25);
+ border: 1px solid #8a8407;
+ box-shadow: none;
+}
+
/*# sourceMappingURL=defaults.css.map */
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Amethyst-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Amethyst-Theme/defaults.css
index f79a76c..ceafe8ff 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Amethyst-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Amethyst-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -192,19 +166,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: linear-gradient(#d43bd1, #b427b1);
border: 1px solid #8a1e88;
@@ -234,6 +240,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(201, 44, 198, 0.05);
+ border: 1px solid #9f239d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #8a1e88;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(201, 44, 198, 0.15);
+ border: 1px solid #8a1e88;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #751a74;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1107,6 +1142,39 @@ a:active {
color: #220721;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1168,6 +1236,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: linear-gradient(#8d8d8d, #737373);
+ border: 1px solid #5a5a5a;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.togglebutton.primary {
background: linear-gradient(#d43bd1, #b427b1);
border: 1px solid #8a1e88;
@@ -1252,6 +1359,40 @@ a:active {
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(201, 44, 198, 0.05);
+ border: 1px solid #9f239d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #8a1e88;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(201, 44, 198, 0.15);
+ border: 1px solid #8a1e88;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #751a74;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: linear-gradient(#9f239d, #751a74);
+ border: 1px solid #4b114a;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Blue-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Blue-Theme/defaults.css
index d96a605..1e81fff 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Blue-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Blue-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -192,19 +166,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: linear-gradient(#54b7f3, #24a3ef);
border: 1px solid #0f88d1;
@@ -234,6 +240,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(60, 173, 241, 0.05);
+ border: 1px solid #1198e9;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #0f88d1;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(60, 173, 241, 0.15);
+ border: 1px solid #0f88d1;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(60, 173, 241, 0.25);
+ border: 1px solid #0e7fc3;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #0d79ba;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1107,6 +1142,39 @@ a:active {
color: #063b5b;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1168,6 +1236,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: linear-gradient(#8d8d8d, #737373);
+ border: 1px solid #5a5a5a;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.togglebutton.primary {
background: linear-gradient(#54b7f3, #24a3ef);
border: 1px solid #0f88d1;
@@ -1252,6 +1359,40 @@ a:active {
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(60, 173, 241, 0.05);
+ border: 1px solid #1198e9;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #0f88d1;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(60, 173, 241, 0.15);
+ border: 1px solid #0f88d1;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(60, 173, 241, 0.25);
+ border: 1px solid #0e7fc3;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #0d79ba;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: linear-gradient(#1198e9, #0d79ba);
+ border: 1px solid #0a5a8a;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Emerald-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Emerald-Theme/defaults.css
index 7da4290..e618641 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Emerald-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Emerald-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -192,19 +166,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: linear-gradient(#98cc50, #7eb435);
border: 1px solid #638c29;
@@ -234,6 +240,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(140, 198, 60, 0.05);
+ border: 1px solid #71a02f;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #638c29;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(140, 198, 60, 0.15);
+ border: 1px solid #638c29;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(140, 198, 60, 0.25);
+ border: 1px solid #5a8126;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #557923;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1107,6 +1142,39 @@ a:active {
color: #1d2a0c;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1168,6 +1236,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: linear-gradient(#8d8d8d, #737373);
+ border: 1px solid #5a5a5a;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.togglebutton.primary {
background: linear-gradient(#98cc50, #7eb435);
border: 1px solid #638c29;
@@ -1252,6 +1359,40 @@ a:active {
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(140, 198, 60, 0.05);
+ border: 1px solid #71a02f;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #638c29;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(140, 198, 60, 0.15);
+ border: 1px solid #638c29;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(140, 198, 60, 0.25);
+ border: 1px solid #5a8126;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #557923;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: linear-gradient(#71a02f, #557923);
+ border: 1px solid #395118;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Green-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Green-Theme/defaults.css
index bd3ce42..7586234 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Green-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Green-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -192,19 +166,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: linear-gradient(#45c354, #34a241);
border: 1px solid #277b32;
@@ -234,6 +240,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(58, 181, 73, 0.05);
+ border: 1px solid #2e8e39;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #277b32;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(58, 181, 73, 0.15);
+ border: 1px solid #277b32;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(58, 181, 73, 0.25);
+ border: 1px solid #246f2d;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #21682a;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1107,6 +1142,39 @@ a:active {
color: #081b0b;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1168,6 +1236,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: linear-gradient(#8d8d8d, #737373);
+ border: 1px solid #5a5a5a;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.togglebutton.primary {
background: linear-gradient(#45c354, #34a241);
border: 1px solid #277b32;
@@ -1252,6 +1359,40 @@ a:active {
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(58, 181, 73, 0.05);
+ border: 1px solid #2e8e39;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #277b32;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(58, 181, 73, 0.15);
+ border: 1px solid #277b32;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(58, 181, 73, 0.25);
+ border: 1px solid #246f2d;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #21682a;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: linear-gradient(#2e8e39, #21682a);
+ border: 1px solid #15411a;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Orange-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Orange-Theme/defaults.css
index 6ac0fbb..8765acd 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Orange-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Orange-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -192,19 +166,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: linear-gradient(#f8a036, #f28809);
border: 1px solid #c16c07;
@@ -234,6 +240,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(247, 148, 29, 0.05);
+ border: 1px solid #d97a08;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #c16c07;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(247, 148, 29, 0.15);
+ border: 1px solid #c16c07;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(247, 148, 29, 0.25);
+ border: 1px solid #b26406;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #a85e06;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1107,6 +1142,39 @@ a:active {
color: #462702;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1168,6 +1236,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: linear-gradient(#8d8d8d, #737373);
+ border: 1px solid #5a5a5a;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.togglebutton.primary {
background: linear-gradient(#f8a036, #f28809);
border: 1px solid #c16c07;
@@ -1252,6 +1359,40 @@ a:active {
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(247, 148, 29, 0.05);
+ border: 1px solid #d97a08;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #c16c07;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(247, 148, 29, 0.15);
+ border: 1px solid #c16c07;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(247, 148, 29, 0.25);
+ border: 1px solid #b26406;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #a85e06;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: linear-gradient(#d97a08, #a85e06);
+ border: 1px solid #774304;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Red-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Red-Theme/defaults.css
index 2b0c167..81a6e82 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Red-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Red-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -192,19 +166,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: linear-gradient(#ee343b, #dc121a);
border: 1px solid #ad0e15;
@@ -234,6 +240,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(236, 28, 36, 0.05);
+ border: 1px solid #c51017;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #ad0e15;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(236, 28, 36, 0.15);
+ border: 1px solid #ad0e15;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(236, 28, 36, 0.25);
+ border: 1px solid #9f0d13;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #950d12;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1107,6 +1142,39 @@ a:active {
color: #370507;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1168,6 +1236,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: linear-gradient(#8d8d8d, #737373);
+ border: 1px solid #5a5a5a;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.togglebutton.primary {
background: linear-gradient(#ee343b, #dc121a);
border: 1px solid #ad0e15;
@@ -1252,6 +1359,40 @@ a:active {
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(236, 28, 36, 0.05);
+ border: 1px solid #c51017;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #ad0e15;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(236, 28, 36, 0.15);
+ border: 1px solid #ad0e15;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(236, 28, 36, 0.25);
+ border: 1px solid #9f0d13;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #950d12;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: linear-gradient(#c51017, #950d12);
+ border: 1px solid #66090c;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Sapphire-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Sapphire-Theme/defaults.css
index b70ddfb..ad61ab3 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Sapphire-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Sapphire-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -192,19 +166,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: linear-gradient(#3481d0, #2767a9);
border: 1px solid #1e4e80;
@@ -234,6 +240,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(44, 116, 190, 0.05);
+ border: 1px solid #225b95;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #1e4e80;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(44, 116, 190, 0.15);
+ border: 1px solid #1e4e80;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(44, 116, 190, 0.25);
+ border: 1px solid #1b4673;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #19416b;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1107,6 +1142,39 @@ a:active {
color: #060f18;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1168,6 +1236,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: linear-gradient(#8d8d8d, #737373);
+ border: 1px solid #5a5a5a;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.togglebutton.primary {
background: linear-gradient(#3481d0, #2767a9);
border: 1px solid #1e4e80;
@@ -1252,6 +1359,40 @@ a:active {
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(44, 116, 190, 0.05);
+ border: 1px solid #225b95;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #1e4e80;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(44, 116, 190, 0.15);
+ border: 1px solid #1e4e80;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(44, 116, 190, 0.25);
+ border: 1px solid #1b4673;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #19416b;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: linear-gradient(#225b95, #19416b);
+ border: 1px solid #0f2842;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Sunflower-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Sunflower-Theme/defaults.css
index 67ffa49..d57dd88 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Sunflower-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Sunflower-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -192,19 +166,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: linear-gradient(#f9bb58, #f7a726);
border: 1px solid #e28f08;
@@ -234,6 +240,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(248, 177, 63, 0.05);
+ border: 1px solid #f69d0e;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #e28f08;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(248, 177, 63, 0.15);
+ border: 1px solid #e28f08;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(248, 177, 63, 0.25);
+ border: 1px solid #d38508;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #ca7f07;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1107,6 +1142,39 @@ a:active {
color: #674104;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1168,6 +1236,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: linear-gradient(#8d8d8d, #737373);
+ border: 1px solid #5a5a5a;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.togglebutton.primary {
background: linear-gradient(#f9bb58, #f7a726);
border: 1px solid #e28f08;
@@ -1252,6 +1359,40 @@ a:active {
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(248, 177, 63, 0.05);
+ border: 1px solid #f69d0e;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #e28f08;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(248, 177, 63, 0.15);
+ border: 1px solid #e28f08;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(248, 177, 63, 0.25);
+ border: 1px solid #d38508;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #ca7f07;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: linear-gradient(#f69d0e, #ca7f07);
+ border: 1px solid #986006;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Topaz-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Topaz-Theme/defaults.css
index 483ff8a..932115c 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Topaz-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Topaz-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -192,19 +166,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: linear-gradient(#f16c42, #ed4812);
border: 1px solid #be390e;
@@ -234,6 +240,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(239, 90, 42, 0.05);
+ border: 1px solid #d64010;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #be390e;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(239, 90, 42, 0.15);
+ border: 1px solid #be390e;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(239, 90, 42, 0.25);
+ border: 1px solid #b0350d;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #a6320d;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1107,6 +1142,39 @@ a:active {
color: #481605;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1168,6 +1236,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: linear-gradient(#8d8d8d, #737373);
+ border: 1px solid #5a5a5a;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.togglebutton.primary {
background: linear-gradient(#f16c42, #ed4812);
border: 1px solid #be390e;
@@ -1252,6 +1359,40 @@ a:active {
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(239, 90, 42, 0.05);
+ border: 1px solid #d64010;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #be390e;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(239, 90, 42, 0.15);
+ border: 1px solid #be390e;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(239, 90, 42, 0.25);
+ border: 1px solid #b0350d;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #a6320d;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: linear-gradient(#d64010, #a6320d);
+ border: 1px solid #772409;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Turquoise-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Turquoise-Theme/defaults.css
index c7f7225..a700dea 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Turquoise-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Turquoise-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -192,19 +166,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: linear-gradient(#2ebcb2, #24948c);
border: 1px solid #1a6b65;
@@ -234,6 +240,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(41, 168, 159, 0.05);
+ border: 1px solid #1f7f78;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #1a6b65;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(41, 168, 159, 0.15);
+ border: 1px solid #1a6b65;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(41, 168, 159, 0.25);
+ border: 1px solid #175e59;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #155651;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1107,6 +1142,39 @@ a:active {
color: #010404;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1168,6 +1236,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: linear-gradient(#8d8d8d, #737373);
+ border: 1px solid #5a5a5a;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.togglebutton.primary {
background: linear-gradient(#2ebcb2, #24948c);
border: 1px solid #1a6b65;
@@ -1252,6 +1359,40 @@ a:active {
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(41, 168, 159, 0.05);
+ border: 1px solid #1f7f78;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #1a6b65;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(41, 168, 159, 0.15);
+ border: 1px solid #1a6b65;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(41, 168, 159, 0.25);
+ border: 1px solid #175e59;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #155651;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: linear-gradient(#1f7f78, #155651);
+ border: 1px solid #0b2d2b;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Violet-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Violet-Theme/defaults.css
index 08cf57a..28a81b5 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Violet-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Violet-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -192,19 +166,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: linear-gradient(#7432a4, #58267c);
border: 1px solid #3c1a55;
@@ -234,6 +240,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(102, 44, 144, 0.05);
+ border: 1px solid #4a2069;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #3c1a55;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(102, 44, 144, 0.15);
+ border: 1px solid #3c1a55;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(102, 44, 144, 0.25);
+ border: 1px solid #34174a;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #2f1442;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1107,6 +1142,39 @@ a:active {
color: black;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1168,6 +1236,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: linear-gradient(#8d8d8d, #737373);
+ border: 1px solid #5a5a5a;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.togglebutton.primary {
background: linear-gradient(#7432a4, #58267c);
border: 1px solid #3c1a55;
@@ -1252,6 +1359,40 @@ a:active {
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(102, 44, 144, 0.05);
+ border: 1px solid #4a2069;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #3c1a55;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(102, 44, 144, 0.15);
+ border: 1px solid #3c1a55;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(102, 44, 144, 0.25);
+ border: 1px solid #34174a;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #2f1442;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: linear-gradient(#4a2069, #2f1442);
+ border: 1px solid #13081b;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Yellow-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Yellow-Theme/defaults.css
index e0ebacf..7cb9338 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Yellow-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Primary-Yellow-Theme/defaults.css
@@ -32,34 +32,6 @@ input, select, textarea, button {
font-family: inherit;
}
-h1 {
- font-size: 2.5em;
-}
-
-h2 {
- font-size: 2em;
-}
-
-h3 {
- font-size: 1.5em;
-}
-
-h4 {
- font-size: 1.25em;
-}
-
-h5 {
- font-size: 1em;
-}
-
-span {
- font-size: 1em;
-}
-
-div {
- font-size: 14px;
-}
-
hr {
background-color: #d9d9d9;
}
@@ -160,6 +132,8 @@ hr {
}
.jewel.button {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -192,19 +166,51 @@ hr {
.jewel.button[disabled] {
font-weight: 400;
}
+.jewel.button.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.button.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.button.iconLSpace i {
+.jewel.button.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.button.iconRSpace i {
+.jewel.button.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outline {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outline:hover, .jewel.button.outline:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outline:active, .jewel.button.outline:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outline:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outline[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.button.primary {
background: linear-gradient(#f4e813, #cac00a);
border: 1px solid #999207;
@@ -234,6 +240,35 @@ hr {
text-shadow: unset;
}
+.jewel.button.primary.outlined {
+ background: rgba(226, 215, 11, 0.05);
+ border: 1px solid #b1a909;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #999207;
+ text-shadow: none;
+}
+.jewel.button.primary.outlined:hover, .jewel.button.primary.outlined:hover:focus {
+ background: rgba(226, 215, 11, 0.15);
+ border: 1px solid #999207;
+}
+.jewel.button.primary.outlined:active, .jewel.button.primary.outlined:active:focus {
+ background: rgba(226, 215, 11, 0.25);
+ border: 1px solid #8a8407;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined:focus {
+ border: 1px solid #817a06;
+ box-shadow: none;
+}
+.jewel.button.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.card {
font-size: 1em;
font-weight: 400;
@@ -1107,6 +1142,39 @@ a:active {
color: #1f1e02;
}
+h1 {
+ font-size: 2em;
+ margin: 0.8rem 0rem;
+}
+
+h2 {
+ font-size: 2em;
+ margin: 0.58rem 0rem;
+}
+
+h3 {
+ font-size: 1.5em;
+ margin: 0.408rem 0rem;
+}
+
+h4 {
+ font-size: 1.25em;
+ margin: 0.35rem 0rem;
+}
+
+h5 {
+ font-size: 1em;
+ margin: 0.2rem 0rem;
+}
+
+span {
+ font-size: 1em;
+}
+
+div {
+ font-size: 14px;
+}
+
.jewel.textinput {
font-weight: 400;
color: #808080;
@@ -1168,6 +1236,8 @@ a:active {
}
.jewel.togglebutton {
+ margin: 0;
+ padding: 0.679em 1.12em;
background: linear-gradient(#e6e6e6, #cccccc);
border: 1px solid #b3b3b3;
box-shadow: inset 0 1px 0 white;
@@ -1205,19 +1275,56 @@ a:active {
.jewel.togglebutton[disabled] {
font-weight: 400;
}
+.jewel.togglebutton.icon {
+ padding: 0.429em 0.87em;
+}
.jewel.togglebutton.icon i {
margin-left: 0px;
margin-right: 0px;
}
-.jewel.togglebutton.iconLSpace i {
+.jewel.togglebutton.left-space i {
margin-left: 0px;
margin-right: 8px;
}
-.jewel.togglebutton.iconRSpace i {
+.jewel.togglebutton.right-space i {
margin-left: 8px;
margin-right: 0px;
}
+.jewel.button.outlined {
+ background: rgba(166, 166, 166, 0.05);
+ border: 1px solid #8d8d8d;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: gray;
+ text-shadow: none;
+}
+.jewel.button.outlined:hover, .jewel.button.outlined:hover:focus {
+ background: rgba(166, 166, 166, 0.15);
+ border: 1px solid gray;
+}
+.jewel.button.outlined:active, .jewel.button.outlined:active:focus {
+ background: rgba(166, 166, 166, 0.25);
+ border: 1px solid #787878;
+ box-shadow: none;
+}
+.jewel.button.outlined:focus {
+ border: 1px solid #737373;
+ box-shadow: none;
+}
+.jewel.button.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.button.outlined.selected {
+ background: linear-gradient(#8d8d8d, #737373);
+ border: 1px solid #5a5a5a;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.togglebutton.primary {
background: linear-gradient(#f4e813, #cac00a);
border: 1px solid #999207;
@@ -1252,6 +1359,40 @@ a:active {
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.primary.outlined {
+ background: rgba(226, 215, 11, 0.05);
+ border: 1px solid #b1a909;
+ box-shadow: none;
+ border-radius: 0.25rem;
+ color: #999207;
+ text-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:hover, .jewel.togglebutton.primary.outlined:hover:focus {
+ background: rgba(226, 215, 11, 0.15);
+ border: 1px solid #999207;
+}
+.jewel.togglebutton.primary.outlined:active, .jewel.togglebutton.primary.outlined:active:focus {
+ background: rgba(226, 215, 11, 0.25);
+ border: 1px solid #8a8407;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined:focus {
+ border: 1px solid #817a06;
+ box-shadow: none;
+}
+.jewel.togglebutton.primary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.primary.outlined.selected {
+ background: linear-gradient(#b1a909, #817a06);
+ border: 1px solid #504c04;
+ box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
+}
+
.jewel.tooltip {
color: #FFFFFF;
background: #404040;
diff --git a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Secondary-Amethyst-Theme/defaults.css b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Secondary-Amethyst-Theme/defaults.css
index ccc6bf2..62d2e39 100644
--- a/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Secondary-Amethyst-Theme/defaults.css
+++ b/examples/royale/TourDeJewel/src/main/resources/assets/themes/Jewel-Light-NoFlat-Secondary-Amethyst-Theme/defaults.css
@@ -50,6 +50,35 @@
text-shadow: unset;
}
+.jewel.button.secondary.outlined {
+ background: rgba(201, 44, 198, 0.05);
+ border: 1px solid #9f239d;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #8a1e88;
+ text-shadow: none;
+}
+.jewel.button.secondary.outlined:hover, .jewel.button.secondary.outlined:hover:focus {
+ background: rgba(201, 44, 198, 0.15);
+ border: 1px solid #8a1e88;
+}
+.jewel.button.secondary.outlined:active, .jewel.button.secondary.outlined:active:focus {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined:focus {
+ border: 1px solid #751a74;
+ box-shadow: none;
+}
+.jewel.button.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+
.jewel.datagrid .jewel.list.column .jewel.item.datagrid.secondary.hovered {
background: #da58d8;
}
@@ -146,4 +175,38 @@ a:active {
box-shadow: inset 0px 1px 3px 0px rgba(50, 50, 50, 0.5);
}
+.jewel.togglebutton.secondary.outlined {
+ background: rgba(201, 44, 198, 0.05);
+ border: 1px solid #9f239d;
+ box-shadow: none;
+ border-radius: 3px;
+ color: #8a1e88;
+ text-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:hover, .jewel.togglebutton.secondary.outlined:hover:focus {
+ background: rgba(201, 44, 198, 0.15);
+ border: 1px solid #8a1e88;
+}
+.jewel.togglebutton.secondary.outlined:active, .jewel.togglebutton.secondary.outlined:active:focus {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined:focus {
+ border: 1px solid #751a74;
+ box-shadow: none;
+}
+.jewel.togglebutton.secondary.outlined[disabled] {
+ background: #f3f3f3 !important;
+ border: 1px solid #d9d9d9 !important;
+ box-shadow: none !important;
+ color: silver;
+ text-shadow: unset;
+}
+.jewel.togglebutton.secondary.outlined.selected {
+ background: rgba(201, 44, 198, 0.25);
+ border: 1px solid #7e1c7c;
+ box-shadow: none;
... 16892 lines suppressed ...