Bootstrap SCSS and Libsass over Compass

Utsav Munendrarequested to merge
phoenix/feature/bootstrap into phoenix/develop

If we use Bootstrap SCSS, then our own styles can @extend bootstrap classes, and then we can style all the add/edit/create forms for all the tables using a single style like this:

form {
   & > div { @extend .form-group }
   ...
}

Improvements

However, Compass cannot compile Bootstrap SCSS to CSS. So, this merge request present the following changes:

  • Including Bootstrap SCSS source files and including its compiled version in main.css.
  • Added instructions and Python script to replace Compass.
    • Original SASS website recommends LibSass
    • Bootstrap supports LibSass. Compass gave errors trying to compile Bootstrap
    • sass-cdli.py script will serve as a wrapper to the Node-Sass implementation of Libsass. For the front-end developer, everything should be the same, except for running compass watch, they would run ./sass-cdli.py
    • Added installation instructions in README. Like Compass, only developers changing SCSS/CSS and not all developers would require this to correctly view the website.
  • Added a Autoprefixer with the wrapper script ./sass-cdli.py
    • Adds vendor prefixes like -webkit- and -moz- to CSS when required which makes front-end developer's work easy.
    • Bootstrap SCSS requires Autoprefixer.
    • Current setting for autoprefixer in this merge request target 93% of the users with latest browsers.

Removed files

  • bootstrap.bundle.js, bootstrap.bundle.js.map, bootstrap.bundle.min.js, bootstrap.bundle.min.js.map: Same function is better implemented using Popper.js, and these file are not referenced anywhere in framework.
  • bootstrap.js, bootstrap.js.map: No file in framework uses these.
  • bootstrap.min.css: Only template layout file used this, but now this is available in main.css

Command used on framework to find the above stuff:

grep -rnwl . -e "search word"

Changes

The website should look and function exactly the same as before.

Merge request reports