You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@flex.apache.org by ca...@apache.org on 2017/02/03 19:43:16 UTC
git commit: [flex-asjs] [refs/heads/develop] - Fix blog layout
Repository: flex-asjs
Updated Branches:
refs/heads/develop 4fce8b61f -> 361067d20
Fix blog layout
Project: http://git-wip-us.apache.org/repos/asf/flex-asjs/repo
Commit: http://git-wip-us.apache.org/repos/asf/flex-asjs/commit/361067d2
Tree: http://git-wip-us.apache.org/repos/asf/flex-asjs/tree/361067d2
Diff: http://git-wip-us.apache.org/repos/asf/flex-asjs/diff/361067d2
Branch: refs/heads/develop
Commit: 361067d20a2b06859f4b1fa822f7256b42fce304
Parents: 4fce8b6
Author: Carlos Rovira <ca...@apache.org>
Authored: Fri Feb 3 20:43:12 2017 +0100
Committer: Carlos Rovira <ca...@apache.org>
Committed: Fri Feb 3 20:43:12 2017 +0100
----------------------------------------------------------------------
examples/flexjs/MDLBlogExample/pom.xml | 4 +-
.../src/main/flex/BlogTemplate.mxml | 331 ++++++++++---------
2 files changed, 168 insertions(+), 167 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/361067d2/examples/flexjs/MDLBlogExample/pom.xml
----------------------------------------------------------------------
diff --git a/examples/flexjs/MDLBlogExample/pom.xml b/examples/flexjs/MDLBlogExample/pom.xml
index c1389a4..bd243f2 100644
--- a/examples/flexjs/MDLBlogExample/pom.xml
+++ b/examples/flexjs/MDLBlogExample/pom.xml
@@ -36,8 +36,8 @@
<properties>
<!-- Customize MDL colors using this the tool at : https://getmdl.io/customize/index.html -->
- <primary>indigo</primary>
- <accent>pink</accent>
+ <primary>grey</primary>
+ <accent>orange</accent>
</properties>
<build>
http://git-wip-us.apache.org/repos/asf/flex-asjs/blob/361067d2/examples/flexjs/MDLBlogExample/src/main/flex/BlogTemplate.mxml
----------------------------------------------------------------------
diff --git a/examples/flexjs/MDLBlogExample/src/main/flex/BlogTemplate.mxml b/examples/flexjs/MDLBlogExample/src/main/flex/BlogTemplate.mxml
index 9dfdcdc..bbad2f3 100644
--- a/examples/flexjs/MDLBlogExample/src/main/flex/BlogTemplate.mxml
+++ b/examples/flexjs/MDLBlogExample/src/main/flex/BlogTemplate.mxml
@@ -17,10 +17,11 @@ See the License for the specific language governing permissions and
limitations under the License.
-->
-<mdl:Grid xmlns:fx="http://ns.adobe.com/mxml/2009"
+<mdl:NavigationLayout xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:js="library://ns.apache.org/flexjs/basic"
xmlns:mdl="library://ns.apache.org/flexjs/mdl"
- xmlns:models="models.*">
+ xmlns:models="models.*"
+ className="demo-blog has-drawer">
<fx:Script>
<![CDATA[
@@ -36,209 +37,209 @@ limitations under the License.
<models:MenuModel id="blogMenuModel"/>
</mdl:model>
- <mdl:NavigationLayout className="demo-blog" fixedDrawer="true">
- <mdl:NavigationLayoutContent>
- <mdl:Grid className="demo-blog__posts">
-
- <mdl:Card className="coffee-pic">
+ <mdl:NavigationLayoutContent>
+ <mdl:Grid className="demo-blog__posts">
+
+ <mdl:Card className="coffee-pic">
+ <mdl:beads>
+ <mdl:GridCellBehaviour column="8"/>
+ </mdl:beads>
+ <mdl:CardMedia>
<mdl:beads>
- <mdl:GridCellBehaviour column="8"/>
+ <js:InnerHTML>
+ <![CDATA[<h3><a href="entry.html">Coffee Pic</a></h3>]]>
+ </js:InnerHTML>
+ <mdl:MdlTextColor textColor="grey-50"/>
</mdl:beads>
- <mdl:CardMedia>
+ </mdl:CardMedia>
+ <mdl:CardSupportingText className="meta">
+ <mdl:beads>
+ <mdl:MdlTextColor textColor="grey-600"/>
+ </mdl:beads>
+ <js:Div className="minilogo"/>
+ <js:Div>
<mdl:beads>
<js:InnerHTML>
- <![CDATA[<h3><a href="entry.html">Coffee Pic</a></h3>]]>
+ <![CDATA[<strong>The Newist</strong><span>2 days ago</span>]]>
</js:InnerHTML>
- <mdl:MdlTextColor textColor="grey-50"/>
- </mdl:beads>
- </mdl:CardMedia>
- <mdl:CardSupportingText className="meta">
- <mdl:beads>
- <mdl:MdlTextColor textColor="grey-600"/>
</mdl:beads>
- <js:Div className="minilogo"/>
- <js:Div>
+ </js:Div>
+ </mdl:CardSupportingText>
+ </mdl:Card>
+
+ <mdl:Card className="something-else">
+ <mdl:beads>
+ <mdl:GridCellBehaviour column="8" columnDesktop="4"/>
+ </mdl:beads>
+ <mdl:Button ripple="true" fab="true" accent="true">
+ <!--<mdl:materialIcon>
+ <mdl:MaterialIcon text="{MaterialIconType.ADD}">
<mdl:beads>
- <js:InnerHTML>
- <![CDATA[<strong>The Newist</strong><span>2 days ago</span>]]>
- </js:InnerHTML>
+ <mdl:MdlTextColor textColor="white"/>
</mdl:beads>
- </js:Div>
- </mdl:CardSupportingText>
- </mdl:Card>
-
- <mdl:Card className="something-else">
+ </mdl:MaterialIcon>
+ </mdl:materialIcon>-->
+ <mdl:beads>
+ <js:InnerHTML>
+ <![CDATA[<i class="material-icons mdl-color-text--white" role="presentation">add</i><span class="visuallyhidden">add</span>]]>
+ </js:InnerHTML>
+ </mdl:beads>
+ </mdl:Button>
+ <mdl:CardMedia>
<mdl:beads>
- <mdl:GridCellBehaviour column="8" columnDesktop="4"/>
+ <mdl:MdlColor color="white"/>
+ <mdl:MdlTextColor textColor="grey-600"/>
</mdl:beads>
- <mdl:Button ripple="true" fab="true" accent="true">
- <!--<mdl:materialIcon>
- <mdl:MaterialIcon text="{MaterialIconType.ADD}">
- <mdl:beads>
- <mdl:MdlTextColor textColor="white"/>
- </mdl:beads>
- </mdl:MaterialIcon>
- </mdl:materialIcon>-->
+ <js:Image url="images/logo.png"/>
+ <js:TextNode text="+1,337"/>
+ </mdl:CardMedia>
+ <mdl:CardSupportingText className="meta meta-fill">
+ <mdl:beads>
+ <mdl:MdlTextColor textColor="grey-600"/>
+ </mdl:beads>
+ <js:Div>
<mdl:beads>
<js:InnerHTML>
- <![CDATA[<i class="material-icons mdl-color-text--white" role="presentation">add</i><span class="visuallyhidden">add</span>]]>
+ <![CDATA[<strong>The Newist</strong>]]>
</js:InnerHTML>
</mdl:beads>
- </mdl:Button>
- <mdl:CardMedia>
+ </js:Div>
+ <mdl:Menu dataMdlFor="menubtn" ripple="true" bottom="true" left="false"
+ labelField="label" className="customMenuItemRenderer">
<mdl:beads>
- <mdl:MdlColor color="white"/>
- <mdl:MdlTextColor textColor="grey-600"/>
+ <js:ConstantBinding
+ sourceID="blogMenuModel"
+ sourcePropertyName="menuItems"
+ destinationPropertyName="dataProvider" />
</mdl:beads>
- <js:Image url="images/logo.png"/>
- <js:TextNode text="+1,337"/>
- </mdl:CardMedia>
- <mdl:CardSupportingText className="meta meta-fill">
+ </mdl:Menu>
+ <mdl:Button id="menubtn" icon="true" ripple="true">
<mdl:beads>
- <mdl:MdlTextColor textColor="grey-600"/>
+ <js:InnerHTML>
+ <![CDATA[<i class="material-icons mdl-color-text--white" role="presentation">more_vert</i><span class="visuallyhidden">show menu</span>]]>
+ </js:InnerHTML>
</mdl:beads>
- <js:Div>
- <mdl:beads>
- <js:InnerHTML>
- <![CDATA[<strong>The Newist</strong>]]>
- </js:InnerHTML>
- </mdl:beads>
- </js:Div>
- <mdl:Menu dataMdlFor="menubtn" ripple="true" bottom="true" left="false"
- labelField="label" className="customMenuItemRenderer">
- <mdl:beads>
- <js:ConstantBinding
- sourceID="blogMenuModel"
- sourcePropertyName="menuItems"
- destinationPropertyName="dataProvider" />
- </mdl:beads>
- </mdl:Menu>
- <mdl:Button id="menubtn" icon="true" ripple="true">
- <mdl:beads>
- <js:InnerHTML>
- <![CDATA[<i class="material-icons mdl-color-text--white" role="presentation">more_vert</i><span class="visuallyhidden">show menu</span>]]>
- </js:InnerHTML>
- </mdl:beads>
- </mdl:Button>
- </mdl:CardSupportingText>
- </mdl:Card>
+ </mdl:Button>
+ </mdl:CardSupportingText>
+ </mdl:Card>
- <mdl:Card className="on-the-road-again">
+ <mdl:Card className="on-the-road-again">
+ <mdl:beads>
+ <mdl:GridCellBehaviour column="12"/>
+ </mdl:beads>
+ <mdl:CardMedia>
<mdl:beads>
- <mdl:GridCellBehaviour column="12"/>
+ <js:InnerHTML>
+ <![CDATA[<h3><a href="entry.html">On the road again</a></h3>]]>
+ </js:InnerHTML>
+ <mdl:MdlTextColor textColor="grey-50"/>
</mdl:beads>
- <mdl:CardMedia>
- <mdl:beads>
- <js:InnerHTML>
- <![CDATA[<h3><a href="entry.html">On the road again</a></h3>]]>
- </js:InnerHTML>
- <mdl:MdlTextColor textColor="grey-50"/>
- </mdl:beads>
- </mdl:CardMedia>
- <mdl:CardSupportingText>
+ </mdl:CardMedia>
+ <mdl:CardSupportingText>
+ <mdl:beads>
+ <js:InnerHTML>
+ <![CDATA[Enim labore aliqua consequat ut quis ad occaecat aliquip incididunt. Sunt nulla eu enim irure enim nostrud aliqua consectetur ad consectetur sunt ullamco officia. Ex officia laborum et consequat duis.]]>
+ </js:InnerHTML>
+ <mdl:MdlTextColor textColor="grey-600"/>
+ </mdl:beads>
+ </mdl:CardSupportingText>
+ <mdl:CardSupportingText className="meta">
+ <js:Div className="minilogo"/>
+ <js:Div>
<mdl:beads>
<js:InnerHTML>
- <![CDATA[Enim labore aliqua consequat ut quis ad occaecat aliquip incididunt. Sunt nulla eu enim irure enim nostrud aliqua consectetur ad consectetur sunt ullamco officia. Ex officia laborum et consequat duis.]]>
+ <![CDATA[<strong>The Newist</strong><span>2 days ago</span>]]>
</js:InnerHTML>
- <mdl:MdlTextColor textColor="grey-600"/>
</mdl:beads>
- </mdl:CardSupportingText>
- <mdl:CardSupportingText className="meta">
- <js:Div className="minilogo"/>
- <js:Div>
- <mdl:beads>
- <js:InnerHTML>
- <![CDATA[<strong>The Newist</strong><span>2 days ago</span>]]>
- </js:InnerHTML>
- </mdl:beads>
- </js:Div>
- </mdl:CardSupportingText>
- </mdl:Card>
+ </js:Div>
+ </mdl:CardSupportingText>
+ </mdl:Card>
- <mdl:Card className="amazing">
+ <mdl:Card className="amazing">
+ <mdl:beads>
+ <mdl:GridCellBehaviour column="12"/>
+ </mdl:beads>
+ <mdl:CardTitle>
<mdl:beads>
- <mdl:GridCellBehaviour column="12"/>
+ <js:InnerHTML>
+ <![CDATA[<h3 class="quote"><a href="entry.html">I couldn\u2019t take any pictures but this was an amazing thing\u2026</a></h3>]]>
+ </js:InnerHTML>
+ <mdl:MdlTextColor textColor="grey-50"/>
</mdl:beads>
- <mdl:CardTitle>
- <mdl:beads>
- <js:InnerHTML>
- <![CDATA[<h3 class="quote"><a href="entry.html">I couldn\u2019t take any pictures but this was an amazing thing\u2026</a></h3>]]>
- </js:InnerHTML>
- <mdl:MdlTextColor textColor="grey-50"/>
- </mdl:beads>
- </mdl:CardTitle>
- <mdl:CardSupportingText>
+ </mdl:CardTitle>
+ <mdl:CardSupportingText>
+ <mdl:beads>
+ <js:InnerHTML>
+ <![CDATA[Enim labore aliqua consequat ut quis ad occaecat aliquip incididunt. Sunt nulla eu enim irure enim nostrud aliqua consectetur ad consectetur sunt ullamco officia. Ex officia laborum et consequat duis.]]>
+ </js:InnerHTML>
+ <mdl:MdlTextColor textColor="grey-600"/>
+ </mdl:beads>
+ </mdl:CardSupportingText>
+ <mdl:CardSupportingText className="meta">
+ <js:Div className="minilogo"/>
+ <js:Div>
<mdl:beads>
<js:InnerHTML>
- <![CDATA[Enim labore aliqua consequat ut quis ad occaecat aliquip incididunt. Sunt nulla eu enim irure enim nostrud aliqua consectetur ad consectetur sunt ullamco officia. Ex officia laborum et consequat duis.]]>
+ <![CDATA[<strong>The Newist</strong><span>2 days ago</span>]]>
</js:InnerHTML>
- <mdl:MdlTextColor textColor="grey-600"/>
</mdl:beads>
- </mdl:CardSupportingText>
- <mdl:CardSupportingText className="meta">
- <js:Div className="minilogo"/>
- <js:Div>
- <mdl:beads>
- <js:InnerHTML>
- <![CDATA[<strong>The Newist</strong><span>2 days ago</span>]]>
- </js:InnerHTML>
- </mdl:beads>
- </js:Div>
- </mdl:CardSupportingText>
- </mdl:Card>
+ </js:Div>
+ </mdl:CardSupportingText>
+ </mdl:Card>
- <mdl:Card className="shopping">
+ <mdl:Card className="shopping">
+ <mdl:beads>
+ <mdl:GridCellBehaviour column="12"/>
+ </mdl:beads>
+ <mdl:CardMedia>
<mdl:beads>
- <mdl:GridCellBehaviour column="12"/>
+ <js:InnerHTML>
+ <![CDATA[<h3><a href="entry.html">Shopping</a></h3>]]>
+ </js:InnerHTML>
+ <mdl:MdlTextColor textColor="grey-50"/>
</mdl:beads>
- <mdl:CardMedia>
+ </mdl:CardMedia>
+ <mdl:CardSupportingText>
+ <mdl:beads>
+ <js:InnerHTML>
+ <![CDATA[Enim labore aliqua consequat ut quis ad occaecat aliquip incididunt. Sunt nulla eu enim irure enim nostrud aliqua consectetur ad consectetur sunt ullamco officia. Ex officia laborum et consequat duis.]]>
+ </js:InnerHTML>
+ <mdl:MdlTextColor textColor="grey-600"/>
+ </mdl:beads>
+ </mdl:CardSupportingText>
+ <mdl:CardSupportingText className="meta">
+ <js:Div className="minilogo"/>
+ <js:Div>
<mdl:beads>
<js:InnerHTML>
- <![CDATA[<h3><a href="entry.html">Shopping</a></h3>]]>
+ <![CDATA[<strong>The Newist</strong><span>2 days ago</span>]]>
</js:InnerHTML>
- <mdl:MdlTextColor textColor="grey-50"/>
</mdl:beads>
- </mdl:CardMedia>
- <mdl:CardSupportingText>
+ </js:Div>
+ </mdl:CardSupportingText>
+ </mdl:Card>
+ <mdl:Footer mini="true" width="500">
+
+ <mdl:FooterLeftSection>
+ <mdl:FooterLogo text="Title"/>
+ <mdl:FooterLinkList className="footerMiniLinkListItemRenderer">
<mdl:beads>
- <js:InnerHTML>
- <![CDATA[Enim labore aliqua consequat ut quis ad occaecat aliquip incididunt. Sunt nulla eu enim irure enim nostrud aliqua consectetur ad consectetur sunt ullamco officia. Ex officia laborum et consequat duis.]]>
- </js:InnerHTML>
- <mdl:MdlTextColor textColor="grey-600"/>
+ <js:ConstantBinding
+ sourceID="model"
+ sourcePropertyName="links"
+ destinationPropertyName="dataProvider" />
</mdl:beads>
- </mdl:CardSupportingText>
- <mdl:CardSupportingText className="meta">
- <js:Div className="minilogo"/>
- <js:Div>
- <mdl:beads>
- <js:InnerHTML>
- <![CDATA[<strong>The Newist</strong><span>2 days ago</span>]]>
- </js:InnerHTML>
- </mdl:beads>
- </js:Div>
- </mdl:CardSupportingText>
- </mdl:Card>
- <mdl:Footer mini="true" width="500">
+ </mdl:FooterLinkList>
+ </mdl:FooterLeftSection>
- <mdl:FooterLeftSection>
- <mdl:FooterLogo text="Title"/>
- <mdl:FooterLinkList className="footerMiniLinkListItemRenderer">
- <mdl:beads>
- <js:ConstantBinding
- sourceID="model"
- sourcePropertyName="links"
- destinationPropertyName="dataProvider" />
- </mdl:beads>
- </mdl:FooterLinkList>
- </mdl:FooterLeftSection>
+ <mdl:FooterRightSection>
+ <mdl:FooterSocialButton>1</mdl:FooterSocialButton>
+ <mdl:FooterSocialButton>2</mdl:FooterSocialButton>
+ <mdl:FooterSocialButton>3</mdl:FooterSocialButton>
+ </mdl:FooterRightSection>
+ </mdl:Footer>
+ </mdl:Grid>
+ </mdl:NavigationLayoutContent>
+
+</mdl:NavigationLayout>
- <mdl:FooterRightSection>
- <mdl:FooterSocialButton>1</mdl:FooterSocialButton>
- <mdl:FooterSocialButton>2</mdl:FooterSocialButton>
- <mdl:FooterSocialButton>3</mdl:FooterSocialButton>
- </mdl:FooterRightSection>
- </mdl:Footer>
- </mdl:Grid>
- </mdl:NavigationLayoutContent>
- </mdl:NavigationLayout>
-</mdl:Grid>