mirror of
https://github.com/mdbootstrap/mdb-ui-kit.git
synced 2024-11-29 13:04:14 +03:00
separated snackbarjs css
This commit is contained in:
parent
63b196bfce
commit
7d89e38f02
42
less/plugin-snackbarjs.less
Normal file
42
less/plugin-snackbarjs.less
Normal file
|
@ -0,0 +1,42 @@
|
||||||
|
// main: material.less
|
||||||
|
|
||||||
|
// Support for SnackbarJS plugin
|
||||||
|
// https://github.com/FezVrasta/snackbarjs
|
||||||
|
|
||||||
|
.snackbar {
|
||||||
|
// Style
|
||||||
|
background-color: #323232;
|
||||||
|
color: @darkbg-text;
|
||||||
|
font-size: 14px;
|
||||||
|
border-radius: 2px;
|
||||||
|
.shadow-z-1;
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
height: 0;
|
||||||
|
-moz-transition: -moz-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s;
|
||||||
|
-webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s;
|
||||||
|
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s;
|
||||||
|
-moz-transform: translateY(200%);
|
||||||
|
-webkit-transform: translateY(200%);
|
||||||
|
transform: translateY(200%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.snackbar.snackbar-opened {
|
||||||
|
// Style
|
||||||
|
padding: 14px 15px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
|
||||||
|
// Animation
|
||||||
|
height: auto;
|
||||||
|
-moz-transition: -moz-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s;
|
||||||
|
-webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s;
|
||||||
|
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, height 0 linear 0.2s;
|
||||||
|
-moz-transform: none;
|
||||||
|
-webkit-transform: none;
|
||||||
|
transform: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Variations
|
||||||
|
.snackbar.toast {
|
||||||
|
border-radius: 200px;
|
||||||
|
}
|
|
@ -25,44 +25,3 @@
|
||||||
border-bottom-color: #323232;
|
border-bottom-color: #323232;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Support for SnackbarJS plugin
|
|
||||||
// https://github.com/FezVrasta/snackbarjs
|
|
||||||
|
|
||||||
.snackbar {
|
|
||||||
// Style
|
|
||||||
background-color: #323232;
|
|
||||||
color: @darkbg-text;
|
|
||||||
font-size: 14px;
|
|
||||||
border-radius: 2px;
|
|
||||||
.shadow-z-1;
|
|
||||||
|
|
||||||
// Animation
|
|
||||||
height: 0;
|
|
||||||
-moz-transition: -moz-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s;
|
|
||||||
-webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s;
|
|
||||||
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s;
|
|
||||||
-moz-transform: translateY(200%);
|
|
||||||
-webkit-transform: translateY(200%);
|
|
||||||
transform: translateY(200%);
|
|
||||||
}
|
|
||||||
|
|
||||||
.snackbar.snackbar-opened {
|
|
||||||
// Style
|
|
||||||
padding: 14px 15px;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
|
|
||||||
// Animation
|
|
||||||
height: auto;
|
|
||||||
-moz-transition: -moz-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s;
|
|
||||||
-webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s;
|
|
||||||
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, height 0 linear 0.2s;
|
|
||||||
-moz-transform: none;
|
|
||||||
-webkit-transform: none;
|
|
||||||
transform: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Variations
|
|
||||||
.snackbar.toast {
|
|
||||||
border-radius: 200px;
|
|
||||||
}
|
|
||||||
|
|
Loading…
Reference in New Issue
Block a user