sgauthier
6e64e138e2
All checks were successful
Publish To Prod / deploy_and_publish (push) Successful in 35s
58 lines
971 B
CSS
58 lines
971 B
CSS
.notif-transition-enter {
|
|
opacity : 0.01;
|
|
transition : opacity .5s ease-in;
|
|
}
|
|
|
|
.notif-transition-enter-active {
|
|
opacity : 1;
|
|
}
|
|
|
|
.notif-transition-leave {
|
|
opacity : 1;
|
|
transition : opacity .5s ease-in;
|
|
}
|
|
|
|
.notif-transition-leave-active {
|
|
opacity : 0.01;
|
|
}
|
|
|
|
.notif {
|
|
position : relative;
|
|
font : 1rem normal Helvetica, sans-serif;
|
|
overflow : hidden;
|
|
border-radius : 4px;
|
|
margin-bottom : 2px;
|
|
max-height : 400px;
|
|
box-sizing : border-box;
|
|
box-shadow : 0 0 1px 1px rgba(10, 10, 11, .125);
|
|
padding : 0.5rem;
|
|
color : #fff;
|
|
}
|
|
|
|
.notif--success {
|
|
background-color: #64ce83;
|
|
}
|
|
|
|
.notif--info {
|
|
background-color: #3ea2ff;
|
|
}
|
|
|
|
.notif--warning {
|
|
background-color: #ff7f48;
|
|
}
|
|
|
|
.notif--danger {
|
|
background-color: #e74c3c;
|
|
}
|
|
|
|
.notif__container {
|
|
position : fixed;
|
|
top : 10px;
|
|
right : 0;
|
|
left : 0;
|
|
z-index : 1000;
|
|
width : 80%;
|
|
max-width : 400px;
|
|
margin : auto;
|
|
}
|