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 2019/03/30 23:44:49 UTC
[royale-asjs] branch feature/wizard-transitions updated:
jewel-wizard: more changes to css
This is an automated email from the ASF dual-hosted git repository.
carlosrovira pushed a commit to branch feature/wizard-transitions
in repository https://gitbox.apache.org/repos/asf/royale-asjs.git
The following commit(s) were added to refs/heads/feature/wizard-transitions by this push:
new 8d9091f jewel-wizard: more changes to css
8d9091f is described below
commit 8d9091f8963ab878db2b6c331874bebe6f5ffce9
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Sun Mar 31 00:44:42 2019 +0100
jewel-wizard: more changes to css
---
.../projects/Jewel/src/main/resources/defaults.css | 30 ++++++++--------
.../Jewel/src/main/sass/components/_wizard.sass | 42 +++++++++++-----------
2 files changed, 37 insertions(+), 35 deletions(-)
diff --git a/frameworks/projects/Jewel/src/main/resources/defaults.css b/frameworks/projects/Jewel/src/main/resources/defaults.css
index 7766037..574e245 100644
--- a/frameworks/projects/Jewel/src/main/resources/defaults.css
+++ b/frameworks/projects/Jewel/src/main/resources/defaults.css
@@ -3902,7 +3902,8 @@ j|BarTitle {
width: 100%;
height: 100%;
}
-.jewel .precontent {
+.jewel.precontent {
+ position: relative;
width: 100%;
flex: 1 0;
}
@@ -3913,30 +3914,33 @@ j|BarTitle {
justify-content: center;
cursor: pointer;
}
-.jewel .wizardcontent {
+.jewel.wizardcontent {
height: 100%;
flex-grow: 100;
+ position: inherit;
}
-.jewel .wizardpage {
+.jewel.wizardpage {
+ display: flex;
position: absolute;
- transition: transform, 0.5s;
- left: 80px;
- right: 80px;
- top: 0px;
- bottom: 0px;
- border: 1px solid red;
+ left: 73px;
+ right: 73px;
+ top: 63px;
+ bottom: 20px;
transition: transform, 0.5s;
transform: translateX(100%);
opacity: 0;
}
-.jewel .wizardpage.is-selected {
+.jewel.wizardpage > * {
+ width: 100%;
+}
+.jewel.wizardpage.is-selected {
transform: translateX(0%);
opacity: 1;
}
-.jewel .wizardpage.moveLeftFromCenter {
+.jewel.wizardpage.moveLeftFromCenter {
transform: translateX(-100%);
}
-.jewel .wizardpage.moveRightFromCenter {
+.jewel.wizardpage.moveRightFromCenter {
transform: translateX(100%);
}
@@ -3955,8 +3959,6 @@ j|WizardPage {
j|WizardContent {
IBeadView: ClassReference("org.apache.royale.html.beads.ContainerView");
IBeadLayout: ClassReference("org.apache.royale.jewel.beads.layouts.NullLayout");
- IViewport: ClassReference("org.apache.royale.jewel.supportClasses.scrollbar.ScrollingViewport");
- IViewportModel: ClassReference("org.apache.royale.html.beads.models.ViewportModel");
}
.jewel.main {
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_wizard.sass b/frameworks/projects/Jewel/src/main/sass/components/_wizard.sass
index 8e54a45..7052196 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_wizard.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_wizard.sass
@@ -31,7 +31,8 @@
&.wizardTitle
- .precontent
+ &.precontent
+ position: relative
width: 100%
flex: 1 0
@@ -45,43 +46,42 @@
.jewel.button
- .wizardcontent
+ &.wizardcontent
height: 100%
flex-grow: 100
- // position: relative
- .wizardpage
+ position: inherit
+
+ &.wizardpage
+ display: flex
position: absolute
- transition: transform, .5s
- left: 80px
- right: 80px
+
+ left: 0px
+ right: 0px
top: 0px
bottom: 0px
+ // left: 0
+ // right: 0
+ // top: 30px
+ // bottom: 0
// border: 1px solid red
transition: transform, .5s
transform: translateX(100%)
opacity: 0
+ > *
+ width: 100%
+ // flex: 0 0 auto
+
&.is-selected
transform: translateX(0%)
opacity: 1
+ &.scrollable
&.moveLeftFromCenter
transform: translateX(-100%)
- // &.moveCenterFromRight
- // transform: translateX(0%)
-
&.moveRightFromCenter
transform: translateX(100%)
-
- // &.moveCenterFromLeft
- // transform: translateX(0%)
-
- // &.moveRightFromCenter
- // transform: translateX(100%)
- // &.is-active
- // transform: translateX(0)
-
j|Wizard
IBeadView: ClassReference("org.apache.royale.jewel.beads.views.WizardView")
@@ -121,5 +121,5 @@ j|WizardPage
j|WizardContent
IBeadView: ClassReference("org.apache.royale.html.beads.ContainerView")
IBeadLayout: ClassReference("org.apache.royale.jewel.beads.layouts.NullLayout")
- IViewport: ClassReference("org.apache.royale.jewel.supportClasses.scrollbar.ScrollingViewport")
- IViewportModel: ClassReference("org.apache.royale.html.beads.models.ViewportModel")
+ // IViewport: ClassReference("org.apache.royale.jewel.supportClasses.scrollbar.ScrollingViewport")
+ // IViewportModel: ClassReference("org.apache.royale.html.beads.models.ViewportModel")