index.html

---
layout: default
title: Whoa! Jekyll, Foundation 6, HTML5 boilerplate and github pages!
description: This is my project. Welcome.
keywords: github pages, Jekyll, foundation 6
---

<section role="main" class="grid-x">
  <div class="small-12 cell">
    <h1 class="mvl text-center">{{ page.title }}</h1>

    <div class="grid-x">
      <div class="medium-10 large-8 medium-offset-1 large-offset-2 cell">
        
        <p class="mbm">I've combined my locally installed <a href="http://foundation.zurb.com/docs/sass.html">libsass/gulp version of foundation 6</a>, <a href="http://html5boilerplate.com/">html5 boilder plate</a>, and Jekyll to be used for github pages! See <a href="http://jekyllrb.com/docs/home/">Jekyll's documentation</a>, <a href="http://foundation.zurb.com/sites/docs/">the foundation documentations</a>, and <a href="https://help.github.com/categories/20/articles">GitHub pages help pages</a>.</p>

        <p class="mbl">You can see all <a href="https://github.com/daigofuji/jekyll-foundation-6-starter/tree/gh-pages"><i class="fab fa-github"></i> my sources here</a>. I created this for my personal use, but if you'd like to use it, please feel free. Shout out to <a href="http://daigo.org">daigo.org</a> or <a href="http://twitter.com/DaigoFuji">@DaigoFuji</a> are appreciated, but not required.</p>

        <div class="callout secondary radius mvl">
          <p>You should probably update the <samp>_config.yml</samp> file, and edit <samp>scss/_setting.scss</samp> file. As well as <samp>scss/_custom.scss</samp>, where most the overrides are happening.</p>
        </div>

      </div>
    </div>

    <div class="grid-x"> 

      <div class="large-4 cell">
        <p>Updated to support Foundation 6.4 with its awesome <a href="https://foundation.zurb.com/sites/docs/xy-grid.html">XY-Grid</a> and <a href="https://foundation.zurb.com/sites/docs/flexbox-utilities.html">Flexbox Utilities</a>, creating complicated layouts just got a lot simpler. If you are upgrading from old layouts, replace <code>row</code> with <code>grid-x</code> and <code>column</code> with <code>cell</code>.</p>
      </div>

      <div class="large-4 cell">
        <p>You can also take advantage of Foundation's <a href="https://foundation.zurb.com/sites/docs/">Javascript Utilities</a> out of the box on github pages. Example are shown in <a href="page-foundation-example.html">foundation-example</a> page.</p>
      </div>

      <div class="large-4 cell">
        <p>And finally, from <a href="page-template-example.html">page-template-example</a> You can <a href="http://foundation.zurb.com/templates.html">get starter templates</a> from foundations for often used patterns and designs.</p>
      </div>

    </div>

    <div class="grid-x">
      <div class="medium-10 large-8 medium-offset-1 large-offset-2 cell">
      
        <p class="mvl">This also supports <a href="https://fontawesome.com/"><i class="fab fa-font-awesome fa-lg"></i>
        Font Awesome</a> version 5, so you can go crazy with <a href="https://fontawesome.com/icons">the icons</a>: <i class="fab fa-bitcoin fa-lg"></i> <i class="fas fa-spinner fa-pulse fa-lg"></i> <i class="fas fa-beer fa-lg"></i>  <i class="fas fa-hand-peace fa-lg"></i>. </p> 

      </div>
    </div>

  </div>
</section>