Menu icon Foundation

Developer

My Posts

  • NEW
  • 90% of current element's font-size?

    By Aaron

    foundation6Sass

    Is it possible to create a class that always simply downsizes the font-size of the current element? For instance, I have my current header sizes set (shown below) and if a user adds the class .small-header to the header tag, I'd like to set the font-... (continued)


  • 5
    Replies
  • Copying php files into dist (6.x)

    By Aaron

    PHP

    I am trying to upgrade from 5 to 6 and have some php files that simply need to be copied into the dist directory. I apparently don't have a good understanding of gulp, because I can't make this happen. Adding the extension to the pages task looks like i... (continued)

    Last Reply by miss ziva 6 months ago


  • 6
    Replies
  • Is Foundation for Apps for me?

    By Aaron

    apps

    I've been using Foundation for a while, love Grunt, love Sass. Anyway, I'm looking to start a project that would be accessed by a web browser, but I'd like for it to have the feel of an app. I've looked at several frameworks, but most seem to be either g... (continued)

    Last Reply by Rafi Benkual almost 4 years ago


My Comments

Aaron commented on Aaron's post almost 3 years

For the moment, I have basically moved everything to a separate layout file and removed everything from the default layout except the body inclusion tag. This seems to accomplish my goals, but I would still love to know how to not get every file to get the default layout.

Aaron commented on Aaron's post almost 3 years

Yeah, that is what I tried first, but when it runs it through panini, it puts the whole php file inside the default.html layout. Anyway to not include it in panini but include it in the pages process?

I also would rather not move the php files, because the site is launched and urls set.

With 5, I understood grunt much better, and simply copied the php files over into dist under the watch command or build command with no further processing.

Aaron commented on Aaron's post almost 3 years

Here's the code I'm using

//Copy php files into dist
gulp.task('copy:php', function() {
  return gulp.src('src/pages/**/*.{php}')
    .pipe(gulp.dest('dist'));
});

 // Build the "dist" folder by running all of the above tasks
gulp.task('build', function(done) {
  sequence('clean', ['pages','copy:php','sass', 'javascript', 'images', 'copy'], 'styleguide', done);
});

// Start a server with LiveReload to preview the site in
gulp.task('server', ['build'], function() {
  browser.init({
    server: 'dist', port: PORT
  });
});

// Build the site, run the server, and watch for file changes
gulp.task('default', ['build', 'server'], function() {
  gulp.watch(PATHS.assets, ['copy']);
  gulp.watch(['src/pages/**/*'], ['pages','copy:php']);
  gulp.watch(['src/{layouts,partials,helpers,data}/**/*'], ['pages:reset']);
  gulp.watch(['src/assets/scss/**/{*.scss, *.sass}'], ['sass']);
  gulp.watch(['src/assets/js/**/*.js'], ['javascript']);
  gulp.watch(['src/assets/img/**/*'], ['images']);
  gulp.watch(['src/styleguide/**'], ['styleguide']);
});

Aaron commented on Aaron's post almost 4 years

One last question since I am still in the hunt for a framework while still using Foundation for Sites for current projects, is Foundation for Apps accessible?

Aaron commented on Aaron's post almost 4 years

Let me add that I have figured out my testing device (an iPod) on iOS 6 is apparently not supported, so that could be the problem with the text.

Aaron commented on Aaron's post almost 4 years

Thank you for the reply Rafi. One thing that threw me off was when I downloaded Foundation for Apps, ran the watch command, then pulled the result up on my phone. It didn't look that great, the menu bar just stacked items and default text didn't show up on my phone which was there on desktop.

In addition, "Enabling HTML5 Mode and working with Angular on a server" in the documentation kind of threw me (which admittedly may be a part of something I don't understand about Angular).

Those two things combined to make me think I was in the wrong place and maybe this was purely for hybrid apps running on phones with Phonegap or some other sort of bridge framework.

So, can I assume that the above problems just part of my ignorance of the framework and digging in further will eliminate or diminish these issues?

Aaron commented on Charles Smith's post about 5 years

This is something I'd love to see a blog post on. With F5, it is set up from the beginning so that gruntjs will perform a lot of best practices for you. There just doesn't seem to be a doc page on "After the install".

What are the best practices as far as custom css and custom js?

More broadly, how should customization be done so that upgrades can be performed without overwriting this customization?

Posts Followed

No Content

Following

    No Content

Followers

My Posts




My Comments

You commented on Aaron's post almost 3 years

For the moment, I have basically moved everything to a separate layout file and removed everything from the default layout except the body inclusion tag. This seems to accomplish my goals, but I would still love to know how to not get every file to get the default layout.

You commented on Aaron's post almost 3 years

Yeah, that is what I tried first, but when it runs it through panini, it puts the whole php file inside the default.html layout. Anyway to not include it in panini but include it in the pages process?

I also would rather not move the php files, because the site is launched and urls set.

With 5, I understood grunt much better, and simply copied the php files over into dist under the watch command or build command with no further processing.

You commented on Aaron's post almost 3 years

Here's the code I'm using

//Copy php files into dist
gulp.task('copy:php', function() {
  return gulp.src('src/pages/**/*.{php}')
    .pipe(gulp.dest('dist'));
});

 // Build the "dist" folder by running all of the above tasks
gulp.task('build', function(done) {
  sequence('clean', ['pages','copy:php','sass', 'javascript', 'images', 'copy'], 'styleguide', done);
});

// Start a server with LiveReload to preview the site in
gulp.task('server', ['build'], function() {
  browser.init({
    server: 'dist', port: PORT
  });
});

// Build the site, run the server, and watch for file changes
gulp.task('default', ['build', 'server'], function() {
  gulp.watch(PATHS.assets, ['copy']);
  gulp.watch(['src/pages/**/*'], ['pages','copy:php']);
  gulp.watch(['src/{layouts,partials,helpers,data}/**/*'], ['pages:reset']);
  gulp.watch(['src/assets/scss/**/{*.scss, *.sass}'], ['sass']);
  gulp.watch(['src/assets/js/**/*.js'], ['javascript']);
  gulp.watch(['src/assets/img/**/*'], ['images']);
  gulp.watch(['src/styleguide/**'], ['styleguide']);
});

You commented on Aaron's post almost 4 years

One last question since I am still in the hunt for a framework while still using Foundation for Sites for current projects, is Foundation for Apps accessible?

You commented on Aaron's post almost 4 years

Let me add that I have figured out my testing device (an iPod) on iOS 6 is apparently not supported, so that could be the problem with the text.

You commented on Aaron's post almost 4 years

Thank you for the reply Rafi. One thing that threw me off was when I downloaded Foundation for Apps, ran the watch command, then pulled the result up on my phone. It didn't look that great, the menu bar just stacked items and default text didn't show up on my phone which was there on desktop.

In addition, "Enabling HTML5 Mode and working with Angular on a server" in the documentation kind of threw me (which admittedly may be a part of something I don't understand about Angular).

Those two things combined to make me think I was in the wrong place and maybe this was purely for hybrid apps running on phones with Phonegap or some other sort of bridge framework.

So, can I assume that the above problems just part of my ignorance of the framework and digging in further will eliminate or diminish these issues?

You commented on Charles Smith's post about 5 years

This is something I'd love to see a blog post on. With F5, it is set up from the beginning so that gruntjs will perform a lot of best practices for you. There just doesn't seem to be a doc page on "After the install".

What are the best practices as far as custom css and custom js?

More broadly, how should customization be done so that upgrades can be performed without overwriting this customization?

Posts Followed

No Content

Following

  • No Content

Followers

  • No Content