From cc589cec95de1b6db19a8ce3cac1ede2e6d19b9f Mon Sep 17 00:00:00 2001
From: 2 * r + 2 * t <61896496+soramanew@users.noreply.github.com>
Date: Wed, 19 Feb 2025 00:03:47 +1100
Subject: notifpopups: more compact + better styles

---
 scss/notifpopups.scss        | 18 +++++-------------
 scss/widgets.scss            |  1 +
 src/widgets/notification.tsx | 35 ++++++++++++++++++++++++++---------
 3 files changed, 32 insertions(+), 22 deletions(-)

diff --git a/scss/notifpopups.scss b/scss/notifpopups.scss
index 18d4eda..04e0b2b 100644
--- a/scss/notifpopups.scss
+++ b/scss/notifpopups.scss
@@ -4,10 +4,6 @@
 @use "font";
 
 @mixin popup($colour, $alpha) {
-    @include lib.border($colour, $alpha);
-
-    border-right: none;
-
     .separator {
         background-color: $colour;
     }
@@ -20,21 +16,17 @@
 .notifpopups {
     min-width: lib.s(425);
     padding-left: lib.s(10); // So notifications can overshoot for init animation
-
-    // For shadow
-    & > :last-child .wrapper {
-        padding-bottom: lib.s(15);
-    }
+    padding-right: lib.s(10);
+    padding-top: lib.s(5);
 
     .notification {
         .wrapper {
-            padding-top: lib.s(10);
-            padding-left: lib.s(15); // For shadow
+            padding: lib.s(5); // For shadow
         }
 
         .inner {
-            @include lib.rounded(8, $tr: 0, $br: 0);
-            @include lib.shadow;
+            @include lib.rounded(8);
+            @include lib.shadow(black, 0.64, 0, 0, 3);
 
             &.low {
                 @include popup(scheme.$overlay0, 0.3);
diff --git a/scss/widgets.scss b/scss/widgets.scss
index 856960f..1bf2349 100644
--- a/scss/widgets.scss
+++ b/scss/widgets.scss
@@ -55,6 +55,7 @@ label.icon {
 
     .body {
         font-size: lib.s(14);
+        color: scheme.$subtext0;
     }
 
     .actions {
diff --git a/src/widgets/notification.tsx b/src/widgets/notification.tsx
index 3def064..99ab71c 100644
--- a/src/widgets/notification.tsx
+++ b/src/widgets/notification.tsx
@@ -84,17 +84,34 @@ export default class Notification extends Widget.Box {
                             {notification.image && <Image icon={notification.image} />}
                             <box vertical>
                                 <label className="summary" xalign={0} label={notification.summary} truncate />
-                                <label className="body" xalign={0} label={notification.body} wrap useMarkup />
+                                {notification.body && (
+                                    <label
+                                        className="body"
+                                        xalign={0}
+                                        label={popup ? notification.body.split("\n")[0] : notification.body}
+                                        wrap
+                                        useMarkup
+                                        lines={popup ? 1 : -1}
+                                        truncate={popup}
+                                    />
+                                )}
                             </box>
                         </box>
-                        <box className="actions">
-                            <button hexpand cursor="pointer" onClicked={() => notification.dismiss()} label="Close" />
-                            {notification.actions.map(a => (
-                                <button hexpand cursor="pointer" onClicked={() => notification.invoke(a.id)}>
-                                    {notification.actionIcons ? <icon icon={a.label} /> : a.label}
-                                </button>
-                            ))}
-                        </box>
+                        {!popup && (
+                            <box className="actions">
+                                <button
+                                    hexpand
+                                    cursor="pointer"
+                                    onClicked={() => notification.dismiss()}
+                                    label="Close"
+                                />
+                                {notification.actions.map(a => (
+                                    <button hexpand cursor="pointer" onClicked={() => notification.invoke(a.id)}>
+                                        {notification.actionIcons ? <icon icon={a.label} /> : a.label}
+                                    </button>
+                                ))}
+                            </box>
+                        )}
                     </box>
                 </box>
             </revealer>
-- 
cgit v1.2.3-freya