<dl class="sub-nav">
<dt>Go to:</dt>
- <dd
class="active"><a href="#installing">Installing</a></dd>
- <dd
class="active"><a href="#settings">Settings</a></dd>
- <dd
class="active"><a href="#mixins">Mixins & Functions</a></dd>
+ <dd><a href="#installing">Installing</a></dd>
+ <dd><a href="#settings">Settings</a></dd>
+ <dd><a href="#mixins">Mixins & Functions</a></dd>
</dl>
<hr>
<!-- Set the viewport width to device width for mobile -->
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
-
- <meta name="description" content="Foundation is an easy to use, powerful, and flexible framework for building rapid prototypes and production code on any kind of device." />
+ <!-- For third-generation iPad with high-resolution Retina display: -->
+ <link rel="apple-touch-icon-precomposed" sizes="144x144" href="images/favicons/apple-touch-icon-144x144-precomposed.png">
+ <!-- For iPhone with high-resolution Retina display: -->
+ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="images/favicons/apple-touch-icon-114x114-precomposed.png">
+ <!-- For first- and second-generation iPad: -->
+ <link rel="apple-touch-icon-precomposed" sizes="72x72" href="images/favicons/apple-touch-icon-72x72-precomposed.png">
+ <!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: -->
+ <link rel="apple-touch-icon-precomposed" href="images/favicons/apple-touch-icon-precomposed.png">
+ <!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: -->
+
+ <link rel="icon" href="images/favicons/favicon.ico" type="image/x-icon" />
+
+ <meta name="keywords" content="design strategy, interaction design, design thinking, zurb, design" />
+ <meta name="description" content="ZURB, creating unique customer and user experiences. We are brand engineers that provide companies with strategic marketing, design and branding solutions. Work includes identity, branding, information design, web design, illustration, software design, icon design, and multimedia work." />
+ <meta name="author" content="ZURB, inc. ZURB network also includes zurb.com" />
+ <meta name="copyright" content="ZURB, inc. Copyright (c) 2012" />
<title>Foundation: <?= $page_title ?></title>
- <link rel="apple-touch-icon" href="apple-touch-icon.png" />
- <link rel="icon" type="image/ico" href="favicon.ico">
+ <meta name="description" content="Foundation is an easy to use, powerful, and flexible framework for building rapid prototypes and production code on any kind of device." />
<!-- Included CSS Files -->
-
<link rel="stylesheet" href="http://www.zurb.com/assets/foundation.top-bar.css">
<link rel="stylesheet" href="http://www.zurb.com/assets/zurb.mega-drop.css">
<link rel="stylesheet" href="stylesheets/presentation.css">
-<? $page_title = "Rapid Prototyping and Building Framework from ZURB" ?>
+<? $page_title = "Mobile Visibility" ?>
<?php include("includes/_header.php"); ?>
-
+
<header>
<div class="row">
<div class="twelve columns">
</div>
</div>
</header>
-
+
<section id="mainContent">
-
+
<div class="row hide-for-small">
<div class="twelve columns">
<h3>Larger Interface</h3><br />
</ul>
</div>
</div>
-
+
<div class="row show-for-small">
<div class="twelve columns">
-
+
<h3>Small Interface</h3><br />
<p>As an example, you'll only see this interface if you're on a phone (something with a resolution lower than desktops or tablets). On a phone our columns will all stack, and we would place navigation at the bottom of the page.</p>
<ul class="block-grid three-up">
</ul>
</div>
</div>
-
+
<div class="row show-for-small">
<div class="twelve columns">
<dl class="nice mobile tabs">
</div>
</div>
</section>
-
-
-
-
+
+
+
+
<?php include("includes/_footer.php"); ?>
-<? $page_title = "Rapid Prototyping and Building Framework from ZURB" ?>
+<? $page_title = "Mobility for the Future" ?>
<?php include("includes/_header.php"); ?>
-
+
<header>
<div class="row">
<div class="twelve columns">
</div>
</div>
</header>
-
+
<section id="mainContent">
-
+
<div class="row">
-
+
<div class="ten columns push-two">
<p class="show-for-small"><a href="index.php">← Back to Home</a></p>
<img src="images/feature-mobile-1.jpg">
<h4>Build for the future.</h4>
<p>Mobile devices are already eclipsing desktops in adoption and internet use — that's why Foundation was built from the ground up to support any kind of device, any size screen, with any resolution. You can get going quickly by building once for all devices, or you can create a site tailored to a specific experience. We've even included CSS styles to hide and show elements on different device types, so you can easily turn pieces on and off for each experience.</p>
-
+
<h4>Examples</h4>
<div class="row">
<div class="four columns">
</a>
</div>
</div>
-
+
</div>
<div class="two columns pull-ten">
<ul class="side-nav">
</ul>
</div>
</div>
-
- </section>
-
+
+ </section>
+
<?php include("includes/_footer.php"); ?>
-<? $page_title = "Rapid Prototyping and Building Framework from ZURB" ?>
+<? $page_title = "Rapid Prototyping Marketing Site" ?>
<?php include("includes/_header.php"); ?>
-
-
+
+
<header>
<div class="row">
<div class="twelve columns">
</div>
</div>
</header>
-
+
<section id="mainContent" class="example">
-
+
<div class="row">
<div class="three columns">
<a href="index.php"><img src="http://placehold.it/200x60" /></a>
</nav>
</div>
</div>
-
+
</div>
</header>
<div class="container">
<div class="row">
<div class="twelve columns">
-
+
<div class="jumbotron homepage">
<img src="http://placehold.it/940x300" class="bg" />
<div class="content">
<h1>Rebekah Children's Services helps kids and families in need with tons of great programs.</h1>
<a href="get-involved/" class="large radius nice blue button">Get Involved</a>
</div>
-
+
<a href="#" id="prev" class="slider">←</a>
<a href="#" id="next" class="slider">→</a>
</div>
-
+
</div>
- </div>
-
+ </div>
+
<div class="row">
<div class="four columns">
<a href="services/adoption-foster-care.php"><img src="http://placehold.it/400x300" /></a>
<h3><a href="/events">Next Event: Let It Snow</a></h3>
</div>
</div>
-
+
<div class="row">
<div class="twelve columns">
<div class="blog panel">
</div>
</div>
</div>
-
+
<div class="row">
<div class="six columns">
<div class="row">
</div>
</div>
</div>
-
- </section>
-
+
+ </section>
+
<?php include("includes/_footer.php"); ?>
-<? $page_title = "Rapid Prototyping and Building Framework from ZURB" ?>
+<? $page_title = "Rapid Prototyping Social Network Example" ?>
<?php include("includes/_header.php"); ?>
-
-
+
+
<header>
<div class="row">
<div class="twelve columns">
</div>
</div>
</header>
-
+
<section id="mainContent" class="example">
-
+
<div class="row">
<div class="eight columns">
<h3>Ye Olde Game Reviews</h3>
<p><a href="#">Login</a> <a href="#" class="">Sign Up</a>
</div>
</div>
-
+
<div class="row">
<div class="twelve columns">
<ul class="block-grid four-up">
</ul>
</div>
</div>
-
+
<div class="row">
<hr />
</div>
-
+
<div class="row">
<div class="six columns">
<h4>Gaming News</h4>
<h5><a href="#">Games of the Future will have 16 Bits</a></h5>
<p>We don't even know what it means, but we heard from a trusted source that games in the future will have 16 whole bits in them. Get ready, we guess? <a href="#">Read More →</a></p>
-
+
<h5><a href="#">Does Nintendo Have Plans for Games?</a></h5>
<p>Japenese playing card manufacturer Nintendo may have ideas about entering the gaming industry. We've heard rumors they are working on something called Famicon, but take it with a grain of salt. We imagine Atari will dominate games for the next 20 or 30 years. <a href="#">Read More →</a></p>
</div>
</div>
</div>
</div>
-
- </section>
-
+
+ </section>
+
<?php include("includes/_footer.php"); ?>
-<? $page_title = "Rapid Prototyping and Building Framework from ZURB" ?>
+<? $page_title = "Rapid Prototyping Social Network Example" ?>
<?php include("includes/_header.php"); ?>
-
-
+
+
<header>
<div class="row">
<div class="twelve columns">
</div>
</div>
</header>
-
+
<section id="mainContent" class="example">
-
+
<div class="row">
<a href="prototyping.php" class="back two columns">← About Prototyping</a>
<hr />
</div>
</div>
-
+
<section id="exampleHeader">
<div class="container">
<div class="row">
</div>
</div>
</section>
-
+
<div class="container">
-
+
<div class="row">
<div class="seven columns">
<div class="row mobile">
This is a website for people who live in gigantic trees. Learn about how to go from branch to branch, and where to keep your crazy screaming flying dragon thing.</p>
</div>
</div>
-
-
+
+
<section class="comments">
<div class="row">
<div class="two phone-one columns">
</div>
</div>
<hr />
-
+
<div class="row">
<div class="two phone-one columns">
<img src="http://placehold.it/200x200" />
</div>
<div class="ten phone-three columns">
<p><strong><a href="">Jake Sully</a> said:</strong><br />Has anyone seen my wheelchair? This isn't funny guys.</p>
-
-
+
+
<section class="comments">
<div class="row">
<div class="two phone-one columns">
<li><img src="http://placehold.it/100x100" /></li>
<li><img src="http://placehold.it/100x100" /></li>
</ul>
-
+
<h5>Videos</h5>
<img src="http://placehold.it/400x300" />
<strong><a href="#">A Sweet Video</a></strong> • YouTube
<li><img src="http://placehold.it/100x100" /></li>
<li><img src="http://placehold.it/100x100" /></li>
</ul>
-
+
<h5>Links</h5>
<p><strong><a href="#">Huge Trees and You: How to live in a giant tree</a></strong> This is a website for people who live in gigantic trees. Learn about...</p>
</li>
</ul>
</div>
</div>
-
- </section>
-
+
+ </section>
+
<?php include("includes/_footer.php"); ?>
-<? $page_title = "Rapid Prototyping and Building Framework from ZURB" ?>
+<? $page_title = "Rapid Prototyping" ?>
<?php include("includes/_header.php"); ?>
-
+
<header>
<div class="row">
<div class="twelve columns">
</div>
</div>
</header>
-
+
<section id="mainContent">
-
+
<div class="row">
-
+
<div class="ten columns push-two">
<p class="show-for-small"><a href="index.php">← Back to Home</a></p>
<img src="images/feature-prototyping-1.jpg">
<h4>Mockups don't tell a story. Build a prototype in no time.</h4>
<p>The difference between a good site and a great site is iteration — building something, playing with it, refining it. In Foundation we've included dozens of styles to help you quickly prototype a site; multiple button sizes and styles, tabs, custom form elements, modal dialogs, image sliders and a lot more. All of the prototype elements are production-ready code, and easy to style up. <a href="docs/ui.php">UI Docs →</a></p>
-
+
<h4>Examples</h4>
<div class="row">
<div class="four columns">
</a>
</div>
</div>
-
+
</div>
<div class="two columns pull-ten">
<ul class="side-nav">
</ul>
</div>
</div>
-
- </section>
-
+
+ </section>
+
<?php include("includes/_footer.php"); ?>
projects / thirdparty / foundation / foundation-sites.git / commitdiff
