This is the repository for the website used to document the SSB component library.
... clone repository ...
$ npm install
$ npm start
$ git checkout master
$ git pull
$ git checkout -b add-feature-x
... do changes ...
$ git commit -a -m "detailed commit message"
$ git status
... verify that correct files are included ...
$ git push -u origin add-feature-x
... create pull-request to master ...
The project is published with Github Pages.
To publish a new build, navigate to master branch and make sure you have the latest updates.
Make sure that the latest version of the component library is installed. Also make sure the version number in the header is correct.
Build the latest version with npm run build and makes sure the build doesn't fail.
When build is done, publish by running npm run deploy. The branch named gh-pages should
update and start the build process.
Styling is done with with the Sass language, using the SCSS syntax. Each component should have its own stylesheet, and there are a couple of global stylesheets as well. Please refrain from using custom colors, use the variables from the component library. Using variables makes it much easier if it's updated at any point.
The site uses bootstrap for simplicity's sake. If you detect any issues with bootstrap affecting the original design of a component, please submit at bug report at the component library repository.
There are media queries for responsive design. They look like this:
$mobile: 'screen and (max-width: 767px)';
$tablet: 'screen and (min-width: 768px) and (max-width: 991px)';
$desktop: 'screen and (min-width: 992px)';Use them like this in your components:
@media #{$mobile} {
// mobile style
}Go from smallest to largest to ensure that styles are being overwritten in the correct order.