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";
@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);

1
scss/widgets.scss
View file

@ -55,6 +55,7 @@ label.icon {
.body {
font-size: lib.s(14);
color: scheme.$subtext0;
}
.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} />}
<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>