diff options
Diffstat (limited to 'assets')
| -rw-r--r-- | assets/css/main/component.css | 43 |
1 files changed, 24 insertions, 19 deletions
diff --git a/assets/css/main/component.css b/assets/css/main/component.css index c116d60..1dd5107 100644 --- a/assets/css/main/component.css +++ b/assets/css/main/component.css @@ -33,20 +33,25 @@ button { }
/* Alert */
.alert {
- top: 0;
- left: 0;
- right: 0;
+ bottom: 0;
+ left: 15px;
z-index: 10;
padding: 1em;
position: fixed;
- color: #000;
- background: rgba(255,255,255,0.86);
- backdrop-filter: blur(18px);
- -webkit-backdrop-filter: blur(10px);
- border-radius: 6px;
+ color: #fff;
+ background: rgba(50,50,50,.95);
+ border-radius: 2px;
margin: 0 auto 1em auto;
- box-shadow: 0 5px 5px -2px rgba(0, 0, 0, 0.2);
- transition: .3s;
+ box-shadow: 0 2px 6px gray;
+ transition: .2s;
+}
+.alert.success {
+ background: #2ECC71;
+ color: #fff
+}
+.alert.failed {
+ background: #DD4B39;
+ color: #fff
}
.alert.adding {
-webkit-animation: slideDown 0.2s ease forwards;
@@ -58,30 +63,30 @@ button { }
@-webkit-keyframes slideDown {
0%{
- top: -150px;
+ bottom: -100px;
}
25%{
- top: -50px;
+ bottom: -50px;
}
50%{
- top: 0;
+ bottom: 0;
}
100%{
- top: 100px;;
+ bottom: 5px;
}
}
@-webkit-keyframes slideUp {
0%{
- top: 100px;
+ bottom: 5px;
}
25%{
- top: 0;
+ bottom: 0;
}
50%{
- top: -50px;
+ bottom: -50px;
}
100%{
- top: -200px;
+ bottom: -100px;
}
}
@@ -158,4 +163,4 @@ button { .bubble:hover {
transform: translateY(-6px);
box-shadow: 2px 8px 17px #bababa;
-}
+}
\ No newline at end of file |