nosignal/nosignal-shell
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

notifpopups: more compact + better styles

Browse source
This commit is contained in:
2 * r + 2 * t 2025-02-19 00:03:47 +11:00
parent 3ddc75029c
commit cc589cec95
3 changed files with 32 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
scss/notifpopups.scss
View file

@ -4,10 +4,6 @@
@use "font"; @use "font";
@mixin popup($colour, $alpha) { @mixin popup($colour, $alpha) {
@include lib.border($colour, $alpha);
border-right: none;
.separator { .separator {
background-color: $colour; background-color: $colour;
} }
@ -20,21 +16,17 @@
.notifpopups { .notifpopups {
min-width: lib.s(425); min-width: lib.s(425);
padding-left: lib.s(10); // So notifications can overshoot for init animation padding-left: lib.s(10); // So notifications can overshoot for init animation
padding-right: lib.s(10);
// For shadow padding-top: lib.s(5);
& > :last-child .wrapper {
padding-bottom: lib.s(15);
}
.notification { .notification {
.wrapper { .wrapper {
padding-top: lib.s(10); padding: lib.s(5); // For shadow
padding-left: lib.s(15); // For shadow
} }
.inner { .inner {
@include lib.rounded(8, $tr: 0, $br: 0); @include lib.rounded(8);
@include lib.shadow; @include lib.shadow(black, 0.64, 0, 0, 3);
&.low { &.low {
@include popup(scheme.$overlay0, 0.3); @include popup(scheme.$overlay0, 0.3);

1
scss/widgets.scss
View file

@ -55,6 +55,7 @@ label.icon {
.body { .body {
font-size: lib.s(14); font-size: lib.s(14);
color: scheme.$subtext0;
} }
.actions { .actions {

35
src/widgets/notification.tsx
View file

@ -84,17 +84,34 @@ export default class Notification extends Widget.Box {
{notification.image && <Image icon={notification.image} />} {notification.image && <Image icon={notification.image} />}
<box vertical> <box vertical>
<label className="summary" xalign={0} label={notification.summary} truncate /> <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> </box>
<box className="actions"> {!popup && (
<button hexpand cursor="pointer" onClicked={() => notification.dismiss()} label="Close" /> <box className="actions">
{notification.actions.map(a => ( <button
<button hexpand cursor="pointer" onClicked={() => notification.invoke(a.id)}> hexpand
{notification.actionIcons ? <icon icon={a.label} /> : a.label} cursor="pointer"
</button> onClicked={() => notification.dismiss()}
))} label="Close"
</box> />
{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>
</box> </box>
</revealer> </revealer>