AdminLTE/docs/components/plugins.md
2020-06-05 17:02:09 +03:00

97 lines
1.8 KiB
Markdown

---
layout: page
title: Plugins
---
AdminLTE comes with color overrides & extras for the following plugins.
### Bootstrap Slider
You can override the color for bootstrap slider tracks with the following classes:
- `.slider-*`
Example:
```html
<div class="slider-red">
<input type="text" value="" class="slider form-control" data-slider...>
</div>
```
You can also change the layout of the slider with the following classes:
- `.slider-vertical`
- `.slider-horizontal`
Example:
```html
<div class="slider-red">
<input type="text" value="" class="slider slider-vertical form-control" data-slider...>
</div>
```
### iCheck Bootstrap
You can override the color of a iCheck checkbox/radio input, add the following class:
- `.icheck-*`
Example:
```html
<div class="icheck-primary">
<input type="checkbox" id="checkbox1">
<label for="checkbox1">
Checkbox Label
</label>
</div>
```
### Pace
You can override the color for all pace themes, load your desired theme and add one the following classes to `body`:
- `.pace-*`
- barber-shop
- flat-top
- minimal
- `.pace-big-counter-*`
- big-counter
- `.pace-bounce-*`
- bounce
- `pace-center-atom-*`
- center-atom
- `pace-center-circle-*`
- center-circle
- `pace-center-radar-*`
- center-radar
- `pace-center-simple-*`
- center-simple
- `pace-corner-indicator-*`
- corner-indicator
- `.pace-flash-*`
- flash
- `.pace-fill-left-*`
- fill-left
- `.pace-loading-bar-*`
- loading-bar
- `.pace-material-*`
- material
- `.pace-mac-osx-*`
- mac-osx
Example: `<body class="pace-success">`
### SweetAlert
If you use SweetAlert and load the SweetAlert CSS before AdminLTE's CSS, then the colors of any icon changes to AdminLTE's default colors.
### Toastr
If you use Toastr and load the Toastr CSS before AdminLTE's CSS, then the background colors changes to AdminLTE's default colors.