1
0
Fork 0
mirror of https://github.com/YunoHost-Apps/movim_ynh.git synced 2024-09-03 19:46:19 +02:00
movim_ynh/sources/app/widgets/Notification/notification.css
2015-08-19 11:28:28 +02:00

74 lines
1.7 KiB
CSS

#notification_widget {
position: fixed;
bottom: 0px;
left: 0px;
z-index: 5;
max-width: 100%;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
padding: 1em;
}
#notification_widget .notif {
transition: background-color 0.3s ease;
background-color: #323232;
border-radius: 0.1em;
margin-top: 1em;
width: 100%;
color: white;
padding: 0.7em 1.3em;
opacity: 1;
line-height: 1.5em;
}
#notification_widget .notif:hover {
background-color: #151515;
cursor: pointer;
}
.notificationAnim {
opacity: 0;
visibility: hidden;
position: relative;
-webkit-animation: fadeOut 5s linear;
-moz-animation: fadeOut 5s linear;
-ms-animation: fadeOut 5s linear;
-o-animation: fadeOut 5s linear;
animation: fadeOut 5s linear;
}
@-webkit-keyframes fadeOut {
0% { opacity: 0; visibility: visible; }
5% { opacity: 1; visibility: visible; }
90% { opacity: 1; visibility: visible; }
100% { opacity: 0; visibility: hidden; }
}
@-moz-keyframes fadeOut {
0% { opacity: 0; visibility: visible; }
5% { opacity: 1; visibility: visible; }
90% { opacity: 1; visibility: visible; }
100% { opacity: 0; visibility: hidden; }
}
@-ms-keyframes fadeOut {
0% { opacity: 0; visibility: visible; }
5% { opacity: 1; visibility: visible; }
90% { opacity: 1; visibility: visible; }
100% { opacity: 0; visibility: hidden; }
}
@media screen and (max-width: 1024px) {
#notification_widget .notif {
width: 100%;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}
}