Echo JS 0.11.0

<~>
tracker1 2720 days ago. link 3 points
I usually go a couple steps further, which is to fully copy the bootstrap.scss main file as well as variables.scss ... I'll update the bootstrap.scss copy to point to the local variables... I've done mixins in the past but never actually found myself changing existing ones.  I'll include my own mixins that references the original.

In this way, I have...

    /styles/root.scss
      includes bootstrap.scss
    /styles/bootstrap.scss
      references local vars and mixins, rest from bootstrap
    /styles/_variables.scss
      copy of bootstrap variables
    /styles/_mixins.scss
      reference bootstrap's mixins

root is included at the top of the project...  Other components will have a .scss next to the component that may include variables and/or mixins as needed.

This way I can have my globals, and what I need inline.  Beyond all of this, it's easier to comment out parts of bootstrap I'm not using.  As to copying variables.scss, this is because I sometimes find it hard to remember what should/can be replaced.  I also will usually adjust the font bases, as well as some of the colors and styling choices in variables directly.

In the end it's a much cleaner codebase.

Replies

mulderp 2719 days ago. link 2 points
nice to get the design more modular - I've updated the example