Skip to content

zualex/frontend-template

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

53 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

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