GNOME 46 Fixes

Fixed #18 background in app icons
Fixed running dot
Fixed blue search border
Fixed background in search components
Fixed background in screenshot buttons
Fixed #18 buttons in calendar
Fixed missing styles for message header and expand button
This commit is contained in:
Vladyslav Hroshev
2024-03-25 13:23:03 +02:00
parent abced98cf2
commit 43a75dda32
7 changed files with 112 additions and 33 deletions

View File

@@ -4,11 +4,22 @@
.app-well-app .overview-icon, .app-well-app .overview-icon,
.app-well-app.app-folder .overview-icon, .app-well-app.app-folder .overview-icon,
.grid-search-result .overview-icon, .grid-search-result .overview-icon,
.app-folder.grid-search-result .overview-icon { .app-folder.grid-search-result .overview-icon,
#dash .dash-item-container .overview-tile .overview-icon,
#dash .dash-item-container .show-apps .overview-icon, /* 46+ */
.overview-tile { /* 46+ */
box-shadow: inset 0 0 0 0px rgba(255, 255, 255, 0); /* fix default dash focused box-shadow*/ box-shadow: inset 0 0 0 0px rgba(255, 255, 255, 0); /* fix default dash focused box-shadow*/
transition-duration: 100ms; transition-duration: 100ms;
border-radius: 20px; border-radius: 20px;
color: TEXT-PRIMARY-COLOR; color: TEXT-PRIMARY-COLOR;
background-color: transparent;
}
#dash .dash-item-container .overview-tile:hover,
#dash .dash-item-container .overview-tile:focus,
#dash .dash-item-container .overview-tile:selected {
background-color: transparent;
box-shadow: none;
} }
/* Show Apps icon */ /* Show Apps icon */
@@ -17,7 +28,8 @@
} }
/* folders */ /* folders */
.app-well-app.app-folder .overview-icon { .app-well-app.app-folder .overview-icon,
.app-folder /* 46+ */ {
background-color: ACCENT-DISABLED_HOVER; background-color: ACCENT-DISABLED_HOVER;
} }
@@ -26,18 +38,30 @@
.app-well-app:focus .overview-icon, .app-well-app:focus .overview-icon,
.app-well-app:selected .overview-icon, .app-well-app:selected .overview-icon,
.app-well-app.app-folder .overview-icon, .app-well-app.app-folder .overview-icon,
.app-folder, /* 46+ */
.show-apps:hover .overview-icon, .show-apps:hover .overview-icon,
.show-apps:focus .overview-icon { .show-apps:focus .overview-icon,
.overview-tile:hover,
.overview-tile:focus,
.overview-tile:selected {
box-shadow: inset 0 0 0 1px BORDER-SHADOW; box-shadow: inset 0 0 0 1px BORDER-SHADOW;
background-color: ACCENT-DISABLED-COLOR; background-color: ACCENT-DISABLED-COLOR;
} }
.overview-tile:focus {
box-shadow: inset 0 0 0 2px ACCENT-SECONDARY-COLOR !important;
}
/* app icons effects in dash */ /* app icons effects in dash */
#dash .app-well-app:hover .overview-icon, #dash .app-well-app:hover .overview-icon,
#dash .app-well-app:focus .overview-icon, #dash .app-well-app:focus .overview-icon,
#dash .app-well-app:selected .overview-icon, #dash .app-well-app:selected .overview-icon,
#dash .show-apps:hover .overview-icon, #dash .show-apps:hover .overview-icon,
#dash .show-apps:focus .overview-icon { #dash .show-apps:focus .overview-icon,
#dash .dash-item-container .overview-tile:hover .overview-icon, /* 46+ */
#dash .dash-item-container .overview-tile:focus .overview-icon, /* 46+ */
#dash .dash-item-container .overview-tile:selected .overview-icon, /* 46+ */
#dash .dash-item-container .show-apps:checked .overview-icon {
box-shadow: inset 0 0 4px 1px WELL-APP-SELECTED; box-shadow: inset 0 0 4px 1px WELL-APP-SELECTED;
background-color: rgba(255, 255, 255, 0.1); background-color: rgba(255, 255, 255, 0.1);
} }
@@ -46,8 +70,9 @@
.app-well-app:drop .overview-icon, .app-well-app:drop .overview-icon,
.grid-search-result:drop .overview-icon, .grid-search-result:drop .overview-icon,
.app-well-app.app-folder:drop .overview-icon, .app-well-app.app-folder:drop .overview-icon,
.app-folder.grid-search-result:drop .overview-icon { .app-folder.grid-search-result:drop .overview-icon,
border: 2px solid ACCENT-SECONDARY-COLOR; .overview-tile:drop { /* 46+ */
box-shadow: inset 0 0 0 2px ACCENT-SECONDARY-COLOR;
background-color: ACCENT-OPACITY-COLOR; background-color: ACCENT-OPACITY-COLOR;
} }
@@ -75,25 +100,28 @@
.app-folder-dialog .folder-name-container .folder-name-entry { .app-folder-dialog .folder-name-container .folder-name-entry {
font-weight: 700; font-weight: 700;
border: none; border: none;
box-shadow: inset 0 0 0 1px BORDER-MENU-SHADOW; box-shadow: inset 0 0 0 1px TEXT-DISABLED-COLOR !important;
background-color: ACCENT-DISABLED-COLOR; background-color: ACCENT-DISABLED-COLOR;
selection-background-color: ACCENT-COLOR; selection-background-color: ACCENT-COLOR;
selected-color: TEXT-PRIMARY-COLOR; selected-color: TEXT-PRIMARY-COLOR;
} }
/* edit folder name button */ /* edit folder name button */
.app-folder-dialog .folder-name-container .edit-folder-button { .app-folder-dialog .folder-name-container .edit-folder-button,
.app-folder-dialog .icon-button { /* 46+ */
border-radius: 12px; border-radius: 12px;
background-color: ACCENT-DISABLED-COLOR; background-color: ACCENT-DISABLED-COLOR;
color: TEXT-PRIMARY-COLOR; color: TEXT-PRIMARY-COLOR;
box-shadow: inset 0 0 0 1px BORDER-SHADOW; box-shadow: inset 0 0 0 1px BORDER-SHADOW;
} }
.app-folder-dialog .folder-name-container .edit-folder-button:hover { .app-folder-dialog .folder-name-container .edit-folder-button:hover,
.app-folder-dialog .icon-button:hover {
background-color: ACCENT-DISABLED_HOVER; background-color: ACCENT-DISABLED_HOVER;
} }
.app-folder-dialog .folder-name-container .edit-folder-button:focus { .app-folder-dialog .folder-name-container .edit-folder-button:focus,
.app-folder-dialog .icon-button:focus {
box-shadow: inset 0 0 0 2px ACCENT-SECONDARY-COLOR !important; box-shadow: inset 0 0 0 2px ACCENT-SECONDARY-COLOR !important;
} }
@@ -108,6 +136,7 @@
border-radius: 15px; border-radius: 15px;
padding: 12px; padding: 12px;
transition-duration: 100ms; transition-duration: 100ms;
background-color: transparent;
} }
.page-navigation-arrow > StIcon { .page-navigation-arrow > StIcon {
@@ -179,19 +208,25 @@
/* pill below if app is running */ /* pill below if app is running */
.app-well-app-running-dot { .app-well-app-running-dot,
.app-grid-running-dot { /* 46+ */
width: 10px; width: 10px;
height: 5px; height: 5px;
border-radius: 5px; border-radius: 5px;
background: ACCENT-SECONDARY-COLOR; background: ACCENT-SECONDARY-COLOR;
transition-duration: 100ms;
} }
#dash .app-well-app:hover .app-well-app-running-dot { #dash .app-grid-running-dot {
margin-bottom: 12px;
}
#dash .app-well-app:hover .app-well-app-running-dot,
#dash .overview-tile:hover .app-grid-running-dot { /* 46+ */
width: 15px; width: 15px;
} }
#dashtodockContainer .app-well-app.focused .app-well-app-running-dot { #dashtodockContainer .app-well-app.focused .app-well-app-running-dot,
#dashtodockContainer .overview-tile.focused .app-grid-running-dot { /* 46+ */
width: 20px; width: 20px;
} }

