1
0
mirror of https://github.com/ascribe/onion.git synced 2024-11-14 17:15:08 +01:00
onion/sass/ascribe-global-notification.scss
2015-07-10 13:54:25 +02:00

66 lines
1.2 KiB
SCSS

.ascribe-global-notification {
position: fixed;
background-color: #212121;
color: white;
width: 100%;
height:3.5em;
left:0;
display:table;
transition: .2s bottom cubic-bezier(0.77, 0, 0.175, 1);
}
.ascribe-global-notification-off {
bottom: -3.5em;
}
.ascribe-global-notification-on {
bottom: 0;
}
.ascribe-global-notification > div, .ascribe-global-notification-bubble > div {
display:table-cell;
vertical-align: middle;
font-size: 1.25em;
font-family: 'Source Sans Pro';
text-align: right;
padding-right: 3em;
}
.ascribe-global-notification-bubble > div {
padding: .75em 1.5em .75em 1.5em;
}
.ascribe-global-notification-bubble {
position: fixed;
bottom: 3em;
right: -50em;
display:table;
height: 3.5em;
background-color: #212121;
border-radius: 2px;
color: white;
transition: 1s right ease;
}
.ascribe-global-notification-bubble-off {
right: -100em;
}
.ascribe-global-notification-bubble-on {
right: 3.5em;
}
.ascribe-global-notification-danger {
background-color: #d9534f;
}
.ascribe-global-notification-success {
background-color: rgba(2, 182, 163, 1);
}