websites/dennogumi.org-archive
Archived
1
0
Fork 0
Code Releases Activity

Init Jekyll Theme

Browse source
This commit is contained in:
Moritz »mo.« Sauer 2014-08-20 20:33:40 +02:00
parent ef6d8f23ef
commit e5d20c0faf
161 changed files with 11696 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

402
_site/design/elements/index.html Normal file
View file

@ -0,0 +1,402 @@
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Possibilites to style your Post</title>
<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">
<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
<meta name="google-site-verification" content="" />
<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
</head>
<body>
<div id="masthead-no-image-header">
<div class="row">
<div class="small-12 columns">
<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
</a>
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
</div><!-- /#masthead -->
<div id="navigation" class="contain-to-grid sticky">
<nav class="top-bar" data-topbar>
<ul class="title-area">
<li class="name"></li>
<!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
<li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
</ul>
<section class="top-bar-section">
<ul class="right">
<li class="divider"></li>
<li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
</ul>
<ul class="left">
<li><a href="http://localhost:4000/index.html">Start</a></li>
<li class="divider"></li>
<li class="has-dropdown">
<a href="http://localhost:4000/design/style-guide/">Style your content</a>
<ul class="dropdown">
<li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
<li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
<li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
<li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
<li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
<li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
<li><a href="http://localhost:4000/typography/">Typography</a></li>
</ul>
</li>
<li class="divider"></li>
<li><a href="http://localhost:4000/documentation/">Documentation</a></li>
<li class="divider"></li>
<li><a href="http://localhost:4000/blog/">Blog</a></li>
<li class="divider"></li>
<li><a href="http://localhost:4000/changelog/">Changelog</a></li>
<li class="divider"></li>
</ul>
</section>
</nav>
</div><!-- /#navigation -->
<div class="row top-30">
<div class="small-12 columns">
<img src="http://localhost:4000/assets/img/unsplash_6.jpg" width="970" alt="Possibilites to style your Post">
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
<div class="row top-30">
<div class="medium-offset-2 medium-8 end columns">
<article>
<header>
<p class="subtitle">Layout Elements</p>
<h1>Possibilites to style your Post</h1>
</header>
<p class="teaser">
You can style your content in different ways. There are elements like subtitles, feature images, header images, meta data like categories and tags and many more. This article shows the different possibilites.
</p>
<h2 id="subtitles">Subtitles</h2>
<h2 id="feature-images">Feature Images</h2>
<h2 id="header-images">Header Images</h2>
<p>You can choose to show a special full-width header image or not.</p>
<h2 id="meta-data">Meta-Data</h2>
<div class="page-meta">
<ul class="side-nav">
<li class="subheader">Date: 18.07.2014</li>
<li class="subheader">Archived in LAYOUT</li>
<li class="divider"></li>
</ul>
</div>
</article>
</div><!-- /.medium-8.columns -->
</div><!-- /.row -->
<footer id="footer-content" class="bg-grau">
<div id="footer">
<div class="row">
<div class="medium-6 large-5 columns">
<h5 class="black-shadow">About this Website</h5>
<p class="black-shadow">
»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
</p>
</div><!-- /.large-6.columns -->
<div class="small-6 medium-3 large-3 large-offset-1 columns">
<aside>
<div class="textwidget">
<h5 class="black-shadow">Services</h5>
<ul class="no-bullet black-shadow">
<li><a href="contact.html">Contact</a></li>
<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
</ul>
</div>
</aside>
</div><!-- /.large-4.columns -->
<div class="small-6 medium-3 large-3 columns">
<h5 class="black-shadow">Thank You!</h5>
<ul class="no-bullet black-shadow">
<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
</ul>
</div><!-- /.large-3.columns -->
</div><!-- /.row -->
<div class="row">
<div class="small-12 columns" style="text-align: right;">
<a class="entypo entypo-48" href="#masthead">&#59231;</a>
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
</div><!-- /#footer -->
<div id="subfooter">
<nav class="row">
<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
<ul class="inline-list">
<li><a href="http://localhost:4000/about/">About</a></li>
<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
</ul>
</section>
<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
<ul class="inline-list">
<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
</ul>
</section>
</nav>
</div><!-- /#subfooter -->
</footer>
<script src="http://localhost:4000/assets/js/app.min.js"></script>
<script>
$("#masthead").backstretch("http://localhost:4000/assets/img/no");
</script>
</body>
</html>

