zualex / frontend-template

Simple responsive template

Home Page:http://zualex.github.io/frontend-template/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Simple responsive template

The template used responsive:

  • Grid of 12 columns
  • Table
  • Menu with 4 types of animation:
    • Fold Out
    • Slide Down
    • Fade In/Out
    • Not Animated

The template uses:

  • Gulp
  • Browser-sync - automatic restart when changing the code page
  • Sass
  • Autoprefixer
  • Merge and compress CSS and JavaScript
  • Combining images into a sprite
  • Sass Guidelines An opinionated styleguide for writing sane, maintainable and scalable Sass.

Get started

Install packages:

npm install

Create environment file:

cp config.json.example config.json

And run command:

gulp

Commands gulp

  • gulp start - run browserSync
  • gulp reload - reload browserSync
  • gulp build:sprites - combining images into a sprite
  • gulp build:css - merge and compress CSS
  • gulp build:js - merge and compress JavaScript
  • gulp build:html - build html from twig
  • gulp compile - run commands build:sprites, build:css, build:js, build:html
  • gulp - run command start, compile and watch file

Сonfig

In config.json file specifies the path to the source

About

Simple responsive template

http://zualex.github.io/frontend-template/


Languages

Language:HTML 57.1%Language:CSS 34.1%Language:JavaScript 8.7%