This commit is contained in:
sankalp committed 2025-06-27 19:58:04 +05:45
1 parent d3a331a1b5
commit d9d9c0dd8e
12 files changed
+3232 -767

No files matched your search

+110 -60
View File
@@ -1,29 +1,23 @@
#notification-action-buttons button.start-action {
border-radius: 20px;
}
#notification-action-buttons button {
#action-button {
border-radius: 16px;
background-color: var(--surface);
padding: 8px;
border-radius: 20px;
transition: background-color 0.1s ease;
}
#notification-action-buttons button:hover {
#action-button:hover {
background-color: var(--surface-bright);
}
#notification-action-buttons button:active {
#action-button:active {
background-color: var(--primary);
}
#notification-action-buttons button:active #button-label {
#action-button:active #button-label {
color: var(--shadow);
}
#notification-image image {
border-radius: 16px;
color: var(--on-surface);
}
#notification-summary,
@@ -44,23 +38,24 @@
margin-top: 8px;
}
#notification-box {
border-radius: 20px;
#notification-stack-box {
border-radius: 32px;
padding: 16px;
border: 2px solid var(--surface);
background-color: var(--shadow);
margin: 4px;
min-width: 336px;
transition: background-color 0.1s ease;
margin: 8px;
margin-bottom: 4px;
min-width: 330px;
}
#boxed-notification-revealer {
margin-top: -14px;
#notification-navigation {
padding: 16px;
}
#notif-close-button {
background-color: var(--surface);
border-radius: 16px;
padding: 4px;
transition: background-color 0.1s ease;
padding: 8px;
}
#notif-close-button:hover,
@@ -74,64 +69,119 @@
#notif-close-label {
color: var(--red-dim);
font-size: 20px;
font-size: 16px;
}
#notif-close-button:active #notif-close-label {
color: var(--shadow);
}
#notif-close-progress {
color: var(--surface-bright);
border-color: var(--red-dim);
background-color: transparent;
transition: border-color 0.2s ease;
}
#notif-close-button:hover #notif-close-progress {
border-color: var(--red);
color: var(--red);
}
#notif-close-button:active #notif-close-progress {
border-color: var(--shadow);
color: var(--shadow);
}
/* Chevron button styling */
#notif-chevron-button {
border-radius: 16px;
#nav-button {
padding: 8px;
transition: background-color 0.1s ease;
border-radius: 16px;
background: var(--shadow);
border: 2px solid var(--surface);
margin-top: -12px;
}
#notif-chevron-button:hover,
#notif-chevron-button:focus {
#nav-button:hover {
background: var(--surface-bright);
}
#nav-button:disabled #nav-button-label {
color: var(--surface-bright);
}
#nav-button-label {
font-size: 16px;
}
#nav-button-label.close {
color: var(--red-dim);
}
#nav-button:hover #nav-button-label {
color: var(--primary);
}
#nav-button:hover #nav-button-label.close {
color: var(--red-dim);
}
#notification-history scrollbar {
background: transparent;
}
#notification-history scrollbar.vertical slider {
background: var(--primary);
border-radius: 8px;
min-width: 16px;
min-height: 48px;
margin: 4px;
}
#notification-history scrollbar.vertical trough {
background: var(--surface);
border: none;
border-radius: 12px;
margin: 4px;
}
#notification-box-hist {
padding: 8px;
border-radius: 12px;
border: 2px solid var(--surface);
}
#notification-timestamp {
color: var(--surface-bright);
}
#notification-history-header {
border-radius: 12px;
border: 2px solid var(--surface);
padding: 4px;
margin-bottom: 4px;
}
#nhh {
font-weight: bold;
}
#nhh-button {
border-radius: 8px;
background-color: var(--surface);
padding: 4px;
}
#nhh-button:hover {
background-color: var(--surface-bright);
}
#notif-chevron-button:active {
background-color: var(--primary);
}
#notif-chevron-label {
color: var(--primary);
#nhh-button-label {
color: var(--red-dim);
font-size: 20px;
}
#notif-chevron-button:active #notif-chevron-label {
color: var(--shadow);
#dnd-label {
font-size: 20px;
margin-left: 4px;
}
/* Expanded content styling */
#notification-expanded-content {
padding-top: 8px;
margin-top: 4px;
#notif-sep {
padding: 2px;
border-radius: 16px;
background-color: var(--surface-bright);
margin: 0 8px;
}
/* Action buttons in expanded content */
#notification-expanded-content #notification-action-buttons {
margin-top: 30px;
#notif-date-sep {
padding: 4px;
border-radius: 12px;
background-color: var(--surface);
}
#notif-date-sep-label {
color: var(--outline);
font-weight: bold;
}