View File

@@ -58,25 +58,38 @@
} }
/* month header */ /* month header */
.calendar-month-label { .calendar-month-header .calendar-month-label {
color: TEXT-PRIMARY-COLOR; color: TEXT-PRIMARY-COLOR !important;
padding: 0;
background-color: transparent; /* 46+ */
}
.calendar-month-header .pager-button {
height: 2.2em;
width: 2.2em;
} }
/* day of week heading */ /* day of week heading */
.calendar-day.calendar-day-heading { .calendar-day.calendar-day-heading,
.calendar .calendar-day-heading /* 46+ */ {
color: TEXT-SECONDARY-COLOR; color: TEXT-SECONDARY-COLOR;
background-color: transparent;
} }
/* day buttons, prev/next month button */ /* day buttons, prev/next month button */
.calendar-day, .calendar-day,
.calendar-month-header .pager-button { .calendar-month-header .pager-button {
color: TEXT-PRIMARY-COLOR; color: TEXT-PRIMARY-COLOR;
background-color: transparent; /* 46+ */
border-radius: 10px; border-radius: 10px;
padding: 0;
transition-duration: 100ms; transition-duration: 100ms;
} }
.calendar-day:hover, .calendar-day:hover,
.calendar-day:selected:hover, .calendar-day:selected:hover,
.calendar .calendar-day-heading:hover, /* 46+ */
.calendar .calendar-day-heading:selected:hover, /* 46+ */
.calendar .calendar-month-header .pager-button:hover { .calendar .calendar-month-header .pager-button:hover {
background-color: ACCENT-DISABLED_HOVER; background-color: ACCENT-DISABLED_HOVER;
color: TEXT-PRIMARY-COLOR; color: TEXT-PRIMARY-COLOR;
@@ -84,12 +97,14 @@
} }
.calendar-day:focus, .calendar-day:focus,
.calendar .calendar-day-heading:focus, /* 46+ */
.calendar .calendar-month-header .pager-button:focus { .calendar .calendar-month-header .pager-button:focus {
background-color: ACCENT-OPACITY-COLOR; background-color: ACCENT-OPACITY-COLOR;
box-shadow: inset 0 0 0 2px ACCENT-SECONDARY-COLOR !important; box-shadow: inset 0 0 0 1.5px ACCENT-SECONDARY-COLOR !important;
} }
.calendar-day:selected { .calendar-day:selected,
.calendar .calendar-day-heading:selected /* 46+ */ {
background: ACCENT-DISABLED_HOVER; background: ACCENT-DISABLED_HOVER;
box-shadow: inset 0 0 0 1px BORDER-SHADOW; box-shadow: inset 0 0 0 1px BORDER-SHADOW;
} }
@@ -192,7 +207,9 @@
.events-button .event-time { .events-button .event-time {
color: TEXT-SECONDARY-COLOR; color: TEXT-SECONDARY-COLOR;
} }
.events-button .events-box .events-list .event-placeholder { /* if no events, 46+ */
color: TEXT-DISABLED-COLOR;
}
/* World clocks section */ /* World clocks section */
.world-clocks-button .world-clocks-time { .world-clocks-button .world-clocks-time {

View File

@@ -27,7 +27,7 @@ StEntry:focus,
StEntry:active { StEntry:active {
border: 1px solid TEXT-DISABLED-COLOR; border: 1px solid TEXT-DISABLED-COLOR;
background-color: ACCENT-DISABLED-COLOR; background-color: ACCENT-DISABLED-COLOR;
box-shadow: none; box-shadow: none !important;
} }
StEntry:focus { StEntry:focus {

View File

@@ -58,21 +58,33 @@
color: TEXT-SECONDARY-COLOR; color: TEXT-SECONDARY-COLOR;
} }
/* message title on 46+ */
.message .message-header .message-source-icon,
.message .message-header .message-header-content .message-source-title,
.message .message-header .message-header-content .event-time {
color: TEXT-SECONDARY-COLOR;
}
/* close button */
.message-close-button { /* close button, expand button (46+) */
border-radius: 9px; .message-close-button,
.message-expand-button {
border-radius: 99px;
padding: 5px;
margin: 0px;
color: TEXT-PRIMARY-COLOR; color: TEXT-PRIMARY-COLOR;
background-color: ACCENT-DISABLED-COLOR; background-color: ACCENT-DISABLED-COLOR;
box-shadow: inset 0 0 0 1px BORDER-SHADOW; box-shadow: inset 0 0 0 1px BORDER-SHADOW;
transition-duration: 100ms; transition-duration: 100ms;
} }
.message-close-button:hover { .message-close-button:hover,
.message-expand-button:hover {
background-color: ACCENT-DISABLED_HOVER; background-color: ACCENT-DISABLED_HOVER;
} }
.message-close-button:active { .message-close-button:active,
.message-expand-button:active {
color: TEXT-SECONDARY-COLOR; color: TEXT-SECONDARY-COLOR;
} }
@@ -80,8 +92,9 @@
/* Media Controls */ /* Media Controls */
.message-media-control { .message-media-control {
border-radius: 12px; border-radius: 12px;
padding: 0 14px; /* currently disabled because of 46 */
margin: 20px 2px; /* padding: 0 14px; */
/* margin: 20px 2px; */
color: TEXT-PRIMARY-COLOR; color: TEXT-PRIMARY-COLOR;
transition-duration: 100ms; transition-duration: 100ms;
} }
@@ -95,8 +108,9 @@
.message-media-control:insensitive { color: TEXT-DISABLED-COLOR; } .message-media-control:insensitive { color: TEXT-DISABLED-COLOR; }
/* fix margin for last button */ /* fix margin for last button */
.message-media-control:last-child:ltr { margin-right: 20px; } /* currently disabled because of 46 */
.message-media-control:last-child:rtl { margin-left: 12px; } /* .message-media-control:last-child:ltr { margin-right: 20px; }
.message-media-control:last-child:rtl { margin-left: 12px; } */
/* album art */ /* album art */

View File

@@ -30,6 +30,7 @@
.ripple-box { .ripple-box {
background-color: ACCENT-OPACITY-COLOR; background-color: ACCENT-OPACITY-COLOR;
box-shadow: 0 0 2px 2px ACCENT-OPACITY-COLOR; box-shadow: 0 0 2px 2px ACCENT-OPACITY-COLOR;
border-radius: 0 0 99px 0;
} }

View File

@@ -12,6 +12,7 @@
.screenshot-ui-show-pointer-button, /* show pointer */ .screenshot-ui-show-pointer-button, /* show pointer */
.screenshot-ui-type-button { /* Selection / Screen / Window */ .screenshot-ui-type-button { /* Selection / Screen / Window */
color: TEXT-PRIMARY-COLOR; color: TEXT-PRIMARY-COLOR;
background-color: transparent;
border-radius: 15px; border-radius: 15px;
transition-duration: 100ms; transition-duration: 100ms;
} }

View File

@@ -11,7 +11,7 @@
/* founded results content section */ /* founded results content section */
.search-section-content { .search-section-content {
box-shadow: inset 0 0 0 1px BORDER-SHADOW; box-shadow: inset 0 0 0 1px BORDER-SHADOW;
border-radius: 15px; border-radius: 18px;
border: none; border: none;
background-color: SECTION-COLOR; background-color: SECTION-COLOR;
color: TEXT-PRIMARY-COLOR; color: TEXT-PRIMARY-COLOR;
@@ -23,6 +23,12 @@
color: TEXT-PRIMARY-COLOR; color: TEXT-PRIMARY-COLOR;
} }
.list-search-result,
.search-provider-icon {
background-color: transparent;
border-radius: 12px;
}
/* search result listitem -> item title (with leading icon) */ /* search result listitem -> item title (with leading icon) */
.list-search-result .list-search-result-title { .list-search-result .list-search-result-title {
color: TEXT-PRIMARY-COLOR; color: TEXT-PRIMARY-COLOR;
@@ -32,8 +38,6 @@
color: TEXT-SECONDARY-COLOR; color: TEXT-SECONDARY-COLOR;
} }
.list-search-result:focus,
.search-provider-icon:focus,
.list-search-result:hover, .list-search-result:hover,
.search-provider-icon:hover, .search-provider-icon:hover,
.list-search-result:selected, .list-search-result:selected,
@@ -42,6 +46,13 @@
box-shadow: inset 0 0 0 1px BORDER-SHADOW; box-shadow: inset 0 0 0 1px BORDER-SHADOW;
} }
.list-search-result:focus,
.search-provider-icon:focus {
background-color: ACCENT-OPACITY-COLOR;
box-shadow: inset 0 0 0 1px ACCENT-SECONDARY-COLOR !important;
}
.list-search-result:active, .list-search-result:active,
.search-provider-icon:active { .search-provider-icon:active {
background-color: ACCENT-DISABLED_HOVER; background-color: ACCENT-DISABLED_HOVER;