425
_site/design/grid/index.html Normal file
View file

@ -0,0 +1,425 @@
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>The Grid</title>
<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">
<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
<meta name="google-site-verification" content="" />
<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
</head>
<body>
<div id="masthead">
<div class="row">
<div class="small-12 columns">
<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
</a>
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
</div><!-- /#masthead -->
<div id="navigation" class="contain-to-grid sticky">
<nav class="top-bar" data-topbar>
<ul class="title-area">
<li class="name"></li>
<!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
<li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
</ul>
<section class="top-bar-section">
<ul class="right">
<li class="divider"></li>
<li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
</ul>
<ul class="left">
<li><a href="http://localhost:4000/index.html">Start</a></li>
<li class="divider"></li>
<li class="has-dropdown">
<a href="http://localhost:4000/design/style-guide/">Style your content</a>
<ul class="dropdown">
<li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
<li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
<li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
<li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
<li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
<li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
<li><a href="http://localhost:4000/typography/">Typography</a></li>
</ul>
</li>
<li class="divider"></li>
<li><a href="http://localhost:4000/documentation/">Documentation</a></li>
<li class="divider"></li>
<li><a href="http://localhost:4000/blog/">Blog</a></li>
<li class="divider"></li>
<li><a href="http://localhost:4000/changelog/">Changelog</a></li>
<li class="divider"></li>
</ul>
</section>
</nav>
</div><!-- /#navigation -->
<div class="row top-30">
<div class="medium-12 columns">
<article>
<header>
<p class="subtitle">Multi-Device Layouts</p>
<h1>The Grid</h1>
</header>
<p class="teaser">
Create powerful multi-device layouts quickly and easily with the 12-column, nest-able Foundation grid. These are the dimensions.
</p>
<p><em>Feeling Responsive</em> is built on Foundation. And of course, we make use of the wonderful grid system and so can you. Find out more about <a href="http://foundation.zurb.com/docs/components/grid.html">constructing beautiful layouts</a> in the foundation documentation.</p>
<h2 id="large-displays">Large Displays</h2>
<h3 id="two-columns">Two Columns</h3>
<div class="row">
<div class="large-6 columns">
<img src="http://placehold.it/500x281/6b6351/e1dcd7&amp;text=Width+500+Pixel" />
</div>
<div class="large-6 columns">
<img src="http://placehold.it/500x281/e05a10/e1e75e&amp;text=Width+500+Pixel" />
</div>
</div>
<h3 id="three-columns">Three Columns</h3>
<div class="row">
<div class="large-4 columns">
<img src="http://placehold.it/333x170/6b6351/e1dcd7&amp;text=Width+333+Pixel" />
</div>
<div class="large-4 columns">
<img src="http://placehold.it/333x170/e05a10/e1e75e&amp;text=Width+333+Pixel" />
</div>
<div class="large-4 columns">
<img src="http://placehold.it/333x170/fabb00/771e1e&amp;text=Width+333+Pixel" />
</div>
</div>
<h3 id="four-columns">Four Columns</h3>
<div class="row">
<div class="large-3 columns">
<img src="http://placehold.it/250x141/6b6351/e1dcd7&amp;text=Width+250+Pixel" />
</div>
<div class="large-3 columns">
<img src="http://placehold.it/250x141/e05a10/e1e75e&amp;text=Width+250+Pixel" />
</div>
<div class="large-3 columns">
<img src="http://placehold.it/250x141/fabb00/771e1e&amp;text=Width+250+Pixel" />
</div>
<div class="large-3 columns">
<img src="http://placehold.it/250x141/00792c/acca57&amp;text=Width+250+Pixel" />
</div>
</div>
</article>
</div><!-- /.medium-12.columns -->
</div><!-- /.row -->
<footer id="footer-content" class="bg-grau">
<div id="footer">
<div class="row">
<div class="medium-6 large-5 columns">
<h5 class="black-shadow">About this Website</h5>
<p class="black-shadow">
»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
</p>
</div><!-- /.large-6.columns -->
<div class="small-6 medium-3 large-3 large-offset-1 columns">
<aside>
<div class="textwidget">
<h5 class="black-shadow">Services</h5>
<ul class="no-bullet black-shadow">
<li><a href="contact.html">Contact</a></li>
<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
</ul>
</div>
</aside>
</div><!-- /.large-4.columns -->
<div class="small-6 medium-3 large-3 columns">
<h5 class="black-shadow">Thank You!</h5>
<ul class="no-bullet black-shadow">
<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
</ul>
</div><!-- /.large-3.columns -->
</div><!-- /.row -->
<div class="row">
<div class="small-12 columns" style="text-align: right;">
<a class="entypo entypo-48" href="#masthead">&#59231;</a>
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
</div><!-- /#footer -->
<div id="subfooter">
<nav class="row">
<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
<ul class="inline-list">
<li><a href="http://localhost:4000/about/">About</a></li>
<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
</ul>
</section>
<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
<ul class="inline-list">
<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
</ul>
</section>
</nav>
</div><!-- /#subfooter -->
</footer>
<script src="http://localhost:4000/assets/js/app.min.js"></script>
<script>
$("#masthead").backstretch("http://localhost:4000/assets/img/unsplash_3.jpg");
</script>
</body>
</html>

