Layout

Hello! In this article, I want to share my experience of custom layout development using the Bootstrap 3 framework.

What exactly will we do?

1. Learn how to install the SCSS version of Bootstrap via Bower
2. Configure Bootstrap's grid and other framework settings (if needed)
3. Include specific Bootstrap components in the final stylesheet

Project Configuration

First, let’s define the directory structure of our project. For example:

/_data
/scss
/bootstrap //This directory contains the Bootsrap files we modified
_bootstrap.scss //Connected components
_variables.scss //Variables
style.scss //Contains connections to other files
template.scss //Project styles
.bowerrc
bower.json
gulpfile.js
package.json
/assets //Contains scripts loaded by bower
/image //Images and project styles
index.php

read more...