Talend Bootstrap Theme
Base theme following Talend Style Guidelines.
Note: The example has been taken from the excellent project Bootstwatch.
Docs & Help
How to use
Install dependency
npm install --save bootstrap-talend-theme
or
yarn add --dev bootstrap-talend-theme
Configure your project
In every project, we use webpack with sass-loader + css modules.
Create your webpack file and fill it with your own configuration.
You should at least just change the $brand-primary
first to get your own colors;
const SASS_DATA = `
$brand-primary: #77828A;
@import '~bootstrap-talend-theme/src/theme/guidelines';
`;
module.exports = {
plugins: [
],
module: {
loaders: [
{
test: /\.scss$/,
exclude: /bootstrap.scss/,
loaders: ['style', 'css?sourceMap&modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!sass'],
},
],
},
sassLoader: {
data: SASS_DATA,
},
};
and in your app you can do the following
import '!style!css!sass!bootstrap-talend-theme/src/theme/theme.scss';
sassLoader data is a sassLib params which inject the content on every @import directive.
You can now add Bootstrap markup!
How to contribute
yarn && yarn start
Open http://localhost:1337/ to see your changes.