403
_site/design/post-left-sidebar/index.html Normal file
View file

@ -0,0 +1,403 @@
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Post With Left Sidebar</title>
<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">
<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
<meta name="google-site-verification" content="" />
<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
</head>
<body>
<div id="masthead">
<div class="row">
<div class="small-12 columns">
<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
</a>
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
</div><!-- /#masthead -->
<div id="navigation" class="contain-to-grid sticky">
<nav class="top-bar" data-topbar>
<ul class="title-area">
<li class="name"></li>
<!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
<li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
</ul>
<section class="top-bar-section">
<ul class="right">
<li class="divider"></li>
<li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
</ul>
<ul class="left">
<li><a href="http://localhost:4000/index.html">Start</a></li>
<li class="divider"></li>
<li class="has-dropdown">
<a href="http://localhost:4000/design/style-guide/">Style your content</a>
<ul class="dropdown">
<li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
<li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
<li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
<li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
<li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
<li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
<li><a href="http://localhost:4000/typography/">Typography</a></li>
</ul>
</li>
<li class="divider"></li>
<li><a href="http://localhost:4000/documentation/">Documentation</a></li>
<li class="divider"></li>
<li><a href="http://localhost:4000/blog/">Blog</a></li>
<li class="divider"></li>
<li><a href="http://localhost:4000/changelog/">Changelog</a></li>
<li class="divider"></li>
</ul>
</section>
</nav>
</div><!-- /#navigation -->
<div class="row top-60">
<div class="medium-4 columns">
<aside>
<div class="panel radius">
<h3>Sidebar</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
</div>
</aside>
</div><!-- /.medium-4.columns -->
<div class="medium-8 columns">
<article>
<header>
<img src="http://localhost:4000/assets/img/unsplash_1.jpg" width="970" alt="Post With Left Sidebar">
<h1>Post With Left Sidebar</h1>
</header>
<p class="teaser">
This is a example of Post with a Sidebar on the left.
</p>
<h2 id="have-a-look-at-the-sidebar">Have a look at the sidebar</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<div class="page-meta">
<ul class="side-nav">
<li class="subheader">Date: 28.03.2014</li>
<li class="subheader">Archived in LAYOUT</li>
<li class="divider"></li>
</ul>
</div>
</article>
</div><!-- /.medium-8.columns -->
</div><!-- /.row -->
<footer id="footer-content" class="bg-grau">
<div id="footer">
<div class="row">
<div class="medium-6 large-5 columns">
<h5 class="black-shadow">About this Website</h5>
<p class="black-shadow">
»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
</p>
</div><!-- /.large-6.columns -->
<div class="small-6 medium-3 large-3 large-offset-1 columns">
<aside>
<div class="textwidget">
<h5 class="black-shadow">Services</h5>
<ul class="no-bullet black-shadow">
<li><a href="contact.html">Contact</a></li>
<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
</ul>
</div>
</aside>
</div><!-- /.large-4.columns -->
<div class="small-6 medium-3 large-3 columns">
<h5 class="black-shadow">Thank You!</h5>
<ul class="no-bullet black-shadow">
<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
</ul>
</div><!-- /.large-3.columns -->
</div><!-- /.row -->
<div class="row">
<div class="small-12 columns" style="text-align: right;">
<a class="entypo entypo-48" href="#masthead">&#59231;</a>
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
</div><!-- /#footer -->
<div id="subfooter">
<nav class="row">
<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
<ul class="inline-list">
<li><a href="http://localhost:4000/about/">About</a></li>
<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
</ul>
</section>
<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
<ul class="inline-list">
<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
</ul>
</section>
</nav>
</div><!-- /#subfooter -->
</footer>
<script src="http://localhost:4000/assets/js/app.min.js"></script>
<script>
$("#masthead").backstretch("http://localhost:4000/assets/img/unsplash_3.jpg");
</script>
</body>
</html>

