mirror of
				https://github.com/mdbootstrap/mdb-ui-kit.git
				synced 2025-10-30 23:47:42 +03:00 
			
		
		
		
	Added support for Toastr.
This commit is contained in:
		
							parent
							
								
									89058f385b
								
							
						
					
					
						commit
						0561821390
					
				|  | @ -61,7 +61,16 @@ Remember to use the proper HTML markup to get radio and checkboxes styled correc | |||
|             Option one is this | ||||
|         </label> | ||||
|     </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. | ||||
| 
 | ||||
|  | ||||
| 
 | ||||
| # 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