mirror of
https://github.com/mdbootstrap/mdb-ui-kit.git
synced 2024-11-25 11:04:09 +03:00
Added support for Toastr.
This commit is contained in:
parent
89058f385b
commit
0561821390
|
@ -62,6 +62,15 @@ Remember to use the proper HTML markup to get radio and checkboxes styled correc
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
# Plugins
|
||||||
|
|
||||||
|
Material Design for Bootstrap comes with styling support for various Bootstrap plugins, at the moment only one plugin is supported but others will come:
|
||||||
|
|
||||||
|
### Toastr
|
||||||
|
|
||||||
|
Create snackbars and toasts with Toastr plugin, the default toast style is the squared one (snackbar style), if you like to use the rounded style (toast style) please add the `rounded` class to the `positionClass` option of Toastr.
|
||||||
|
|
||||||
|
![toastr](screenshots/toastr-preview.jpg)
|
||||||
|
|
||||||
# Compatibility
|
# Compatibility
|
||||||
|
|
||||||
|
|
49
popups.less
Normal file
49
popups.less
Normal file
|
@ -0,0 +1,49 @@
|
||||||
|
// main: material.less
|
||||||
|
|
||||||
|
.popover, .tooltip-inner {
|
||||||
|
background: #323232;
|
||||||
|
color: #FFF;
|
||||||
|
border-radius: 2px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.tooltip, .tooltip.in {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.popover, .tooltip {
|
||||||
|
&.left .arrow:after, &.left .tooltip-arrow {
|
||||||
|
border-left-color: #323232;
|
||||||
|
}
|
||||||
|
&.right .arrow:after, &.right .tooltip-arrow {
|
||||||
|
border-right-color: #323232;
|
||||||
|
}
|
||||||
|
&.top .arrow:after, &.top .tooltip-arrow {
|
||||||
|
border-top-color: #323232;
|
||||||
|
}
|
||||||
|
&.bottom .arrow:after, &.bottom .tooltip-arrow {
|
||||||
|
border-bottom-color: #323232;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Support for toastr plugin (in material they are snackbars)
|
||||||
|
// http://codeseven.github.io/toastr/
|
||||||
|
|
||||||
|
#toast-container > div {
|
||||||
|
background-color: #323232;
|
||||||
|
.shadow-z-1;
|
||||||
|
border-radius: 2px;
|
||||||
|
opacity: 1;
|
||||||
|
color: @darkbg-text;
|
||||||
|
}
|
||||||
|
.toast-close-button:hover, .toast-close-button:focus {
|
||||||
|
color: @darkbg-text;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
#toast-container.toast-top-full-width > div, #toast-container.toast-bottom-full-width > div {
|
||||||
|
width: 100%;
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
#toast-container.rounded > div {
|
||||||
|
border-radius: 200px;
|
||||||
|
}
|
BIN
screenshots/toastr-preview.jpg
Normal file
BIN
screenshots/toastr-preview.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 11 KiB |
Loading…
Reference in New Issue
Block a user