Styling

CSS/SASS Styles

Load the default Bootstrap theme style and/or customize it to your taste (customization requires SASS)

CSS

Default compiled css (if you use the plain Bootstrap Theme CSS, you could simply add it to your .angular-cli.json file and be done with it)

"styles": [
    "../node_modules/bootstrap/dist/css/bootstrap.css",
    "../node_modules/font-awesome/css/font-awesome.css",
    "styles.css",
    "../node_modules/angular-slickgrid/styles/css/slickgrid-theme-bootstrap.css"
],

SASS (scss)

You could also compile the SASS files with your own customization, for that simply take any of the _variables.scss (without the !default flag) variable file and make sure to import the Bootstrap Theme afterward. For example, you could modify your style.scss with the following changes:

/* for example, let's change the mouse hover color */
$cell-odd-background-color: lightyellow;
$selected-hover-color: lightgreen;

/* make sure to add the @import the SlickGrid Bootstrap Theme AFTER the variables changes */
@import '../node_modules/angular-slickgrid/styles/sass/slickgrid-theme-bootstrap.scss';

Bootstrap support

The creation of Angular-Slickgrid started with Bootstrap 3 support and Bootstrap 4 is now supported as well since version 1.2.0

• Bootstrap 3 demo
• Bootstrap 4 demo