Permalink
Browse files

Added the feed template, added comments to all of them

  • Loading branch information...
1 parent 2fa3b0d commit 8fab5c6b8a069fbd4477424030e62f79dda0121e Jonathan Smiley committed Aug 30, 2012
Showing with 224 additions and 3 deletions.
  1. +19 −2 banded.html
  2. +25 −1 blog.html
  3. +180 −0 feed.html
View
@@ -11,7 +11,7 @@
<!-- Set the viewport width to device width for mobile -->
<meta name="viewport" content="width=device-width" />
- <title>Welcome to Foundation</title>
+ <title>Welcome to Foundation | Banded</title>
<!-- Included CSS Files (Uncompressed) -->
<!--
@@ -31,7 +31,9 @@
</head>
<body>
-
+
+ <!-- Header and Nav -->
+
<div class="row">
<div class="three columns">
<h1><img src="http://placehold.it/400x100&text=Logo" /></h1>
@@ -45,6 +47,11 @@
</ul>
</div>
</div>
+
+ <!-- End Header and Nav -->
+
+
+ <!-- First Band (Image) -->
<div class="row">
<div class="twelve columns">
@@ -54,6 +61,9 @@
</div>
</div>
+
+ <!-- Second Band (Image Left with Text) -->
+
<div class="row">
<div class="four columns">
<img src="http://placehold.it/400x300&text=[img]" />
@@ -70,6 +80,10 @@
</div>
</div>
</div>
+
+
+ <!-- Third Band (Image Right with Text) -->
+
<div class="row">
<div class="eight columns">
<h4>This is a content section.</h4>
@@ -84,6 +98,9 @@
</div>
</div>
+
+ <!-- Footer -->
+
<footer class="row">
<div class="twelve columns">
<hr />
View
@@ -11,7 +11,7 @@
<!-- Set the viewport width to device width for mobile -->
<meta name="viewport" content="width=device-width" />
- <title>Welcome to Foundation</title>
+ <title>Welcome to Foundation | Blog</title>
<!-- Included CSS Files (Uncompressed) -->
<!--
@@ -31,6 +31,9 @@
</head>
<body>
+
+ <!-- Top Bar -->
+
<div class="row">
<div class="twelve columns">
<ul class="nav-bar">
@@ -45,7 +48,14 @@
</div>
</div>
+ <!-- End Top Bar -->
+
+
+ <!-- Main Page Content and Sidebar -->
+
<div class="row">
+
+ <!-- Main Blog Content -->
<div class="nine columns" role="content">
<article>
@@ -94,6 +104,11 @@
</div>
+ <!-- End Main Content -->
+
+
+ <!-- Sidebar -->
+
<aside class="three columns">
<h5>Categories</h5>
@@ -112,8 +127,15 @@
</div>
</aside>
+
+ <!-- End Sidebar -->
</div>
+ <!-- End Main Content and Sidebar -->
+
+
+ <!-- Footer -->
+
<footer class="row">
<div class="twelve columns">
<hr />
@@ -133,6 +155,8 @@
</div>
</footer>
+ <!-- End Footer -->
+
View
180 feed.html
@@ -0,0 +1,180 @@
+<!DOCTYPE html>
+
+<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
+<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
+<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
+<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
+<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
+<head>
+ <meta charset="utf-8" />
+
+ <!-- Set the viewport width to device width for mobile -->
+ <meta name="viewport" content="width=device-width" />
+
+ <title>Welcome to Foundation | Feed</title>
+
+ <!-- Included CSS Files (Uncompressed) -->
+ <!--
+ <link rel="stylesheet" href="stylesheets/foundation.css">
+ -->
+
+ <!-- Included CSS Files (Compressed) -->
+ <link rel="stylesheet" href="stylesheets/foundation.min.css">
+ <link rel="stylesheet" href="stylesheets/app.css">
+
+ <script src="javascripts/modernizr.foundation.js"></script>
+
+ <!-- IE Fix for HTML5 Tags -->
+ <!--[if lt IE 9]>
+ <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+ <![endif]-->
+
+</head>
+<body>
+
+ <!-- Header and Nav -->
+
+ <div class="row">
+ <div class="twelve columns">
+ <div class="panel">
+ <h1>Feed Template</h1>
+ </div>
+ </div>
+ </div>
+
+ <!-- End Header and Nav -->
+
+
+ <div class="row">
+
+ <!-- Main Feed -->
+ <!-- This has been source ordered to come first in the markup (and on small devices) but to be to the right of the nav on larger screens -->
+ <div class="six columns push-three">
+
+ <!-- Feed Entry -->
+ <div class="row">
+ <div class="two columns mobile-one"><img src="http://placehold.it/80x80&text=[img]" /></div>
+ <div class="ten columns">
+ <p><strong>Some Person said:</strong> Bacon ipsum dolor sit amet nulla ham qui sint exercitation eiusmod commodo, chuck duis velit. Aute in reprehenderit, dolore aliqua non est magna in labore pig pork biltong.</p>
+ <ul class="link-list">
+ <li><a href="">Reply</a></li>
+ <li><a href="">Share</a></li>
+ </ul>
+
+
+ <h6>2 Comments</h6>
+ <div class="row">
+ <div class="two columns mobile-one"><img src="http://placehold.it/50x50&text=[img]" /></div>
+ <div class="ten columns"><p>Bacon ipsum dolor sit amet nulla ham qui sint exercitation eiusmod commodo, chuck duis velit. Aute in reprehenderit</p></div>
+ </div>
+ <div class="row">
+ <div class="two columns mobile-one"><img src="http://placehold.it/50x50&text=[img]" /></div>
+ <div class="ten columns"><p>Bacon ipsum dolor sit amet nulla ham qui sint exercitation eiusmod commodo, chuck duis velit. Aute in reprehenderit</p></div>
+ </div>
+ </div>
+ </div>
+ <!-- End Feed Entry -->
+
+ <hr />
+
+ <!-- Feed Entry -->
+ <div class="row">
+ <div class="two columns mobile-one"><img src="http://placehold.it/80x80&text=[img]" /></div>
+ <div class="ten columns">
+ <p><strong>Some Person said:</strong> Bacon ipsum dolor sit amet nulla ham qui sint exercitation eiusmod commodo, chuck duis velit. Aute in reprehenderit, dolore aliqua non est magna in labore pig pork biltong.</p>
+ <ul class="link-list">
+ <li><a href="">Reply</a></li>
+ <li><a href="">Share</a></li>
+ </ul>
+ </div>
+ </div>
+ <!-- End Feed Entry -->
+
+ <hr />
+
+ <!-- Feed Entry -->
+ <div class="row">
+ <div class="two columns mobile-one"><img src="http://placehold.it/80x80&text=[img]" /></div>
+ <div class="ten columns">
+ <p><strong>Some Person said:</strong> Bacon ipsum dolor sit amet nulla ham qui sint exercitation eiusmod commodo, chuck duis velit. Aute in reprehenderit, dolore aliqua non est magna in labore pig pork biltong.</p>
+ <ul class="link-list">
+ <li><a href="">Reply</a></li>
+ <li><a href="">Share</a></li>
+ </ul>
+
+
+ <h6>2 Comments</h6>
+ <div class="row">
+ <div class="two columns mobile-one"><img src="http://placehold.it/50x50&text=[img]" /></div>
+ <div class="ten columns"><p>Bacon ipsum dolor sit amet nulla ham qui sint exercitation eiusmod commodo, chuck duis velit. Aute in reprehenderit</p></div>
+ </div>
+ </div>
+ </div>
+ <!-- End Feed Entry -->
+
+ </div>
+
+
+ <!-- Nav Sidebar -->
+ <!-- This is source ordered to be pulled to the left on larger screens -->
+ <div class="three columns pull-six">
+ <div class="panel">
+ <a href="#"><img src="http://placehold.it/300x240&text=[img]" /></a>
+ <h5><a href="#">Your Name</a></h5>
+
+ <dl class="vertical tabs">
+ <dd><a href="#">Section 1</a></dd>
+ <dd><a href="#">Section 2</a></dd>
+ <dd><a href="#">Section 3</a></dd>
+ <dd><a href="#">Section 4</a></dd>
+ <dd><a href="#">Section 5</a></dd>
+ <dd><a href="#">Section 6</a></dd>
+ </dl>
+
+ </div>
+ </div>
+
+
+ <!-- Right Sidebar -->
+ <!-- On small devices this column is hidden -->
+ <aside class="three columns hide-for-small">
+ <p><img src="http://placehold.it/300x440&text=[ad]" /></p>
+ <p><img src="http://placehold.it/300x440&text=[ad]" /></p>
+ </aside>
+
+ </div>
+
+
+ <!-- Footer -->
+
+ <footer class="row">
+ <div class="twelve columns">
+ <hr />
+ <div class="row">
+ <div class="six columns">
+ <p>&copy; Copyright no one at all. Go to town.</p>
+ </div>
+ <div class="six columns">
+ <ul class="link-list right">
+ <li><a href="#">Section 1</a></li>
+ <li><a href="#">Section 2</a></li>
+ <li><a href="#">Section 3</a></li>
+ <li><a href="#">Section 4</a></li>
+ <li><a href="#">Section 5</a></li>
+ <li><a href="#">Section 6</a></li>
+ </ul>
+ </div>
+ </div>
+ </div>
+ </footer>
+
+
+
+
+ <!-- Included JS Files (Compressed) -->
+ <script src="javascripts/foundation.min.js"></script>
+
+ <!-- Initialize JS Plugins -->
+ <script src="javascripts/app.js"></script>
+</body>
+</html>

0 comments on commit 8fab5c6

Please sign in to comment.