<p class="btm-marg">Now you should have a new project folder created with foundation included along with all the awesome advantages that comes with SASS and Compass.</p>
<h5>Adding Foundation to an existing project</h5>
<ul class="disc">
- <li>Add <span class="keystroke">require "ZURB-foundation"</span> to your config.rb file</li>
+ <li>Add <span class="keystroke">require "zurb-foundation"</span> to your config.rb file</li>
<li><span class="keystroke">cd path/to/your-project</span></li>
<li>run <span class="keystrok">compass install zurb-foundation</span></li>
</ul>
<hr />
<h4>Offsets</h4>
- <p>Offsets allow you to create additional space between columns in a row. The offsets run from offset-by-one all the way up to offset-by-eleven. Like the rest of the grid they're nestable.</p>
+ <p>Offsets allow you to create additional space between columns in a row. The offsets run from offset-by-one all the way up to offset-by-eleven. Like the rest of the grid, they're nestable.</p>
<div class="row display">
<div class="one columns">
<h4 class="subheader">Everything you need to know to build for the future.</h4>
<div class="show-for-small menu-action">
- <a class='sidebar-button small secondary button' id='sidebarButton' href="#sidebar" >
+ <a class='sidebar-button small secondary button' id='sidebarButton' href="#sidebar">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="18px" height="18px" viewBox="0 0 48 48" enable-background="new 0 0 48 48" xml:space="preserve">
- <line fill="none" stroke="#000000" stroke-width="8" stroke-miterlimit="10" x1="0" y1="8.907" x2="48" y2="8.907"/>
- <line fill="none" stroke="#000000" stroke-width="8" stroke-miterlimit="10" x1="0" y1="24.173" x2="48" y2="24.173"/>
- <line fill="none" stroke="#000000" stroke-width="8" stroke-miterlimit="10" x1="0" y1="39.439" x2="48" y2="39.439"/>
- Menu
+ <line fill="none" stroke="#000000" stroke-width="8" stroke-miterlimit="10" x1="0" y1="8.907" x2="48" y2="8.907"/>
+ <line fill="none" stroke="#000000" stroke-width="8" stroke-miterlimit="10" x1="0" y1="24.173" x2="48" y2="24.173"/>
+ <line fill="none" stroke="#000000" stroke-width="8" stroke-miterlimit="10" x1="0" y1="39.439" x2="48" y2="39.439"/>
+ Menu
</svg>
</a>
</div>
<div class="row">
<div class="eight columns">
<h3>Welcome to Foundation 3.</h3>
- <p>Foundation 3 is built on 14 years of experience at ZURB building sites and apps for the Web. We believe designing responsively — designing for all devices and any device — is the future. Foundation is our way of helping you do that. What changed in Foundation 3? Almost everything. Here's what makes Foundation, Foundation.</p>
+ <p>Foundation 3 is built on ZURB's 14 years of experience at building sites and apps for the Web. We believe designing responsively — designing for all devices and any device — is the future. Foundation is our way of helping you do that. What changed in Foundation 3? Almost everything. Here's what makes Foundation, Foundation.</p>
<div class="row">
<div class="four columns">
<p>Buttons are one of the core interactive elements of the Web. We've included styles and patterns for buttons that make it simple to create everything from simple marketing CTAs to complex application toolbars.</p>
<h4><a href="forms.php">Forms</a></h4>
- <p>A combination of robust, extensible form styles and the built-in power of the Foundation Grid means you can create simple or complicated forms quickly and easily. Validation states, custom select and radio buttons and more are included.</p>
+ <p>A combination of robust, extensible form styles and the built-in power of the Foundation Grid means you can create simple or complicated forms quickly and easily; validation states, custom select and radio buttons and more are included.</p>
</div>
<div class="six columns">
<div class="row">
<div class="six columns">
<ul class="no-bullet customizer">
- <li><label><input type="checkbox"> All</label> <em>Kitchen sync</em></li> <!-- Need to have this check everything -->
+ <li><label><input type="checkbox" id="toggleCss"> All</label> <em>Kitchen sync</em></li> <!-- Need to have this check everything -->
<li><label><input type="checkbox"> globals.css</label> <em>Body and misc styles</em></li>
<li><label><input type="checkbox"> typography.css</label> <em>Global typography elements</em></li>
<li><label><input type="checkbox"> grid.css</label> <em>Responsive grid</em></li>
<label for="rowWidth">Max-Width</label>
<div class="row collapse">
<div class="ten columns">
- <input type="text" value="940" placeholder="#" id="rowWidth" />
+ <input type="text" value="940" placeholder="#" />
</div>
<div class="two columns">
<span class="postfix">px</span>
--- /dev/null
+(function ($) {
+ console.log('fire');
+});
\ No newline at end of file
$(function() {
// Set the negative margin on the top menu for slide-menu pages
var $selector1 = $('#topMenu'),
- events = 'click.fndtn touchstart.fndtn';
+ events = 'click.fndtn';
if ($selector1.length > 0) $selector1.css("margin-top", $selector1.height() * -1);
// Watch for clicks to show the sidebar
});
}
- // Adjust sidebars and sizes when resized
- $(window).resize(function() {
- $('body').removeClass('active');
- var $selector4 = $('#topMenu');
- if ($selector4.length > 0) $selector4.css("margin-top", $selector4.height() * -1);
- });
+ // // Adjust sidebars and sizes when resized
+ // $(window).resize(function() {
+ // // if (!navigator.userAgent.match(/Android/i)) $('body').removeClass('active');
+ // var $selector4 = $('#topMenu');
+ // if ($selector4.length > 0) $selector4.css("margin-top", $selector4.height() * -1);
+ // });
// Switch panels for the paneled nav on mobile
var $selector5 = $('#switchPanels');