mirror of
https://github.com/pattern-lab/patternlab-php.git
synced 2025-01-17 06:08:23 +01:00
Organisms, templates and pages
This commit is contained in:
Brad Frost
parent
4551fa419a
commit
ed5d22d419
@ -0,0 +1,15 @@
|
||||
<section class="comments section">
|
||||
<div class="comments-container" id="comments-container">
|
||||
<h2 class="section-title">59 Comments</h2>
|
||||
<?php inc('molecule','comment-form'); ?>
|
||||
{{> m-forms-comment-form }}
|
||||
<div class="comment-list">
|
||||
{{> m-components-single-comment }}
|
||||
{{> m-components-single-comment }}
|
||||
{{> m-components-single-comment }}
|
||||
{{> m-components-single-comment }}
|
||||
{{> m-components-single-comment }}
|
||||
</div>
|
||||
</div>
|
||||
{{> m-navigation-pagination }}
|
||||
</section>
|
||||
@ -0,0 +1,10 @@
|
||||
<div class="carousel-list-carousel">
|
||||
<div class="carousel-container">
|
||||
{{> m-blocks-inset-block }}
|
||||
<div>
|
||||
<div class="carousel-controls">
|
||||
<a href="#" class="carousel-prev">←</a>
|
||||
<div class="carousel-pagination">1/5</div>
|
||||
<a href="#" class="carousel-next">→</a>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,10 @@
|
||||
<section class="section latest-posts">
|
||||
<h2 class="section-title">Latest Posts</h2>
|
||||
<ul class="post-list">
|
||||
<li>{{> m-blocks-media-block }}</li>
|
||||
<li>{{> m-blocks-media-block }}</li>
|
||||
<li>{{> m-blocks-media-block }}</li>
|
||||
<li>{{> m-blocks-media-block }}</li>
|
||||
<li>{{> m-blocks-media-block }}</li>
|
||||
</ul>
|
||||
</section>
|
||||
@ -0,0 +1,12 @@
|
||||
<section class="section related-posts">
|
||||
<h3 class="section-title">Recent Tweets</h3>
|
||||
<ul class="headline-list">
|
||||
<li><h4><a href="#">Headline Lorem ipsum dolor sit amet</a></h4> <?php inc('atom','time') ?></li>
|
||||
<li><h4><a href="#">Laborum, molestiae, rerum, dolores eveniet </a></h4> <?php inc('atom','time') ?></li>
|
||||
<li><h4><a href="#">quae est fugit distinctio iure odit minus non ipsum </a></h4> <?php inc('atom','time') ?></li>
|
||||
<li><h4><a href="#">dolorum deserunt omnis voluptates voluptatum</a></h4> <?php inc('atom','time') ?></li>
|
||||
<li><h4><a href="#">nventore dignissimos vel molestiae, rerum, dolore</a></h4> <?php inc('atom','time') ?></li>
|
||||
<li><h4><a href="#"></a></h4></li>
|
||||
</ul>
|
||||
<a href="#" class="text-btn">Follow us on Twitter</a>
|
||||
</section>
|
||||
@ -0,0 +1,11 @@
|
||||
<section class="section related-posts">
|
||||
<h3 class="section-title">Related Posts</h3>
|
||||
<ul class="headline-list">
|
||||
<li><h4><a href="#">Headline Lorem ipsum dolor sit amet</a></h4></li>
|
||||
<li><h4><a href="#">Laborum, molestiae, rerum, dolores eveniet </a></h4></li>
|
||||
<li><h4><a href="#">quae est fugit distinctio iure odit minus non ipsum </a></h4></li>
|
||||
<li><h4><a href="#">dolorum deserunt omnis voluptates voluptatum</a></h4></li>
|
||||
<li><h4><a href="#">nventore dignissimos vel molestiae, rerum, dolore</a></h4></li>
|
||||
<li><h4><a href="#"></a></h4></li>
|
||||
</ul>
|
||||
</section>
|
||||
24
source/patterns/p-article/p-article.mustache
Normal file
24
source/patterns/p-article/p-article.mustache
Normal file
@ -0,0 +1,24 @@
|
||||
<div class="page" id="page">
|
||||
{{> o-global-header }}
|
||||
<div role="main">
|
||||
<div class="l-two-col">
|
||||
<div class="l-main">
|
||||
<article class="article">
|
||||
<header class="article-header">
|
||||
<h1>Article Headline Lorem ipsum dolor sit amet</h1>
|
||||
{{> m-text-byline-author-time }}
|
||||
</header>
|
||||
{{> o-article-article-body }}
|
||||
</article><!--end .article-->
|
||||
{{> m-components-social-share }}
|
||||
{{> o-comments-comment-thread }}
|
||||
</div><!--end l-main-->
|
||||
|
||||
<div class="l-sidebar">
|
||||
{{> o-sections-related-posts }}
|
||||
{{> o-sections-recent-tweets }}
|
||||
</div><!--end l-sidebar-->
|
||||
</div><!--end l-two-col-->
|
||||
</div><!--End role=main-->
|
||||
{{> o-global-footer }}
|
||||
</div>
|
||||
16
source/patterns/p-blog/p-blog.mustache
Normal file
16
source/patterns/p-blog/p-blog.mustache
Normal file
@ -0,0 +1,16 @@
|
||||
<div class="page" id="page">
|
||||
{{> o-global-header }}
|
||||
<div role="main">
|
||||
<h1>Latest Posts</h1>
|
||||
<div class="l-two-col">
|
||||
<div class="l-main">
|
||||
{{> m-navigation-pagination }}
|
||||
</div><!--end l-main-->
|
||||
|
||||
<div class="l-sidebar">
|
||||
|
||||
</div><!--end l-sidebar-->
|
||||
</div><!--end two-col-->
|
||||
</div><!--End role=main-->
|
||||
{{> o-global-footer }}
|
||||
</div>
|
||||
31
source/patterns/p-homepage/p-homepage.mustache
Normal file
31
source/patterns/p-homepage/p-homepage.mustache
Normal file
@ -0,0 +1,31 @@
|
||||
<div class="page" id="page">
|
||||
{{> o-global-header }}
|
||||
<div role="main">
|
||||
{{> m-blocks-block-hero }}
|
||||
<div class="g g-3up">
|
||||
<div class="gi">
|
||||
{{> m-blocks-inset-block }}
|
||||
</div>
|
||||
<div class="gi">
|
||||
{{> m-blocks-inset-block }}
|
||||
</div>
|
||||
<div class="gi">
|
||||
{{> m-blocks-inset-block }}
|
||||
</div>
|
||||
</div><!--end 3up-->
|
||||
|
||||
<hr />
|
||||
|
||||
<div class="l-two-col">
|
||||
<div class="l-main">
|
||||
{{> o-sections-latest-posts }}
|
||||
</div>
|
||||
|
||||
<div class="l-sidebar">
|
||||
{{> o-sections-recent-tweets }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div><!--End role=main-->
|
||||
{{> o-global-footer }}
|
||||
</div>
|
||||
@ -1,58 +0,0 @@
|
||||
{{> o-global-header }}
|
||||
<div role="main">
|
||||
<article class="article">
|
||||
<header class="article-header">
|
||||
<div class="eyebrow">PopWatch</div> <div class="eyebrow">Oscars</div>
|
||||
<h1>Jack Black gets roasted: Here are the top 15 zingers of the night</h1>
|
||||
{{> m-text-byline-author-time }}
|
||||
</header>
|
||||
<div class="text article-entry">
|
||||
<div class="wp-image">
|
||||
{{> a-images-landscape-4x3 }}
|
||||
<p class="wp-caption-text">Image Credit: Charles Eshelman</p>
|
||||
</div>
|
||||
{{> o-article-article-body }}
|
||||
</div>
|
||||
<footer class="article-footer">
|
||||
{{> m-components-social-article }}
|
||||
</footer>
|
||||
</article>
|
||||
<section id="comments" class="comments box">
|
||||
<h3>Post a comment</h3>
|
||||
{{> m-forms-comment-form }}
|
||||
<a href="#" class="btn btn-block">32 Comments</a>
|
||||
</section>
|
||||
|
||||
<section class="box">
|
||||
<h3>Related</h3>
|
||||
<ul class="bullet-list">
|
||||
<li><a href="#">Jack Black is getting a Friars Club roast–let's get the ball rolling!</a></li>
|
||||
<li><a href="#">From 'Jurassic Park' to 'Back to the Future': Movies meant to be seen on the big screen</a></li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section class="box">
|
||||
<h3>More from Pattern Watch</h3>
|
||||
<ul class="bullet-list">
|
||||
<li><a href="#">Jack Black is getting a Friars Club roast–let's get the ball rolling!</a></li>
|
||||
<li><a href="#">From 'Jurassic Park' to 'Back to the Future': Movies meant to be seen on the big screen</a></li>
|
||||
<li><a href="#">'Saturday Night Live' recap: Melissa McCarthy brought the heat and hammed it up</a></li>
|
||||
<li><a href="#">No HBO, no problem: Get your blood and battles fix with 'Vikings' instead</a></li>
|
||||
</ul>
|
||||
<a href="#" class="text-btn">Go to Pattern Watch</a>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<ul class="headline-list">
|
||||
<li>{{> m-blocks-block-thumb-headline }}</li>
|
||||
<li>{{> m-blocks-block-thumb-headline }}</li>
|
||||
</ul>
|
||||
<a href="#" class="btn btn-more">More Featured News</a>
|
||||
</section>
|
||||
|
||||
{{> o-sections-section-partners }}
|
||||
{{> o-sections-section-sponsored-links }}
|
||||
|
||||
</div><!--End role=main-->
|
||||
|
||||
{{> o-global-footer }}
|
||||
24
source/patterns/t-article/t-article.mustache
Normal file
24
source/patterns/t-article/t-article.mustache
Normal file
@ -0,0 +1,24 @@
|
||||
<div class="page" id="page">
|
||||
{{> o-global-header }}
|
||||
<div role="main">
|
||||
<div class="l-two-col">
|
||||
<div class="l-main">
|
||||
<article class="article">
|
||||
<header class="article-header">
|
||||
<h1>Article Headline Lorem ipsum dolor sit amet</h1>
|
||||
{{> m-text-byline-author-time }}
|
||||
</header>
|
||||
{{> o-article-article-body }}
|
||||
</article><!--end .article-->
|
||||
{{> m-components-social-share }}
|
||||
{{> o-comments-comment-thread }}
|
||||
</div><!--end l-main-->
|
||||
|
||||
<div class="l-sidebar">
|
||||
{{> o-sections-related-posts }}
|
||||
{{> o-sections-recent-tweets }}
|
||||
</div><!--end l-sidebar-->
|
||||
</div><!--end l-two-col-->
|
||||
</div><!--End role=main-->
|
||||
{{> o-global-footer }}
|
||||
</div>
|
||||
16
source/patterns/t-blog/t-blog.mustache
Normal file
16
source/patterns/t-blog/t-blog.mustache
Normal file
@ -0,0 +1,16 @@
|
||||
<div class="page" id="page">
|
||||
{{> o-global-header }}
|
||||
<div role="main">
|
||||
<h1>Latest Posts</h1>
|
||||
<div class="l-two-col">
|
||||
<div class="l-main">
|
||||
{{> m-navigation-pagination }}
|
||||
</div><!--end l-main-->
|
||||
|
||||
<div class="l-sidebar">
|
||||
|
||||
</div><!--end l-sidebar-->
|
||||
</div><!--end two-col-->
|
||||
</div><!--End role=main-->
|
||||
{{> o-global-footer }}
|
||||
</div>
|
||||
31
source/patterns/t-homepage/t-homepage.mustache
Normal file
31
source/patterns/t-homepage/t-homepage.mustache
Normal file
@ -0,0 +1,31 @@
|
||||
<div class="page" id="page">
|
||||
{{> o-global-header }}
|
||||
<div role="main">
|
||||
{{> m-blocks-block-hero }}
|
||||
<div class="g g-3up">
|
||||
<div class="gi">
|
||||
{{> m-blocks-inset-block }}
|
||||
</div>
|
||||
<div class="gi">
|
||||
{{> m-blocks-inset-block }}
|
||||
</div>
|
||||
<div class="gi">
|
||||
{{> m-blocks-inset-block }}
|
||||
</div>
|
||||
</div><!--end 3up-->
|
||||
|
||||
<hr />
|
||||
|
||||
<div class="l-two-col">
|
||||
<div class="l-main">
|
||||
{{> o-sections-latest-posts }}
|
||||
</div>
|
||||
|
||||
<div class="l-sidebar">
|
||||
{{> o-sections-recent-tweets }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div><!--End role=main-->
|
||||
{{> o-global-footer }}
|
||||
</div>
|
||||
@ -1,29 +0,0 @@
|
||||
<?php inc('organism','header'); ?>
|
||||
<div role="main">
|
||||
<?php inc('molecule','block-hero') ?>
|
||||
<div class="g g-3up">
|
||||
<div class="gi">
|
||||
<?php inc('molecule','block-inset') ?>
|
||||
</div>
|
||||
<div class="gi">
|
||||
<?php inc('molecule','block-inset') ?>
|
||||
</div>
|
||||
<div class="gi">
|
||||
<?php inc('molecule','block-inset') ?>
|
||||
</div>
|
||||
</div><!--end 3up-->
|
||||
|
||||
<hr />
|
||||
|
||||
<div class="l-two-col">
|
||||
<div class="l-main">
|
||||
<?php inc('organism','latest-posts') ?>
|
||||
</div>
|
||||
|
||||
<div class="l-sidebar">
|
||||
<?php inc('organism','recent-tweets') ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div><!--End role=main-->
|
||||
<?php inc('organism','footer'); ?>
|
||||
Loading…
x
Reference in New Issue
Block a user