Using SB-Components¶
dev guide for installing and running sb-components
Install peer dependencies¶
- react
- react-dom
- bootstrap
- jquery
- react-modal
- font-awesome
- typeface-pt-sans-caption
- typeface-pt-serif
- type-pt-serif-caption
- @sbac/SBAC-Global-UI-Kit
Install sb-components using npm:¶
npm install --save @osu-cass/sb-components
Typings¶
Included in lib
Required Assets¶
Copies images from sbac global to project public directory Use webpack copy
npm install --save-dev copy-webpack-plugin
Webpack config:
new CopyWebpackPlugin([
{
from: path.join(__dirname, 'node_modules', '@sbac/sbac-ui-kit/src/images/'),
to: path.join(__dirname, 'public', 'Assets/Images')
}
])
Required Less¶
In order to use the sbac global style sheet, use a less file to bundle peer dependencies bootstrap, font-awesome, sbac-ui, and this project
- See example in Assets/Styles/bundle.less
- Sbac-ui uses default bootstrap constants and can be overwritten during this step
Create a less file
//** bundle.less
//## Peers
@import "~bootstrap/less/bootstrap.less";
@import "~font-awesome/less/font-awesome.less";
@import "~@sbac/sbac-ui-kit/src/less/sbac-ui-kit.less";
@import "~@osu-cass/sb-components/lib/Assets/Styles/sb-components.less";
//## Custom Styles
{your styles here}