405
_site/design/post-right-sidebar/index.html Normal file
View file

@ -0,0 +1,405 @@
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Post With Right Sidebar</title>
<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">
<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
<meta name="google-site-verification" content="" />
<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
</head>
<body>
<div id="masthead">
<div class="row">
<div class="small-12 columns">
<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
</a>
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
</div><!-- /#masthead -->
<div id="navigation" class="contain-to-grid sticky">
<nav class="top-bar" data-topbar>
<ul class="title-area">
<li class="name"></li>
<!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
<li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
</ul>
<section class="top-bar-section">
<ul class="right">
<li class="divider"></li>
<li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
</ul>
<ul class="left">
<li><a href="http://localhost:4000/index.html">Start</a></li>
<li class="divider"></li>
<li class="has-dropdown">
<a href="http://localhost:4000/design/style-guide/">Style your content</a>
<ul class="dropdown">
<li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
<li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
<li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
<li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
<li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
<li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
<li><a href="http://localhost:4000/typography/">Typography</a></li>
</ul>
</li>
<li class="divider"></li>
<li><a href="http://localhost:4000/documentation/">Documentation</a></li>
<li class="divider"></li>
<li><a href="http://localhost:4000/blog/">Blog</a></li>
<li class="divider"></li>
<li><a href="http://localhost:4000/changelog/">Changelog</a></li>
<li class="divider"></li>
</ul>
</section>
</nav>
</div><!-- /#navigation -->
<div class="row top-60">
<div class="medium-8 columns">
<article>
<header>
<img src="http://localhost:4000/assets/img/unsplash_2.jpg" width="970" alt="Post With Right Sidebar">
<h1>Post With Right Sidebar</h1>
</header>
<p class="teaser">
This is a example of Post with a Sidebar on the right.
</p>
<h2 id="have-a-look-at-the-sidebar">Have a look at the sidebar</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<h3 id="lorem">Lorem</h3>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<div class="page-meta">
<ul class="side-nav">
<li class="subheader">Date: 28.03.2014</li>
<li class="subheader">Archived in LAYOUT</li>
<li class="divider"></li>
</ul>
</div>
</article>
</div><!-- /.medium-8.columns -->
<div class="medium-4 columns">
<aside>
<div class="panel radius">
<h3>Sidebar</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
</div>
</aside>
</div><!-- /.medium-4.columns -->
</div><!-- /.row -->
<footer id="footer-content" class="bg-grau">
<div id="footer">
<div class="row">
<div class="medium-6 large-5 columns">
<h5 class="black-shadow">About this Website</h5>
<p class="black-shadow">
»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
</p>
</div><!-- /.large-6.columns -->
<div class="small-6 medium-3 large-3 large-offset-1 columns">
<aside>
<div class="textwidget">
<h5 class="black-shadow">Services</h5>
<ul class="no-bullet black-shadow">
<li><a href="contact.html">Contact</a></li>
<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
</ul>
</div>
</aside>
</div><!-- /.large-4.columns -->
<div class="small-6 medium-3 large-3 columns">
<h5 class="black-shadow">Thank You!</h5>
<ul class="no-bullet black-shadow">
<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
</ul>
</div><!-- /.large-3.columns -->
</div><!-- /.row -->
<div class="row">
<div class="small-12 columns" style="text-align: right;">
<a class="entypo entypo-48" href="#masthead">&#59231;</a>
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
</div><!-- /#footer -->
<div id="subfooter">
<nav class="row">
<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
<ul class="inline-list">
<li><a href="http://localhost:4000/about/">About</a></li>
<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
</ul>
</section>
<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
<ul class="inline-list">
<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
</ul>
</section>
</nav>
</div><!-- /#subfooter -->
</footer>
<script src="http://localhost:4000/assets/js/app.min.js"></script>
<script>
$("#masthead").backstretch("http://localhost:4000/assets/img/unsplash_3.jpg");
</script>
</body>
</html>

