flex-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From carlosrov...@apache.org
Subject [1/7] git commit: [flex-asjs] [refs/heads/develop] - More Card examples
Date Mon, 14 Nov 2016 18:22:47 GMT
Repository: flex-asjs
Updated Branches:
  refs/heads/develop 6ab2498a3 -> 7982279f1


More Card examples


Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo
Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/8a2610f3
Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/8a2610f3
Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/8a2610f3

Branch: refs/heads/develop
Commit: 8a2610f3a69da98ef03c484dc94661acb7346f46
Parents: 47aded4
Author: Carlos Rovira <carlosrovira@apache.org>
Authored: Fri Nov 11 14:07:42 2016 +0100
Committer: Carlos Rovira <carlosrovira@apache.org>
Committed: Sat Nov 12 10:06:54 2016 +0100

----------------------------------------------------------------------
 .../flexjs/MDLExample/src/main/flex/App.mxml    |  78 +++++++++++++------
 .../src/main/resources/assets/dog.png           | Bin 0 -> 9020 bytes
 .../src/main/resources/assets/image_card.jpg    | Bin 0 -> 117457 bytes
 .../src/main/resources/mdl-styles.css           |  12 ++-
 4 files changed, 66 insertions(+), 24 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/8a2610f3/examples/flexjs/MDLExample/src/main/flex/App.mxml
----------------------------------------------------------------------
diff --git a/examples/flexjs/MDLExample/src/main/flex/App.mxml b/examples/flexjs/MDLExample/src/main/flex/App.mxml
index 783281a..f68673a 100644
--- a/examples/flexjs/MDLExample/src/main/flex/App.mxml
+++ b/examples/flexjs/MDLExample/src/main/flex/App.mxml
@@ -82,10 +82,6 @@ limitations under the License.
                 <mdl:RadioButton groupName="g1" text="Ripple" ripple="true"/>
                 <mdl:RadioButton groupName="g1" text="Red"/>
 
-                <mdl:Slider className="mdlsl_example"/>
-
-                <mdl:Slider minimum="0" maximum="10" value="2" stepSize="2" width="200"/>
-
                 <js:VContainer>
                     <js:Div text="account_box" className="material-icons" style="color:
rgba(0, 0, 0, 0.24);">
                         <js:beads>
@@ -113,25 +109,61 @@ limitations under the License.
                     
                 </js:VContainer>
 
