From c0eb82f55a40f64025800c0ad2b6a05290576337 Mon Sep 17 00:00:00 2001 From: Indrajith K L Date: Tue, 19 Dec 2017 14:21:29 +0530 Subject: Now supports * type arguments, * positional parameters and * html as content * Documentation updates --- src/styles/style.css | 50 ++++++++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 48 insertions(+), 2 deletions(-) (limited to 'src/styles/style.css') diff --git a/src/styles/style.css b/src/styles/style.css index b941e56..45e869e 100644 --- a/src/styles/style.css +++ b/src/styles/style.css @@ -10,11 +10,25 @@ box-sizing: border-box; } -.notif-mainContainer.topRight{ +.notif-mainContainer.top-right{ top: 8px; right: 8px; } +.notif-mainContainer.bottom-right{ + bottom: 8px; + right: 8px; +} + +.notif-mainContainer.top-left{ + top: 8px; + left: 8px; +} +.notif-mainContainer.bottom-left{ + bottom: 8px; + left: 8px; +} + .notif-inner { display: flex; flex-direction: column; @@ -22,16 +36,48 @@ .vanilla-yo-notification{ width: 250px; - background: #58a758; color: white; position: relative; cursor: pointer; padding: 8px; margin-bottom: 12px; display: flex; + border-radius: 10px; + -webkit-animation-duration: 500ms;animation-duration: 500ms; +} + +.vanilla-yo-notification.error { + background: #e74c3c; +} + +.vanilla-yo-notification.warning { + background: #f39c12; +} + +.vanilla-yo-notification.success { + background: #2ecc71; +} + + + +@-webkit-keyframes fadeOut { + 0% {opacity: 1;} + 100% {opacity: 0;} + } + + @keyframes fadeOut { + 0% {opacity: 1;} + 100% {opacity: 0;} + } + +.close { + -webkit-animation-name: fadeOut; + animation-name: fadeOut; } + + .notification_header{ font-size: 15px; font-weight: bold -- cgit v1.2.3