396
_site/design/post/index.html Normal file
View file

@ -0,0 +1,396 @@
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Normal Post</title>
<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">
<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
<meta name="google-site-verification" content="" />
<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
</head>
<body>
<div id="masthead">
<div class="row">
<div class="small-12 columns">
<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
</a>
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
</div><!-- /#masthead -->
<div id="navigation" class="contain-to-grid sticky">
<nav class="top-bar" data-topbar>
<ul class="title-area">
<li class="name"></li>
<!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
<li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
</ul>
<section class="top-bar-section">
<ul class="right">
<li class="divider"></li>
<li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
</ul>
<ul class="left">
<li><a href="http://localhost:4000/index.html">Start</a></li>
<li class="divider"></li>
<li class="has-dropdown">
<a href="http://localhost:4000/design/style-guide/">Style your content</a>
<ul class="dropdown">
<li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
<li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
<li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
<li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
<li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
<li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
<li><a href="http://localhost:4000/typography/">Typography</a></li>
</ul>
</li>
<li class="divider"></li>
<li><a href="http://localhost:4000/documentation/">Documentation</a></li>
<li class="divider"></li>
<li><a href="http://localhost:4000/blog/">Blog</a></li>
<li class="divider"></li>
<li><a href="http://localhost:4000/changelog/">Changelog</a></li>
<li class="divider"></li>
</ul>
</section>
</nav>
</div><!-- /#navigation -->
<div class="row top-30">
<div class="medium-offset-2 medium-8 end columns">
<article>
<header>
<h1>Normal Post</h1>
</header>
<p class="teaser">
This is a example of post beautiful aligned in the middle. No sidebar needed to read good articles.
</p>
<h2 id="look">Look!</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<h3 id="lorem">Lorem</h3>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<div class="page-meta">
<ul class="side-nav">
<li class="subheader">Date: 28.03.2014</li>
<li class="subheader">Archived in LAYOUT</li>
<li class="divider"></li>
</ul>
</div>
</article>
</div><!-- /.medium-8.columns -->
</div><!-- /.row -->
<footer id="footer-content" class="bg-grau">
<div id="footer">
<div class="row">
<div class="medium-6 large-5 columns">
<h5 class="black-shadow">About this Website</h5>
<p class="black-shadow">
»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
</p>
</div><!-- /.large-6.columns -->
<div class="small-6 medium-3 large-3 large-offset-1 columns">
<aside>
<div class="textwidget">
<h5 class="black-shadow">Services</h5>
<ul class="no-bullet black-shadow">
<li><a href="contact.html">Contact</a></li>
<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
</ul>
</div>
</aside>
</div><!-- /.large-4.columns -->
<div class="small-6 medium-3 large-3 columns">
<h5 class="black-shadow">Thank You!</h5>
<ul class="no-bullet black-shadow">
<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
</ul>
</div><!-- /.large-3.columns -->
</div><!-- /.row -->
<div class="row">
<div class="small-12 columns" style="text-align: right;">
<a class="entypo entypo-48" href="#masthead">&#59231;</a>
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
</div><!-- /#footer -->
<div id="subfooter">
<nav class="row">
<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
<ul class="inline-list">
<li><a href="http://localhost:4000/about/">About</a></li>
<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
</ul>
</section>
<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
<ul class="inline-list">
<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
</ul>
</section>
</nav>
</div><!-- /#subfooter -->
</footer>
<script src="http://localhost:4000/assets/js/app.min.js"></script>
<script>
$("#masthead").backstretch("http://localhost:4000/assets/img/unsplash_3.jpg");
</script>
</body>
</html>

386
_site/design/style-guide/index.html Normal file
View file

