DrupalCoders - Bootstrap Sass
Component ID
Component name
Component type
Maintenance status
Development status
Component security advisory coverage
Downloads
Component created
Component changed
Component body
Do you like SCSS? Do you find it hard to start with Bootstrap SASS?
This theme will help you get started with SCSS Bootstrap in minutes.
What is DrupalCoders Bootstrap SASS ?
DrupalCoders Bootstrap SASS intends to improve bootstrap base theme:
1. Creating sub-theme using Drush
2. Adding compilers for SCSS .
3. Improving SCSS files.
4. Adding easy to read media queries.
5. Dropdown Menu for Mobile and Desktop
Purpose of this theme is to easy add SASS sub-themes.
This theme is using Bootstrap as base theme.
Requirements
This theme is using Bootstrap as base theme, you need to download and enable it before installing DrupalCoders theme.
Bootstrap Theme
Installation
1. Install and enable the theme:
drush dl drupalcoders_bootstrap
drush en drupalcoders_bootstrap
2. Create a sub-theme using drush dc
command:drush dc [theme-name]
Example:'drush dc mytheme
'
4. Install node modules:
cd/path/mytheme
npm install
5. Compile and Watch SCSS files:
gulp
Usage
Media Queries are changed to:
$mobile: "screen and (max-width: #{$screen-xs-max})";
$tablet: "screen and (min-width: #{$screen-sm-min})";
$tablet-only: "(min-width: #{$screen-sm-min}) and (max-width: #{$screen-sm-max})";
$normal: "screen and (min-width: #{$screen-md-min})";
$normal-only: "(min-width: #{$screen-md-min}) and (max-width: #{$screen-md-max})";
$large: "screen and (min-width: #{$screen-lg-min})";
In SCSS you can use it like @media #{$tablet} { }
to help you style faster.
Recommended Modules:
Ckeditor Bootstrap Buttons
Glyphicons
Bootstrap Layouts
Paragraphs Bootstrap Layouts
Bootstrap Paragraphs
Views_bootstrap