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 2021/01/31 18:48:48 UTC
[royale-asjs] branch develop updated: jewel-layouts: consider "Gap"
for "itemsReverse". This is for first question in #1070
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 18e4390 jewel-layouts: consider "Gap" for "itemsReverse". This is for first question in #1070
18e4390 is described below
commit 18e43900af4842b69102a592e1b71a8db7efe5d8
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Sun Jan 31 19:48:37 2021 +0100
jewel-layouts: consider "Gap" for "itemsReverse". This is for first question in #1070
---
.../projects/Jewel/src/main/resources/defaults.css | 120 +++++++++++++++++++++
.../Jewel/src/main/sass/components/_layout.sass | 18 ++++
2 files changed, 138 insertions(+)
diff --git a/frameworks/projects/Jewel/src/main/resources/defaults.css b/frameworks/projects/Jewel/src/main/resources/defaults.css
index 0ee8dcb..f9dd302 100644
--- a/frameworks/projects/Jewel/src/main/resources/defaults.css
+++ b/frameworks/projects/Jewel/src/main/resources/defaults.css
@@ -1157,6 +1157,66 @@ j|Label {
.layout.horizontal.gap-10x3px > * {
margin-left: 30px;
}
+.layout.horizontal.itemsReverse.gap-1x3px > *:last-child {
+ margin-left: 0px;
+}
+.layout.horizontal.itemsReverse.gap-1x3px > * {
+ margin-left: 3px;
+}
+.layout.horizontal.itemsReverse.gap-2x3px > *:last-child {
+ margin-left: 0px;
+}
+.layout.horizontal.itemsReverse.gap-2x3px > * {
+ margin-left: 6px;
+}
+.layout.horizontal.itemsReverse.gap-3x3px > *:last-child {
+ margin-left: 0px;
+}
+.layout.horizontal.itemsReverse.gap-3x3px > * {
+ margin-left: 9px;
+}
+.layout.horizontal.itemsReverse.gap-4x3px > *:last-child {
+ margin-left: 0px;
+}
+.layout.horizontal.itemsReverse.gap-4x3px > * {
+ margin-left: 12px;
+}
+.layout.horizontal.itemsReverse.gap-5x3px > *:last-child {
+ margin-left: 0px;
+}
+.layout.horizontal.itemsReverse.gap-5x3px > * {
+ margin-left: 15px;
+}
+.layout.horizontal.itemsReverse.gap-6x3px > *:last-child {
+ margin-left: 0px;
+}
+.layout.horizontal.itemsReverse.gap-6x3px > * {
+ margin-left: 18px;
+}
+.layout.horizontal.itemsReverse.gap-7x3px > *:last-child {
+ margin-left: 0px;
+}
+.layout.horizontal.itemsReverse.gap-7x3px > * {
+ margin-left: 21px;
+}
+.layout.horizontal.itemsReverse.gap-8x3px > *:last-child {
+ margin-left: 0px;
+}
+.layout.horizontal.itemsReverse.gap-8x3px > * {
+ margin-left: 24px;
+}
+.layout.horizontal.itemsReverse.gap-9x3px > *:last-child {
+ margin-left: 0px;
+}
+.layout.horizontal.itemsReverse.gap-9x3px > * {
+ margin-left: 27px;
+}
+.layout.horizontal.itemsReverse.gap-10x3px > *:last-child {
+ margin-left: 0px;
+}
+.layout.horizontal.itemsReverse.gap-10x3px > * {
+ margin-left: 30px;
+}
.layout.horizontal.sameWidths > * {
flex: 1 0 0;
}
@@ -1259,6 +1319,66 @@ j|Label {
.layout.vertical.gap-10x3px > * {
margin-top: 30px;
}
+.layout.vertical.itemsReverse.gap-1x3px > *:-child {
+ margin-top: 0px;
+}
+.layout.vertical.itemsReverse.gap-1x3px > * {
+ margin-top: 3px;
+}
+.layout.vertical.itemsReverse.gap-2x3px > *:-child {
+ margin-top: 0px;
+}
+.layout.vertical.itemsReverse.gap-2x3px > * {
+ margin-top: 6px;
+}
+.layout.vertical.itemsReverse.gap-3x3px > *:-child {
+ margin-top: 0px;
+}
+.layout.vertical.itemsReverse.gap-3x3px > * {
+ margin-top: 9px;
+}
+.layout.vertical.itemsReverse.gap-4x3px > *:-child {
+ margin-top: 0px;
+}
+.layout.vertical.itemsReverse.gap-4x3px > * {
+ margin-top: 12px;
+}
+.layout.vertical.itemsReverse.gap-5x3px > *:-child {
+ margin-top: 0px;
+}
+.layout.vertical.itemsReverse.gap-5x3px > * {
+ margin-top: 15px;
+}
+.layout.vertical.itemsReverse.gap-6x3px > *:-child {
+ margin-top: 0px;
+}
+.layout.vertical.itemsReverse.gap-6x3px > * {
+ margin-top: 18px;
+}
+.layout.vertical.itemsReverse.gap-7x3px > *:-child {
+ margin-top: 0px;
+}
+.layout.vertical.itemsReverse.gap-7x3px > * {
+ margin-top: 21px;
+}
+.layout.vertical.itemsReverse.gap-8x3px > *:-child {
+ margin-top: 0px;
+}
+.layout.vertical.itemsReverse.gap-8x3px > * {
+ margin-top: 24px;
+}
+.layout.vertical.itemsReverse.gap-9x3px > *:-child {
+ margin-top: 0px;
+}
+.layout.vertical.itemsReverse.gap-9x3px > * {
+ margin-top: 27px;
+}
+.layout.vertical.itemsReverse.gap-10x3px > *:-child {
+ margin-top: 0px;
+}
+.layout.vertical.itemsReverse.gap-10x3px > * {
+ margin-top: 30px;
+}
.layout.grid {
flex-flow: row wrap;
width: 100%;
diff --git a/frameworks/projects/Jewel/src/main/sass/components/_layout.sass b/frameworks/projects/Jewel/src/main/sass/components/_layout.sass
index 221fb41..fa02d33 100644
--- a/frameworks/projects/Jewel/src/main/sass/components/_layout.sass
+++ b/frameworks/projects/Jewel/src/main/sass/components/_layout.sass
@@ -88,6 +88,15 @@ $gap-size: 10px !default
margin-left: 0px
> *
margin-left: $gap + $i * $gap-step
+
+ &.itemsReverse
+ @for $i from 1 through $gaps
+ &.gap-#{$i}x#{$gap-step}px
+ > *:last-child
+ margin-left: 0px
+ > *
+ margin-left: $gap + $i * $gap-step
+
&.sameWidths
> *
flex: 1 0 0
@@ -148,6 +157,15 @@ $gap-size: 10px !default
margin-top: 0px
> *
margin-top: $gap + $i * $gap-step
+
+ &.itemsReverse
+ @for $i from 1 through $gaps
+ &.gap-#{$i}x#{$gap-step}px
+ > *:-child
+ margin-top: 0px
+ > *
+ margin-top: $gap + $i * $gap-step
+
// this not compile******
// &.gap