Update foundation 5 to foundation-sites 6

generators/app/templates/_bower.json

@@ -41,7 +41,7 @@
     "bootstrap": "~3.3.5",
 <%   } -%>
 <% } if(props.ui.key === 'foundation') { -%>
-    "foundation": "~5.5.2",
+    "foundation-sites": "^6.1.2",
 <% } if(props.ui.key === 'angular-material') { -%>
     "angular-material": "~1.0.0",
     "material-design-iconfont": "~0.0.2",

generators/app/templates/src/app/_foundation/__foundation-index.scss

@@ -2,13 +2,14 @@
  *  If you want to override some foundation settings, you have to change values here.
  *  The list of settings values are listed here bower_components/foundation/scss/foundation/_settings.scss
  */
-$topbar-bg-color: #5AADBB;
+$topbar-background: #5AADBB;
 
 /**
  *  The import of foundation is made manually because there is still no links of the
  *  sass version in their bower.json...
  */
-@import '../<%- computedPaths.appToBower %>/bower_components/foundation/scss/foundation';
+@import '../../bower_components/foundation-sites/scss/foundation';
+@include foundation-everything;
 
 /**
  *  Do not remove the comments below. It's the markers used by wiredep to inject
@@ -28,7 +29,7 @@ $topbar-bg-color: #5AADBB;
   margin-top: 50px;
 }
 
-.th {
+.thumbnail {
   width: 100%;
   height: 200px;
 

generators/app/templates/src/app/components/navbar/__foundation-navbar.html

@@ -1,16 +1,18 @@
-<nav class="top-bar row">
-  <ul class="title-area">
+<div class="top-bar">
+  <ul class="top-bar-title menu">
     <li class="name">
       <h1><a href="https://github.com/Swiip/generator-gulp-angular">Gulp & Angular</a></h1>
     </li>
   </ul>
 
-  <section class="top-bar-section">
-    <ul class="right">
+  <section class="top-bar-right">
+    <ul class="menu">
+      <li class="acme-navbar-text">
+        Application was created {{ vm.relativeDate }}.
+      </li>
       <li class="active"><a ng-href="#">Home</a></li>
       <li><a ng-href="#">About</a></li>
       <li><a ng-href="#">Contact</a></li>
     </ul>
-    <p class="acme-navbar-text">Application was created {{ vm.relativeDate }}.</p>
   </section>
-</nav>
+</div>

generators/app/templates/src/app/components/navbar/__navbar.scss

@@ -1,3 +1,17 @@
 .acme-navbar-text{
   color: white;
 }
+
+a {
+  color: black;
+}
+
+h1 {
+  font-size: 2em;
+  margin: 0;
+  line-height: 1.25em;
+}
+
+a:hover, a:focus {
+  color: greenyellow;
+}

generators/app/templates/src/app/main/__foundation.html

@@ -10,8 +10,8 @@
         <h1>'Allo, 'Allo!</h1>
         <img src="assets/images/yeoman.png" alt="I'm Yeoman"><br>
         <p>Always a pleasure scaffolding your apps.</p>
-        <p class="animated infinite" ng-class="main.classAnimation">
-          <a href="#" class="button success" ng-click="main.showToastr()">Splendid Toastr</a>
+        <p>
+          <a href="#" class="button success animated infinite" ng-class="main.classAnimation" ng-click="main.showToastr()">Splendid Toastr</a>
         </p>
         <p>
           With ♥ thanks to the contributions of<acme-malarkey extra-values="['Yeoman', 'Gulp', 'Angular']"></acme-malarkey>
@@ -22,7 +22,7 @@ <h1>'Allo, 'Allo!</h1>
 
   <div class="row">
     <div class="large-4 columns" ng-repeat="awesomeThing in main.awesomeThings | orderBy:'rank'">
-      <div class="th">
+      <div class="thumbnail">
         <img class="right" ng-src="assets/images/{{ awesomeThing.logo }}" alt="{{ awesomeThing.title }}">
         <div class="caption">
           <h3>{{ awesomeThing.title }}</h3>

test/template/test-bower.js

@@ -140,7 +140,7 @@ describe('gulp-angular bower template', function () {
     model.props.cssPreprocessor.extension = 'scss';
     var result = bower(model);
     result.should.not.match(/bootstrap/);
-    result.should.not.match(/foundation/);
+    result.should.not.match(/foundation-sites/);
     result.should.not.match(/angular-material/);
     result.should.not.match(/material-design-lite/);
     result.should.not.match(/material-design-iconfont/);
@@ -150,7 +150,7 @@ describe('gulp-angular bower template', function () {
     result.should.match(/angular-material/);
     result.should.match(/material-design-iconfont/);
     result.should.not.match(/boostrap/);
-    result.should.not.match(/foundation/);
+    result.should.not.match(/foundation-sites/);
     result.should.not.match(/material-design-lite/);
 
     model.props.ui.key = 'material-design-lite';
@@ -159,15 +159,15 @@ describe('gulp-angular bower template', function () {
     result.should.match(/material-design-iconfont/);
     result.should.not.match(/boostrap/);
     result.should.not.match(/angular-material/);
-    result.should.not.match(/foundation/);
+    result.should.not.match(/foundation-sites/);
 
     model.props.ui.key = 'bootstrap';
     model.props.bootstrapComponents.key = 'ui-bootstrap';
     result = bower(model);
     result.should.match(/bootstrap-sass/);
     result.should.match(/angular-bootstrap/);
     result.should.not.match(/"bootstrap"/);
-    result.should.not.match(/foundation/);
+    result.should.not.match(/foundation-sites/);
     result.should.not.match(/angular-material/);
     result.should.not.match(/material-design-lite/);
     result.should.not.match(/material-design-iconfont/);
@@ -177,7 +177,7 @@ describe('gulp-angular bower template', function () {
     result = bower(model);
     result.should.match(/"bootstrap"/);
     result.should.match(/angular-strap/);
-    result.should.not.match(/foundation/);
+    result.should.not.match(/foundation-sites/);
     result.should.not.match(/angular-material/);
     result.should.not.match(/material-design-lite/);
     result.should.not.match(/material-design-iconfont/);
@@ -186,7 +186,7 @@ describe('gulp-angular bower template', function () {
     model.props.cssPreprocessor.extension = 'styl';
     result = bower(model);
     result.should.match(/bootstrap-stylus/);
-    result.should.not.match(/foundation/);
+    result.should.not.match(/foundation-sites/);
     result.should.not.match(/angular-material/);
     result.should.not.match(/material-design-lite/);
     result.should.not.match(/material-design-iconfont/);