@ -0,0 +1,386 @@
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Style your content!</title>
<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">
<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
<meta name="google-site-verification" content="" />
<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
</head>
<body>
<div id="masthead">
<div class="row">
<div class="small-12 columns">
<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
</a>
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
</div><!-- /#masthead -->
<div id="navigation" class="contain-to-grid sticky">
<nav class="top-bar" data-topbar>
<ul class="title-area">
<li class="name"></li>
<!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
<li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
</ul>
<section class="top-bar-section">
<ul class="right">
<li class="divider"></li>
<li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
</ul>
<ul class="left">
<li><a href="http://localhost:4000/index.html">Start</a></li>
<li class="divider"></li>
<li class="has-dropdown active">
<a href="http://localhost:4000/design/style-guide/">Style your content</a>
<ul class="dropdown">
<li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
<li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
<li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
<li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
<li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
<li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
<li><a href="http://localhost:4000/typography/">Typography</a></li>
</ul>
</li>
<li class="divider"></li>
<li><a href="http://localhost:4000/documentation/">Documentation</a></li>
<li class="divider"></li>
<li><a href="http://localhost:4000/blog/">Blog</a></li>
<li class="divider"></li>
<li><a href="http://localhost:4000/changelog/">Changelog</a></li>
<li class="divider"></li>
</ul>
</section>
</nav>
</div><!-- /#navigation -->
<div class="row top-30">
<div class="medium-offset-2 medium-8 end columns">
<article>
<header>
<p class="subtitle">Layouts of Feeling Responsive</p>
<h1>Style your content!</h1>
</header>
<ul>
<li><a href="http://localhost:4000//design/elements/">Possibilites to style your Post</a></li>
<li><a href="http://localhost:4000//design/grid/">The Grid</a></li>
<li><a href="http://localhost:4000//design/post-right-sidebar/">Post With Right Sidebar</a></li>
<li><a href="http://localhost:4000//design/post-left-sidebar/">Post With Left Sidebar</a></li>
<li><a href="http://localhost:4000//design/post/">Normal Post</a></li>
</ul>
</article>
</div><!-- /.medium-8.columns -->
</div><!-- /.row -->
<footer id="footer-content" class="bg-grau">
<div id="footer">
<div class="row">
<div class="medium-6 large-5 columns">
<h5 class="black-shadow">About this Website</h5>
<p class="black-shadow">
»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
</p>
</div><!-- /.large-6.columns -->
<div class="small-6 medium-3 large-3 large-offset-1 columns">
<aside>
<div class="textwidget">
<h5 class="black-shadow">Services</h5>
<ul class="no-bullet black-shadow">
<li><a href="contact.html">Contact</a></li>
<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
</ul>
</div>
</aside>
</div><!-- /.large-4.columns -->
<div class="small-6 medium-3 large-3 columns">
<h5 class="black-shadow">Thank You!</h5>
<ul class="no-bullet black-shadow">
<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
</ul>
</div><!-- /.large-3.columns -->
</div><!-- /.row -->
<div class="row">
<div class="small-12 columns" style="text-align: right;">
<a class="entypo entypo-48" href="#masthead">&#59231;</a>
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
</div><!-- /#footer -->
<div id="subfooter">
<nav class="row">
<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
<ul class="inline-list">
<li><a href="http://localhost:4000/about/">About</a></li>
<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
</ul>
</section>
<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
<ul class="inline-list">
<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
</ul>
</section>
</nav>
</div><!-- /#subfooter -->
</footer>
<script src="http://localhost:4000/assets/js/app.min.js"></script>
<script>
$("#masthead").backstretch("http://localhost:4000/assets/img/header_unsplash_6.jpg");
</script>
</body>
</html>

425
_site/design/this-is-h1-headline/index.html Normal file
View file

