diff --git a/src/styles/notification/center_stack.css b/src/styles/notification/center_stack.css index bd9658e..6ecb439 100644 --- a/src/styles/notification/center_stack.css +++ b/src/styles/notification/center_stack.css @@ -11,33 +11,31 @@ /* Bottom shadow layer (deepest) - offset to show stacking from below */ #stack-shadow-bottom { - background-color: @glass-surface-1; - border-top: 1px solid @glass-divider; + background-color: @glass-popup; + border: 1.2px solid @glass-border; border-radius: apply(radius-md); - opacity: 1; - min-height: 16px; - margin-left: 20px; - margin-right: -4px; + opacity: 0.9; + min-height: 20px; + margin-left: 16px; + margin-right: 16px; margin-bottom: -10px; } /* Middle shadow layer */ #stack-shadow-middle { - background-color: @glass-surface-2; - - border-top: 1px solid @glass-divider; + background-color: @glass-popup; + border: 1.2px solid @glass-border; border-radius: apply(radius-md); - opacity: 1; + opacity: 0.95; min-height: 20px; - margin-left: 10px; - margin-right: -2px; - margin-bottom: -14px; + margin-left: 8px; + margin-right: 8px; + margin-bottom: -10px; } /* Main notification content (top layer) */ #stack-main-notification { background-color: @glass-popup; - border: 1.2px solid @glass-border; border-radius: apply(radius-md); padding: 12px; diff --git a/src/styles/notification/notification_buttons.css b/src/styles/notification/notification_buttons.css index 7810bca..13bc476 100644 --- a/src/styles/notification/notification_buttons.css +++ b/src/styles/notification/notification_buttons.css @@ -40,3 +40,75 @@ #notification-action-buttons button:active #button-label { color: var(--shadow); } + +.mac-options-button { + background-color: @glass-panel; + border-radius: apply(radius-md); + padding: 4px 8px; + margin-top: 4px; + margin-right: 8px; + margin-bottom: 8px; + color: @text-secondary; + font-weight: 500; + transition: background-color apply(transition-fast), color apply(transition-fast); +} + +.mac-options-button:hover { + background-color: @glass-surface-4; + color: @text-primary; +} + +.mac-options-button:active { + background-color: @glass-surface-5; +} + +menu.mac-context-menu { + background-color: @glass-panel; + border-radius: apply(radius-md); + padding: 4px; + border: 1px solid @glass-surface-2; +} + +.mac-context-menu menuitem { + padding: 4px 12px; + border-radius: apply(radius-sm); + color: @text-primary; + transition: background-color apply(transition-fast); +} + +.mac-context-menu menuitem:hover { + background-color: var(--primary); + color: var(--shadow); +} + +.mac-header-pill { + background-color: @glass-surface-4; + border-radius: apply(radius-md); + padding: 2px 8px; + color: @text-secondary; + font-size: 12px; + font-weight: 500; + margin-right: 4px; + transition: background-color apply(transition-fast), color apply(transition-fast); +} + +.mac-header-pill:hover { + background-color: @glass-surface-5; + color: @text-primary; +} + +.mac-header-circle { + background-color: @glass-surface-4; + border-radius: 999px; + padding: 3px; + margin: 0; + min-width: 18px; + min-height: 18px; + color: @text-secondary; + transition: background-color apply(transition-fast); +} + +.mac-header-circle:hover { + background-color: @glass-surface-5; + color: @text-primary; +}