diff options
| -rw-r--r-- | scss/notifications.scss | 6 | ||||
| -rw-r--r-- | scss/widgets.scss | 10 | ||||
| -rw-r--r-- | src/modules/notifications.tsx | 16 |
3 files changed, 21 insertions, 11 deletions
diff --git a/scss/notifications.scss b/scss/notifications.scss index 51f1a0b..f9cb7ce 100644 --- a/scss/notifications.scss +++ b/scss/notifications.scss @@ -17,6 +17,7 @@ @include lib.rounded(8); @include lib.border(scheme.$mauve, 0.4, 2); @include lib.shadow; + @include font.mono; min-width: lib.s(400); min-height: lib.s(600); @@ -25,7 +26,6 @@ padding: lib.s(10) lib.s(12); .header { - @include font.mono; @include lib.spacing(8); padding: 0 lib.s(5); @@ -62,6 +62,10 @@ } } + .icon { + font-size: lib.s(32); + } + .notification { .wrapper { padding-bottom: lib.s(10); diff --git a/scss/widgets.scss b/scss/widgets.scss index e54a117..ca0958e 100644 --- a/scss/widgets.scss +++ b/scss/widgets.scss @@ -183,26 +183,22 @@ tooltip { } scrollbar { - trough { - background-color: transparent; - } - slider { @include lib.rounded(1000); @include lib.element-decel; min-width: lib.s(3); min-height: lib.s(30); - background-color: color.change(scheme.$overlay0, $alpha: 0.3); + background-color: color.change(scheme.$overlay0, $alpha: 0.6); &:hover, &:focus { min-width: lib.s(6); - background-color: color.change(scheme.$overlay0, $alpha: 0.4); + background-color: color.change(scheme.$overlay0, $alpha: 0.7); } &:active { - background-color: color.change(scheme.$overlay1, $alpha: 0.5); + background-color: color.change(scheme.$overlay1, $alpha: 0.8); } } } diff --git a/src/modules/notifications.tsx b/src/modules/notifications.tsx index ea98ada..8b50a12 100644 --- a/src/modules/notifications.tsx +++ b/src/modules/notifications.tsx @@ -65,9 +65,19 @@ export default () => ( label="Clear" /> </box> - <scrollable expand hscroll={Gtk.PolicyType.NEVER}> - <List /> - </scrollable> + <stack + transitionType={Gtk.StackTransitionType.CROSSFADE} + transitionDuration={150} + shown={bind(AstalNotifd.get_default(), "notifications").as(n => (n.length > 0 ? "list" : "empty"))} + > + <box vertical valign={Gtk.Align.CENTER} name="empty"> + <label className="icon" label="notifications_active" /> + <label label="All caught up!" /> + </box> + <scrollable expand hscroll={Gtk.PolicyType.NEVER} name="list"> + <List /> + </scrollable> + </stack> </box> </PopupWindow> ); |