VSETH Bootstrap Theme

This repository contains the VSETH Boostrap Theme. It is well structured and the structure should be strongly followed to provide an easy access to for later users and contributors.

Basic Theme structure

On the lowest level of the theme are the icons, and scss folders.

• The icons folder contains the VSETH icon-set and other used "icons" such as the emoji set
• The scss folder is more specified here.

vseth-bootstrap/
|
|-- icons/                # VSETH icon sets
|-- scss/                 # Raw SCSS
|
|-- CHANGELOG.md          # Changelog of VSETH theme
|-- LICENSE               # MIT License
`-- README.md             

SCSS structure

This structure divides the project into three basic types of files. Modules, partials, and vendor stylesheets

• The modules directory is reserved for Sass code that doesn't cause Sass to actually output CSS. Things like mixin declarations, functions, and variables.
• The partials directory is where the meat of the CSS is constructed. It is broken down to really fine categories, such as typography, buttons, textboxes, etc.
• The vendor directory is for third-party CSS. This is handy when using prepackaged components developed by other people. In general this files are not modified which makes it easy to update. They are load last, such that they can override previous code, to prevent undesired behaviour of the CSS.

Basic directory structure

scss/
|
|-- modules/              # Common modules
|   |-- _all.scss         # Include to get all modules
|   |-- _variables.scss   # Module name
|   |-- _functions.scss   # Etc...
|   |-- ...
|   |-- variables         # Variables
|   |   |-- ...
|   |
|   |-- mixins            # Mixins
|       |-- _mixins.scss
|       |-- ...
|
|-- partials/             # Partials
|   |-- utility/
|   |-- webapp/
|   |-- _base.sass        # imports for all mixins + global project variables
|   |-- _buttons.scss     # buttons
|   |-- _figures.scss     # figures
|   |-- _grids.scss       # grids
|   ...
|
|-- vendor/               # CSS or Sass from other projects
|   |-- bootstrap/
|   |-- react-select/
|   |-- vseth-icons/
|   ...
|
`-- vseth-bootstrap-theme.scss           # primary Sass file

Versioning

For transparency we use a changelog for this repository. The current version number of the VSETH theme consists of three numbers. The first number indicates a major change, this can be a change to the look and feel of the theme or a major update to Bootstrap. The second number indicates big changes such as new components added. The third number indicates updates and changes with in a bigger change.

Creators

Raphael Koch

• https://raphaelkoch.com
• https://github.com/rapkosi

Copyright and license

Bootstrap code copyright 2011-2018 the Bootstrap Authors and Twitter, Inc. Code released under the MIT License.

VSETH theme copyright 2019 the Creators and Verband der Studierenden an der ETH (VSETH). Code released under the MIT License.