-                <mdl:Card width="512" shadow="2">
-                    <mdl:CardTitle className="cardTitle" style="color: #fff;">
-                        <js:H2 text="Welcome" className="mdl-card__title-text"/>
-                    </mdl:CardTitle>
-                    <mdl:CardSupportingText>
-                        <js:MultilineLabel text="Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia..."/>
-                    </mdl:CardSupportingText>
-                    <mdl:CardActions border="true">
-                        <mdl:Button text="Get Started" ripple="true" colored="true"/>
-                    </mdl:CardActions>
-                    <mdl:CardMenu>
-                        <mdl:Button icon="true" ripple="true" style="color: #fff;">
-                            <i class="material-icons">share</i>
-                        </mdl:Button>
-                    </mdl:CardMenu>
-                </mdl:Card>
-
-
-                    <!--<mdl:CardMedia>
+                <js:HContainer>
+                    <mdl:Card width="512" shadow="2" style="margin:10;">
+                        <mdl:CardTitle className="cardTitle">
+                            <js:H2 text="Welcome" className="mdl-card__title-text"/>
+                        </mdl:CardTitle>
+                        <mdl:CardSupportingText>
+                            <js:MultilineLabel text="Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia..."/>
+                        </mdl:CardSupportingText>
+                        <mdl:CardActions border="true">
+                            <mdl:Button text="Get Started" ripple="true" colored="true"/>
+                        </mdl:CardActions>
+                        <mdl:CardMenu>
+                            <mdl:Button icon="true" ripple="true" style="color: #fff;">
+                                <i class="material-icons">share</i>
+                            </mdl:Button>
+                        </mdl:CardMenu>
+                    </mdl:Card>
+
+                    <mdl:Slider className="mdlsl_example"/>
+                    <mdl:Slider minimum="0" maximum="10" value="2" stepSize="2" width="200"/>
+
+                    <mdl:Card width="320" height="320" shadow="2" style="margin:10;">
+                        <mdl:CardTitle className="dogTitle" style="color: #fff;">
+                            <js:H2 text="Update" className="mdl-card__title-text"/>
+                        </mdl:CardTitle>
+                        <mdl:CardSupportingText>
+                            <js:MultilineLabel text="Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Aenan convallis."/>
+                        </mdl:CardSupportingText>
+                        <mdl:CardActions border="true">
+                            <mdl:Button colored="true" ripple="true" text="View Updates"/>
+                        </mdl:CardActions>
+                    </mdl:Card>
+
+                    <mdl:Card width="256" height="256" shadow="2" style="margin:10;background:
url('assets/image_card.jpg') center / cover">
+                        <mdl:CardTitle/>
+                        <mdl:CardActions style="height: 52px; padding: 16px; background:
rgba(0, 0, 0, 0.2);">
+                            <js:Span text="Image.jpg" style="color: #fff; font-size: 14px;
font-weight: 500;"/>
+                        </mdl:CardActions>
+                    </mdl:Card>
+                </js:HContainer>
+
+                
+                 <!--
+                <mdl:Spacer/>
+                <mdl:Button id="demo_menu" icon="true">
+                    <i class="material-icons">more_vert</i>
+                </mdl:Button>
+
+                <mdl:Menu ripple="true" dataMdlFor="demo_menu">
+                    <mdl:MenuItem text="Some Action"/>
+                    <mdl:MenuItem text="Another Action"/>
+                </mdl:Menu>
+
+                
+                   <mdl:CardMedia>
                         <js:Image url="assets/Unknown.jpg"  height="176"/>
                     </mdl:CardMedia>-->
 

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/8a2610f3/examples/flexjs/MDLExample/src/main/resources/assets/dog.png
----------------------------------------------------------------------
diff --git a/examples/flexjs/MDLExample/src/main/resources/assets/dog.png b/examples/flexjs/MDLExample/src/main/resources/assets/dog.png
new file mode 100644
index 0000000..1aace48
Binary files /dev/null and b/examples/flexjs/MDLExample/src/main/resources/assets/dog.png
differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/8a2610f3/examples/flexjs/MDLExample/src/main/resources/assets/image_card.jpg
----------------------------------------------------------------------
diff --git a/examples/flexjs/MDLExample/src/main/resources/assets/image_card.jpg b/examples/flexjs/MDLExample/src/main/resources/assets/image_card.jpg
new file mode 100644
index 0000000..ef94dfd
Binary files /dev/null and b/examples/flexjs/MDLExample/src/main/resources/assets/image_card.jpg
differ

http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/8a2610f3/examples/flexjs/MDLExample/src/main/resources/mdl-styles.css
----------------------------------------------------------------------
diff --git a/examples/flexjs/MDLExample/src/main/resources/mdl-styles.css b/examples/flexjs/MDLExample/src/main/resources/mdl-styles.css
index d87e38c..5d5fae4 100644
--- a/examples/flexjs/MDLExample/src/main/resources/mdl-styles.css
+++ b/examples/flexjs/MDLExample/src/main/resources/mdl-styles.css
@@ -42,10 +42,20 @@ Image
 
 .cardTitle
 {
-	color: #fff;
+	color: #ffffff;
 	height: 176px;
 	background-image:url('assets/Unknown.jpg'); /*center / cover;*/
 	background-size: cover;
 	background-position: 50% 50%;
 	background-repeat: initial initial;
+}
+
+.dogTitle
+{
+	color: #fff;
+	height: 176px;
+	background-image: url('assets/dog.png'); /*bottom right 15% no-repeat #46B6AC*/
+	background-position: right 15% bottom 0%; 
+	background-repeat: no-repeat no-repeat;
+	background-color: rgb(70, 182, 172); 
 }
\ No newline at end of file


Mime
View raw message