starred/Nordic
1
0
Fork 0
mirror of https://github.com/EliverLara/Nordic.git synced 2026-09-28 01:46:08 -04:00
Code Issues Packages Projects Releases Wiki Activity

Gnome: Improve app notifications(toast) appearance

Browse Source
This commit is contained in:
EliverLara
2024-11-06 14:58:29 -06:00
parent 219934452c
commit 519c69f6da
3 changed files with 57 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
gtk-4.0/gtk-dark.css
+18
View File
@@ -186,6 +186,24 @@ read if you used those and something break with a version upgrade you're on your
.app-notification.frame border {
border: none; }
toast {
padding: 5px;
background-color: #3d4555;
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.4);
color: #d8dee9; }
toast:backdrop {
background-image: none;
transition: 200ms ease-out; }
toast button {
padding: 2px; }
toast button.circular.flat.image-button {
padding: 2px; }
toast button.circular.flat.image-button:hover {
color: #d8dee9;
outline-color: rgba(216, 222, 233, 0.3);
background-color: #bf616a;
text-shadow: none; }
/***************
* Base States *
***************/
gtk-4.0/gtk.css
+18
View File
@@ -186,6 +186,24 @@ read if you used those and something break with a version upgrade you're on your
.app-notification.frame border {
border: none; }
toast {
padding: 5px;
background-color: #3d4555;
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.4);
color: #d8dee9; }
toast:backdrop {
background-image: none;
transition: 200ms ease-out; }
toast button {
padding: 2px; }
toast button.circular.flat.image-button {
padding: 2px; }
toast button.circular.flat.image-button:hover {
color: #d8dee9;
outline-color: rgba(216, 222, 233, 0.3);
background-color: #bf616a;
text-shadow: none; }
/***************
* Base States *
***************/
gtk-4.0/widgets/_app-notifications.scss
+21
View File
@@ -21,3 +21,24 @@
border { border: none; }
}
toast {
padding: 5px;
background-color: lighten($base_color, 7%);
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.4);
color: $fg_color;
&:backdrop {
background-image: none;
transition: $backdrop_transition;
}
button { padding: 2px; }
//close button
button.circular.flat.image-button {
padding: 2px;
&:hover { @include button(hover, $red, $selected_fg_color); }
}
}