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/03/31 23:24:47 UTC
[royale-asjs] branch develop updated: tour-de-jewel: add the rest
of fontawesome examples
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 396d459 tour-de-jewel: add the rest of fontawesome examples
396d459 is described below
commit 396d45901b7a49d338c937d811615b49de217f31
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Wed Apr 1 01:24:43 2020 +0200
tour-de-jewel: add the rest of fontawesome examples
---
.../src/main/royale/MiscelaneaPlayGound.mxml | 104 +++++++++++----------
1 file changed, 57 insertions(+), 47 deletions(-)
diff --git a/examples/jewel/TourDeJewel/src/main/royale/MiscelaneaPlayGound.mxml b/examples/jewel/TourDeJewel/src/main/royale/MiscelaneaPlayGound.mxml
index 9fe5f2b..ccd428f 100644
--- a/examples/jewel/TourDeJewel/src/main/royale/MiscelaneaPlayGound.mxml
+++ b/examples/jewel/TourDeJewel/src/main/royale/MiscelaneaPlayGound.mxml
@@ -92,110 +92,120 @@ limitations under the License.
</j:beads>
<j:HGroup gap="3">
- <j:VGroup gap="3" className="primary-normal">
+ <j:VGroup gap="3">
<html:H3 text="Sizes" className="secondary-normal"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}"/>
<j:Label text="normal"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="lg"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="lg"/>
<j:Label text="lg"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="2x"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="2x"/>
<j:Label text="2x"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="3x"/>
<j:Label text="3x"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="4x"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="4x"/>
<j:Label text="4x"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="5x"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="5x"/>
<j:Label text="5x"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" size="48"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" size="48"/>
<j:Label text="size=48"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" fixedWidth="true"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" fixedWidth="true"/>
<j:Label text="fixed width"/>
</j:VGroup>
<j:VGroup gap="3" className="primary-normal">
<html:H3 text="Rotations" className="secondary-normal"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" rotation="90"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" rotation="90"/>
<j:Label text="rotation 90º"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" rotation="180"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" rotation="180"/>
<j:Label text="rotation 180º"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" rotation="270"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" rotation="270"/>
<j:Label text="rotation 270º"/>
<html:H3 text="Flips" className="secondary-normal"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" flipHorizontal="true"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" flipHorizontal="true"/>
<j:Label text="flipHorizontal"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" flipVertical="true"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" flipVertical="true"/>
<j:Label text="flipVertical"/>
<html:H3 text="Animations" className="secondary-normal"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" spin="true"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" spin="true"/>
<j:Label text="spin"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" pulse="true"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" pulse="true"/>
<j:Label text="pulse"/>
</j:VGroup>
- <j:VGroup gap="3" className="primary-normal">
+ <j:VGroup gap="3">
<html:H3 text="Borders" className="secondary-normal"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" border="true"/>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" border="true"/>
<j:Label text="with border"/>
+ <html:Div width="250">
+ <html:P>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" border="true" pullRight="true"/>
+ <js:TextNode text="Lorem ipsum dolor si amet, consectetur adipiscing incidunt ut labore et dolore magna aliquam erat nostrud exercitation ullamcorper suscipit laboris nis duis autem vel eum irure dolor in reprehenderit i, dolore eu fugiat nulla pariatur."/>
+ </html:P>
+ </html:Div>
+
<j:Label text="with border + pull right"/>
+
<html:Div width="250">
- <html:text>
- <![CDATA[…tomorrow we will run faster, stretch out our arms farther… And then one fine morning— So we beat on, boats against the current, borne back ceaselessly into the past.
- ]]>
- </html:text>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" border="true" pullRight="true"/>
+ <html:P>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" border="true" pullLeft="true"/>
+ <js:TextNode text="Lorem ipsum dolor si amet, consectetur adipiscing incidunt ut labore et dolore magna aliquam erat nostrud exercitation ullamcorper suscipit laboris nis duis autem vel eum irure dolor in reprehenderit i, dolore eu fugiat nulla pariatur."/>
+ </html:P>
+ </html:Div>
+
+ <j:Label text="with border + pull left"/>
+
+ <html:Div width="250">
+ <html:P>
+ <js:FontAwesomeIcon className="primary-normal" type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" pullRight="true"/>
+ <js:TextNode text="Lorem ipsum dolor si amet, consectetur adipiscing incidunt ut labore et dolore magna aliquam erat nostrud exercitation ullamcorper suscipit laboris nis duis autem vel eum irure dolor in reprehenderit i, dolore eu fugiat nulla pariatur."/>
+ </html:P>
</html:Div>
<j:Label text="no border + pull right"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" pullRight="true"/>
- <j:Label multiline="true" width="250">
- <j:html>
- <![CDATA[…tomorrow we will run faster, stretch out our arms farther… And then one fine morning— So we beat on, boats against the current, borne back ceaselessly into the past.
- ]]>
- </j:html>
- </j:Label>
+ </j:VGroup>
- <j:Label text="with border + pull left"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" border="true" pullLeft="true"/>
- <j:Label multiline="true" width="250">
- <j:html>
- <![CDATA[…tomorrow we will run faster, stretch out our arms farther… And then one fine morning— So we beat on, boats against the current, borne back ceaselessly into the past.
- ]]>
- </j:html>
- </j:Label>
+ <j:VGroup gap="3">
+ <html:H3 text="IconButton" className="secondary-normal"/>
+
+ <j:IconButton emphasis="primary" text="Twitter">
+ <j:icon>
+ <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x"/>
+ </j:icon>
+ </j:IconButton>
+ <html:H3 text="ToggleButton" className="secondary-normal"/>
+
+ <j:ToggleButton emphasis="secondary" text="Black Book" selectedText="White Book">
+ <j:icon>
+ <js:FontAwesomeToggleIcon type="{FontAwesomeIconType.ADDRESS_BOOK}"
+ selectedType="{FontAwesomeIconType.ADDRESS_BOOK_O}"
+ relativeSize="3x"/>
+ </j:icon>
+ </j:ToggleButton>
</j:VGroup>
</j:HGroup>
</j:CardPrimaryContent>
- <!-- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" dark="true"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" light="true"/>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}" relativeSize="3x" inactive="true"/>
-
- <j:IconButton emphasis="secondary" unboxed="true">
- <j:icon>
- <js:FontAwesomeIcon type="{FontAwesomeIconType.TWITTER}"/>
- </j:icon>
- </j:IconButton> -->
</j:Card>
</j:GridCell>
</j:Grid>