fix: notification

Author: Mengobs

demo/index.html

@@ -66,15 +66,15 @@
         function summon_messagebox() {
             document.body.insertAdjacentHTML("beforeend", `<swift-messagebox iconpath="../Logo.png">
     <p slot="title">Messagebox</p>
-    <p slot="text">This message box is part of WebSwift, designed with reference to Apple Design Resources.</p>
+    <p slot="text">This message box is part of WebSwift, designed by Apple in California</p>
     <swift-button primary slot="button" onclick="this.parentNode.remove()">OK</swift-button>
 </swift-messagebox>`);
         }
 
         function summon_notification() {
-            document.body.insertAdjacentHTML("beforeend", `<swift-notification iconpath="../Logo.png">
+            document.body.insertAdjacentHTML("beforeend", `<swift-notification iconpath="../Logo.png" onclick="this.remove()">
     <p slot="title">Notification</p>
-    <p slot="text">This notification is part of WebSwift, designed with reference to Apple Design Resources.</p>
+    <p slot="text">This notification is part of WebSwift, designed by Apple in California</p>
     <p slot="time">now</p>
 </swift-notification>`);
         }

docs/overrides/js/webswift.js

@@ -48,7 +48,6 @@ class Notification extends initElement({
   -webkit-backdrop-filter: blur(30px);
           backdrop-filter: blur(30px);
   animation: in 0.4s ease;
-  padding: 13px 0;
 }
 :host(.close) {
   animation: out 0.4s ease;
@@ -65,6 +64,7 @@ class Notification extends initElement({
   color: rgba(0, 0, 0, 0.85);
   line-height: 16px;
   margin: 0;
+  margin-top: 13px;
 }
 ::slotted([slot=text]) {
   font-family: "SFPro-Regular", "PingFangSC-Regular";
@@ -74,6 +74,7 @@ class Notification extends initElement({
   line-height: 16px;
   width: 255px;
   margin: 0;
+  margin-bottom: 13px;
 }
 ::slotted([slot=time]) {
   font-family: "SFPro-Regular", "PingFangSC-Regular";