Add timestamp to notifications and add styling to menu button

This commit is contained in:
Jas Singh
2024-07-02 23:58:49 -07:00
parent 5846470441
commit 2a0be05a2b
10 changed files with 159 additions and 132 deletions

View File

@@ -2,6 +2,5 @@
.bar-menu_label {
color: $teal;
margin-right: 1.5rem;
font-size: 2rem;
font-size: 1.3em;
}

View File

@@ -15,8 +15,8 @@
.media-indicator-current-album-cover {
border-radius: 0.25em;
min-width: 8.5em;
min-height: 8.5em;
min-width: 9.5em;
min-height: 9.5em;
background-size: contain;
background-repeat: no-repeat;
background-position: center;

View File

@@ -7,70 +7,70 @@
background: $crust;
border: 0.13em solid $surface0;
border-radius: 0.7em;
}
margin-right: 0.45em;
.window-content.notificationsmenu-window {
margin-right: 0.50em;
}
.window-content.notificationsmenu-window {
margin-right: 0.50em;
}
.menu-content-container.notifications {
margin: 1.35em;
margin-bottom: 0em;
min-height: 4em;
}
.menu-content-container.notifications {
margin: 1.35em;
margin-bottom: 0em;
min-height: 4em;
}
.notification-menu-controls {
background: $base;
margin: 1em 1.3em;
margin-bottom: 0.5em;
border-radius: 0.4em;
padding: 0.4em 0.75em;
}
.notification-menu-controls {
background: $base;
margin: 1em 1.3em;
margin-bottom: 0.5em;
border-radius: 0.4em;
padding: 0.4em 0.75em;
}
.notification-card.menu {
background: $base;
border: 0.15em solid $base;
border-radius: 0em;
border-bottom-left-radius: 0.4em;
border-top-left-radius: 0.4em;
margin: 0em;
}
.notification-card.menu {
background: $base;
border: 0.15em solid $base;
border-radius: 0em;
border-bottom-left-radius: 0.4em;
border-top-left-radius: 0.4em;
margin: 0em;
}
.notification-card-content-container {
.notification-card-content-container {
margin-bottom: 1em;
}
}
.notification-card-content {
margin-bottom: 0.25em;
}
.menu-label-container.notifications {
margin: 0em;
padding: 0em;
}
.menu-label.notifications {
margin: 0em;
color: $lavender;
}
.menu-label.notifications {
margin: 0em;
color: $lavender;
}
.menu-separator.notification-controls {
min-width: 0.1em;
background-color: $surface0;
margin: 0em 1em;
}
.menu-separator.notification-controls {
min-width: 0.1em;
background-color: $surface0;
margin: 0em 1em;
}
.menu-switch.notifications:checked {
&:checked {
background: $lavender;
}
}
.menu-switch.notifications:checked {
&:checked {
background: $lavender;
.clear-notifications-button {
margin-right: 0.3em;
&:hover label {
color: $maroon;
}
}
.clear-notifications-label {
color: $red;
font-size: 1.5em;
}
}
.clear-notifications-button {
margin-right: 0.3em;
&:hover label {
color: $maroon;
}
}
.clear-notifications-label {
color: $red;
font-size: 1.5em;
}

View File

@@ -7,10 +7,10 @@
color: $text;
background: $mantle;
margin-right: 0.45em;
border: 0.15em solid $surface0;
min-width: 23.5em;
border: 0.15em solid transparentize($surface0, 0.5);
min-width: 26em;
min-height: 6rem;
border-radius: 0.3em;
border-radius: 0.6em;
&:not(:first-child) {
margin-top: 0.85em;
@@ -28,8 +28,8 @@
}
.notification-card-image {
border-radius: 0.4em;
min-width: 2.5em;
min-height: 2.5em;
min-width: 1.5em;
min-height: 1.5em;
padding: 0.85em 0.85em;
background-size: contain;
background-repeat: no-repeat;
@@ -40,11 +40,12 @@
min-width: 2.9em;
min-height: 2.9em;
padding: 0.5em 0.5em;
margin-right: 1rem;
margin-right: 0.5rem;
margin-bottom: 0.5rem;
}
.notification-card-content.noimg {
margin-left: 1.3em;
margin-left: 0.5em;
margin-top: .15em;
}
@@ -56,11 +57,12 @@
.notification-card-body-label {
font-size: 0.84em;
margin-bottom: 1em;
font-weight: 600;
}
.notification-card-actions {
margin-top: 0.95em;
margin-top: 0.25em;
margin-bottom: 0.4em;
}
@@ -85,6 +87,11 @@
font-size: 1.3em;
}
.notification-time {
font-size: 0.85em;
color: $overlay1;
}
.close-notification-button {
background: $red;
color: $crust;
@@ -99,7 +106,3 @@
background: $maroon;
}
}
.spacer {
margin-bottom: 0.75em;
}