@ -0,0 +1,425 @@
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>This is the &lt;h1&gt;-Headline</title>
<link rel="stylesheet" href="http://localhost:4000/assets/css/style.min.css">
<script src="http://localhost:4000/assets/js/modernizr.min.js"></script>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700,400italic%7cVolkhov:400,700' rel='stylesheet' type='text/css'>
<meta name="google-site-verification" content="" />
<link rel="author" href="https://plus.google.com/u/0/118311555303973066167"/>
<link rel="shortcut icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
<link rel="icon" href="http://images.phlow.de/phlow/phlow-favicon-32x.png" type="image/png" />
</head>
<body>
<div id="masthead">
<div class="row">
<div class="small-12 columns">
<a id="logo" href="http://localhost:4000" title="Feeling Responsive">
<img src="http://localhost:4000/assets/img/logo.png" alt="Feeling Responsive">
</a>
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
</div><!-- /#masthead -->
<div id="navigation" class="contain-to-grid sticky">
<nav class="top-bar" data-topbar>
<ul class="title-area">
<li class="name"></li>
<!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
<li class="toggle-topbar menu-icon"><a href="#"><span>Navigation</span></a></li>
</ul>
<section class="top-bar-section">
<ul class="right">
<li class="divider"></li>
<li><a href="http://phlow.de/kontakt/" target="_blank">Contact</a></li>
</ul>
<ul class="left">
<li><a href="http://localhost:4000/index.html">Start</a></li>
<li class="divider"></li>
<li class="has-dropdown">
<a href="http://localhost:4000/design/style-guide/">Style your content</a>
<ul class="dropdown">
<li><a href="http://localhost:4000/design/elements/">Style Your Posts</a></li>
<li><a href="http://localhost:4000/design/grid/">The Grid</a></li>
<li><a href="http://localhost:4000/blog/">Blog-Page</a></li>
<li><a href="http://localhost:4000/design/post/">Post-Layout</a></li>
<li><a href="http://localhost:4000/design/post-left-sidebar/">Post-Left-Sidebar</a></li>
<li><a href="http://localhost:4000/design/post-right-sidebar/">Post-Right-Sidebar</a></li>
<li><a href="http://localhost:4000/typography/">Typography</a></li>
</ul>
</li>
<li class="divider"></li>
<li><a href="http://localhost:4000/documentation/">Documentation</a></li>
<li class="divider"></li>
<li><a href="http://localhost:4000/blog/">Blog</a></li>
<li class="divider"></li>
<li><a href="http://localhost:4000/changelog/">Changelog</a></li>
<li class="divider"></li>
</ul>
</section>
</nav>
</div><!-- /#navigation -->
<div class="row top-30">
<div class="small-12 columns">
<img src="http://localhost:4000/assets/img/unsplash_5.jpg" width="970" alt="This is the &lt;h1&gt;-Headline">
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
<div class="row top-30">
<div class="medium-offset-2 medium-8 end columns">
<article>
<header>
<p class="subtitle">Subheadline</p>
<h1>This is the &lt;h1&gt;-Headline</h1>
</header>
<p class="teaser">
Feeling Responsive offers lots of possibilities to style your articles. The theme turns around the corner with a headline, subheadline, a title and header image. A beautiful typography crafted to please the eyes delivers your ideas, explanations and articles to stick out.
</p>
<h1 id="lth1gt-headline">&lt;h1&gt;-Headline</h1>
<h2 id="lth2gt-headline">&lt;h2&gt;-Headline</h2>
<h3 id="lth3gt-headline">&lt;h3&gt;-Headline</h3>
<h4 id="lth4gt-headline">&lt;h4&gt;-Headline</h4>
<h5 id="lth5gt-headline">&lt;h5&gt;-Headline</h5>
<h6 id="lth6gt-headline">&lt;h6&gt;-Headline</h6>
<hr />
<ol>
<li>Ordered List</li>
<li>Second List Item</li>
<li>Third List Item</li>
<li>Fourth List Item</li>
<li>Fifth List Item</li>
</ol>
<hr />
<dl>
<dt>Definition List</dt>
<dd>Bacon ipsum dolor sit amet spare ribs brisket ribeye, andouille sirloin bresaola frankfurter corned beef capicola bacon. Salami beef ribs sirloin, short loin hamburger shoulder t-bone.</dd>
<dt>Beef ribs jowl swine porchetta</dt>
<dd>Sirloin tenderloin swine frankfurter pork loin pork capicola ham hock strip steak ribeye beef ribs. Hamburger t-bone ribeye ham prosciutto bresaola.</dd>
<dt>Pancetta flank sirloin pork</dt>
<dd>short ribs shankle prosciutto landjaeger. Beef ribs turkey shoulder drumstick. Leberkas pork belly ribeye, bresaola jerky strip steak tenderloin bacon landjaeger short ribs beef ribs. Flank pork chop fatback tail kielbasa filet mignon jowl landjaeger bresaola tongue corned beef biltong. Landjaeger spare ribs fatback corned beef tenderloin drumstick, swine chicken beef turkey biltong doner tri-tip filet mignon. </dd>
</dl>
<div class="page-meta">
<ul class="side-nav">
<li class="subheader">Date: 05.07.2014</li>
<li class="subheader">Archived in TYPOGRAPHY · DESIGN · ELEMENTS</li>
<li class="divider"></li>
</ul>
</div>
</article>
</div><!-- /.medium-8.columns -->
</div><!-- /.row -->
<footer id="footer-content" class="bg-grau">
<div id="footer">
<div class="row">
<div class="medium-6 large-5 columns">
<h5 class="black-shadow">About this Website</h5>
<p class="black-shadow">
»Feeling Responsive« is a responsive theme based on the fantastic foundation framework with beautiful typography and a bright color palette.
</p>
</div><!-- /.large-6.columns -->
<div class="small-6 medium-3 large-3 large-offset-1 columns">
<aside>
<div class="textwidget">
<h5 class="black-shadow">Services</h5>
<ul class="no-bullet black-shadow">
<li><a href="contact.html">Contact</a></li>
<li class="rss-link"><a href="http://localhost:4000/feed.xml">RSS</a></li>
<li class="sitemap-link"><a href="http://localhost:4000/sitemap.xml">Sitemap.xml</a></li>
</ul>
</div>
</aside>
</div><!-- /.large-4.columns -->
<div class="small-6 medium-3 large-3 columns">
<h5 class="black-shadow">Thank You!</h5>
<ul class="no-bullet black-shadow">
<li><a href="http://entypo.com/">Icons by Daniel Bruce</a></li>
<li><a href="http://foundation.zurb.com/">Built on Foundation</a></li>
<li><a href="http://unsplash.com/">Images by Unsplash</a></li>
<li><a href="http://srobbin.com/jquery-plugins/backstretch/">Using Backstretch by Scott Robbin</a></li>
</ul>
</div><!-- /.large-3.columns -->
</div><!-- /.row -->
<div class="row">
<div class="small-12 columns" style="text-align: right;">
<a class="entypo entypo-48" href="#masthead">&#59231;</a>
</div><!-- /.small-12.columns -->
</div><!-- /.row -->
</div><!-- /#footer -->
<div id="subfooter">
<nav class="row">
<section id="subfooter-left" class="bottom-30 small-12 medium-6 columns">
<ul class="inline-list">
<li><a href="http://localhost:4000/about/">About</a></li>
<li><a href="http://phlow.de/webdesign/">Theme &amp; Webdesign by Phlow</a></li>
</ul>
</section>
<section id="subfooter-right" class="small-12 medium-6 columns social-icons">
<ul class="inline-list">
<li><a href="http://www.youtube.com/PhlowMedia" target="_blank" id="social-youtube" class="entypo" title="Videos, Video-Anleitungen und Filme von Phlow auf YouTube">&#9654;</a></li>
<li><a href="http://twitter.com/phlow" target="_blank" id="social-twitter" class="entypo-social" title="Immer das Neuste von Phlow gibt es auf Twitter">&#62217;</a></li>
<li><a href="http://www.facebook.com/phlow.media" target="_blank" id="social-facebook" class="entypo-social" title="Lass uns Freunde sein!">&#62220;</a></li>
<li><a href="http://soundcloud.com/phlow" target="_blank" id="social-soundcloud" class="entypo-social" title="Sounds und Downloads und mehr">&#62280;</a></li>
<li><a href="http://github.com/phlow" target="_blank" id="social-github" class="entypo-social" title="Code und mehr...">&#62208;</a></li>
<li><a href="http://instagram.com/phlowmedia" target="_blank" id="social-instagram" class="entypo-social" title="Bilder und Impressionen mit und ohne Filter...">&#62253;</a></li>
<li><a href="http://www.pinterest.com/phlowmedia/" target="_blank" id="social-pinterest" class="entypo-social" title="Bilder, Fotos, Illustrationen, Grafiken sammeln...">&#62227;</a></li>
<li><a href="http://www.mixcloud.com/phlow/" target="_blank" id="social-mixcloud" class="entypo" title="Mixe, was sonst?">&#9729;</a></li>
</ul>
</section>
</nav>
</div><!-- /#subfooter -->
</footer>
<script src="http://localhost:4000/assets/js/app.min.js"></script>
<script>
$("#masthead").backstretch("http://localhost:4000/assets/img/unsplash_3.jpg");
</script>
</body>
</html>