From 08ac0aa8d34ef2ffa9b16ef671a990fad6e01524 Mon Sep 17 00:00:00 2001 From: Vladyslav Hroshev Date: Fri, 4 Jul 2025 20:51:57 +0300 Subject: [PATCH] Fixed notifications, updated borders and paddings - Fixed notifications in GNOME 47 (likely Ubuntu) and older (Fixes #64); - Fixed big margins between messages for GNOME 47 and older; - Fixed margins in modal for GNOME 46 and oler; - Adapted paddings and borders in quick settings and in screenshot panel; - Changed styles in tooltips and popup messages; --- theme/gnome-shell/.css/apps.css | 3 ++ theme/gnome-shell/.css/messages.css | 20 +--------- theme/gnome-shell/.css/osd.css | 2 +- theme/gnome-shell/.css/overview.css | 2 +- theme/gnome-shell/.css/quick-settings.css | 32 +++++++++------ theme/gnome-shell/.css/screenshot.css | 17 +++++--- .../.versions/..46/.css/buttons.css | 39 +++++++++++-------- .../.versions/..47/.css/messages.css | 4 ++ .../.versions/48../.css/messages.css | 16 ++++++++ 9 files changed, 80 insertions(+), 55 deletions(-) create mode 100644 theme/gnome-shell/.versions/..47/.css/messages.css create mode 100644 theme/gnome-shell/.versions/48../.css/messages.css diff --git a/theme/gnome-shell/.css/apps.css b/theme/gnome-shell/.css/apps.css index 0cabd96..dc3f8f7 100644 --- a/theme/gnome-shell/.css/apps.css +++ b/theme/gnome-shell/.css/apps.css @@ -169,12 +169,14 @@ .page-navigation-hint.previous:rtl { background-gradient-start: PAGE-NAV-HINT; box-shadow: inset 0 0 0 1px BORDER-SHADOW; + border-radius: 20px 0 0 20px; } .page-navigation-hint.previous:ltr, .page-navigation-hint.next:rtl { background-gradient-end: PAGE-NAV-HINT; box-shadow: inset 0 0 0 1px BORDER-SHADOW; + border-radius: 0 20px 20px 0; } @@ -206,6 +208,7 @@ background-color: SECTION-OPAQUE-COLOR; color: TEXT-PRIMARY-COLOR; border-radius: 12px; + padding: 6px 12px; border: 1px solid BORDER-MENU-SHADOW; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08); } diff --git a/theme/gnome-shell/.css/messages.css b/theme/gnome-shell/.css/messages.css index 6f89f53..da15d77 100644 --- a/theme/gnome-shell/.css/messages.css +++ b/theme/gnome-shell/.css/messages.css @@ -32,7 +32,7 @@ /* popup messages */ .message { color: TEXT-PRIMARY-COLOR; - border-radius: 18px; + border-radius: 16px; } /* Message OSD */ @@ -49,9 +49,7 @@ .message-view .message { /* 48+ */ background-color: SECTION-COLOR; box-shadow: inset 0 0 0 1px BORDER-SHADOW; - border: 0; margin: 0; /* fix margins for GNOME older than 46 */ - margin-bottom: 9px !important; border-radius: 13px; transition-duration: 100ms; } @@ -63,22 +61,6 @@ box-shadow: inset 0 0 0 2px ACCENT-SECONDARY-COLOR !important; } -.message-view .message { - background-color: SECTION-OPAQUE-COLOR; -} - -.message:second-in-stack { - background-color: SECTION-OPAQUE_SECOND; -} - -.message:lower-in-stack { - background-color: SECTION-OPAQUE_THIRD; -} - -.message-view .message:hover { - background-color: SECTION-OPAQUE_HOVER; -} - /* text / header in message */ .message .message-body, .message-title { diff --git a/theme/gnome-shell/.css/osd.css b/theme/gnome-shell/.css/osd.css index 24cad9f..b8bab2b 100644 --- a/theme/gnome-shell/.css/osd.css +++ b/theme/gnome-shell/.css/osd.css @@ -7,7 +7,7 @@ color: TEXT-PRIMARY-COLOR; background-color: BACKGROUND-COLOR; border: 1px solid BORDER-MENU-SHADOW; - border-radius: 20px; + border-radius: 18px; box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.07); } diff --git a/theme/gnome-shell/.css/overview.css b/theme/gnome-shell/.css/overview.css index 31fdf8c..dec85a3 100644 --- a/theme/gnome-shell/.css/overview.css +++ b/theme/gnome-shell/.css/overview.css @@ -21,7 +21,7 @@ color: TEXT-PRIMARY-COLOR; background-color: SECTION-OPAQUE-COLOR; border: 1px solid BORDER-SHADOW; - padding: 4px 8px; + padding: 6px 12px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08); } diff --git a/theme/gnome-shell/.css/quick-settings.css b/theme/gnome-shell/.css/quick-settings.css index 1cf8492..a8ef17e 100644 --- a/theme/gnome-shell/.css/quick-settings.css +++ b/theme/gnome-shell/.css/quick-settings.css @@ -2,8 +2,13 @@ /* QS section */ .quick-settings { - padding: 15px; - border-radius: 24px; + padding: 12px !important; + border-radius: 24px !important; +} + +.quick-settings-grid { + spacing-rows: 12px; + spacing-columns: 12px; } @@ -32,7 +37,7 @@ .quick-menu-toggle .quick-toggle, /* 44-47 */ .quick-toggle-has-menu .quick-toggle { /* 48+ */ color: TEXT-PRIMARY-COLOR; - border-radius: 15px; + border-radius: 14px; background-color: ACCENT-DISABLED-COLOR; transition-duration: 100ms; } @@ -46,14 +51,14 @@ /* adjust borders if quick toggle has expandable menu button (quick-toggle-arrow)44-47] (quick-toggle-menu-button)[48+] */ .quick-menu-toggle .quick-toggle:ltr, -.quick-toggle-has-menu .quick-toggle:ltr { border-radius: 15px 0 0 15px; } +.quick-toggle-has-menu .quick-toggle:ltr { border-radius: 14px 0 0 14px; } .quick-menu-toggle .quick-toggle:rtl, -.quick-toggle-has-menu .quick-toggle:rtl { border-radius: 0 15px 15px 0; } +.quick-toggle-has-menu .quick-toggle:rtl { border-radius: 0 14px 14px 0; } /* if quick toggle has no expandable menu button (quick-toggle-arrow)[44+] */ .quick-menu-toggle .quick-toggle:last-child, .quick-toggle-has-menu .quick-toggle:last-child { - border-radius: 15px; + border-radius: 14px; } .quick-menu-toggle .quick-toggle-arrow, @@ -64,13 +69,13 @@ /* adjust borders in expandable menu button */ .quick-menu-toggle .quick-toggle-arrow:ltr, .quick-toggle-has-menu .quick-toggle-menu-button:ltr { - border-radius: 0 15px 15px 0; + border-radius: 0 14px 14px 0; border-left-width: 2px; } .quick-menu-toggle .quick-toggle-arrow:rtl, .quick-toggle-has-menu .quick-toggle-menu-button:rtl { - border-radius: 15px 0 0 15px; + border-radius: 14px 0 0 14px; border-right-width: 2px; } @@ -142,16 +147,17 @@ https://gitlab.gnome.org/GNOME/gnome-shell/-/commit/beb77f58243265a6cc62b720a5b0 .quick-toggle-menu { background-color: BACKGROUND-COLOR !important; color: TEXT-PRIMARY-COLOR !important; - border-radius: 18px; + border-radius: 16px; + padding: 10px; box-shadow: inset 0 0 0 1px BORDER-SHADOW; - margin: 12px auto; + margin: 12px 12px 0; } /* header icon in expanded menu */ .quick-toggle-menu .header .icon { background-color: ACCENT-DISABLED_HOVER; color: TEXT-PRIMARY-COLOR; - border-radius: 12px; + border-radius: 10px; icon-size: 1.4em; box-shadow: inset 0 0 0 1px BORDER-SHADOW; } @@ -164,6 +170,10 @@ https://gitlab.gnome.org/GNOME/gnome-shell/-/commit/beb77f58243265a6cc62b720a5b0 background-gradient-end: BUTTON-COLOR; } +.quick-toggle-menu .popup-menu-item { + border-radius: 10px; +} + /* connect / disconnect text color (expanded menu) */ .device-subtitle { color: TEXT-SECONDARY-COLOR; diff --git a/theme/gnome-shell/.css/screenshot.css b/theme/gnome-shell/.css/screenshot.css index 614e263..6f5aa9c 100644 --- a/theme/gnome-shell/.css/screenshot.css +++ b/theme/gnome-shell/.css/screenshot.css @@ -5,7 +5,9 @@ color: TEXT-PRIMARY-COLOR; background-color: BACKGROUND-COLOR; border: 1px solid BORDER-MENU-SHADOW; - border-radius: 22px; + border-radius: 24px; + padding: 12px; + padding-bottom: 8px; /* centers bottom buttons because of capture button */ box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.07); } @@ -13,10 +15,14 @@ .screenshot-ui-type-button { /* Selection / Screen / Window */ color: TEXT-PRIMARY-COLOR; background-color: transparent; - border-radius: 15px; + border-radius: 14px; transition-duration: 100ms; } +.screenshot-ui-show-pointer-button { + border-radius: 12px; +} + .screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover, .screenshot-ui-show-pointer-button:focus, @@ -83,13 +89,12 @@ background-gradient-end: BUTTON-COLOR; } - /* circle around capture button */ .screenshot-ui-capture-button { - width: 36px; - height: 36px; + width: 32px; + height: 32px; border-radius: 99px; - border: 4px ACCENT-SECONDARY-COLOR; + border: 3px ACCENT-SECONDARY-COLOR; padding: 4px; } diff --git a/theme/gnome-shell/.versions/..46/.css/buttons.css b/theme/gnome-shell/.versions/..46/.css/buttons.css index 0cedcc2..40a24f5 100644 --- a/theme/gnome-shell/.versions/..46/.css/buttons.css +++ b/theme/gnome-shell/.versions/..46/.css/buttons.css @@ -1,33 +1,38 @@ -/* if first button: margin-right: 8px/2 */ +/* gaps between buttons in modal/messages + +/* if first button */ .modal-dialog-linked-button:ltr:first-child, +.modal-dialog-linked-button:rtl:last-child { + margin: 0 6px 0 0 !important; +} .notification-button:ltr:first-child, -.hotplug-notification-item:ltr:first-child, -.modal-dialog-linked-button:rtl:last-child, -.notification-button:rtl:last-child, -.hotplug-notification-item:rtl:last-child { +.notification-button:rtl:last-child { margin: 0 4px 8px 8px !important; } -/* if last button: margin-left: 8px/2 */ +/* if last button */ .modal-dialog-linked-button:ltr:last-child, +.modal-dialog-linked-button:rtl:first-child { + margin: 0 0 0 6px !important; +} .notification-button:ltr:last-child, -.hotplug-notification-item:ltr:last-child, -.modal-dialog-linked-button:rtl:first-child, -.notification-button:rtl:first-child, -.hotplug-notification-item:rtl:first-child { +.notification-button:rtl:first-child { margin: 0 8px 8px 4px !important; } /* if only button: normal margin */ -.modal-dialog-linked-button:first-child:last-child, -.notification-button:first-child:last-child, -.hotplug-notification-item:first-child:last-child { +.modal-dialog-linked-button:first-child:last-child { + margin: 0 !important; +} +.notification-button:first-child:last-child { margin: 0 8px 8px 8px !important; } -/* else: margin-right/left: 8px/2 */ -.modal-dialog-linked-button, -.notification-button, -.hotplug-notification-item { +/* else */ +.modal-dialog-linked-button { + margin: 0 6px 0 6px !important; +} + +.notification-button { margin: 0 4px 8px 4px !important; } \ No newline at end of file diff --git a/theme/gnome-shell/.versions/..47/.css/messages.css b/theme/gnome-shell/.versions/..47/.css/messages.css new file mode 100644 index 0000000..96e7ede --- /dev/null +++ b/theme/gnome-shell/.versions/..47/.css/messages.css @@ -0,0 +1,4 @@ +.message-list-section, +.message-list-section-list { + spacing: 8px; +} diff --git a/theme/gnome-shell/.versions/48../.css/messages.css b/theme/gnome-shell/.versions/48../.css/messages.css new file mode 100644 index 0000000..91cd779 --- /dev/null +++ b/theme/gnome-shell/.versions/48../.css/messages.css @@ -0,0 +1,16 @@ +.message-view .message { + background-color: SECTION-OPAQUE-COLOR; + margin-bottom: 8px !important; +} + +.message:second-in-stack { + background-color: SECTION-OPAQUE_SECOND; +} + +.message:lower-in-stack { + background-color: SECTION-OPAQUE_THIRD; +} + +.message-view .message:hover { + background-color: SECTION-OPAQUE_HOVER; +} \ No newline at end of file