luneko/SweetTokyoNight
1
0
Fork 0
mirror of https://github.com/luneko/SweetTokyoNight.git synced 2025-12-13 15:29:53 +01:00
Code Issues Projects Releases Wiki Activity

Gnome-shell: Add syles for pop-os/cosmic

Browse Source
This commit is contained in:
EliverLara
2021-07-12 13:56:57 -05:00
parent 5d4d6cf850
commit f6757e73a2
4 changed files with 135 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
gnome-shell/_common.scss
View File

@@ -1379,6 +1379,10 @@ StScrollBar {
spacing: 24px; //
}
#overview.cosmic-solid-bg {
background-color: $base_color !important;
}
.overview-controls {
padding-bottom: 32px;
}

31
gnome-shell/_cosmic.scss Normal file
View File

@@ -0,0 +1,31 @@
/* Pop_OS COSMIC Dock styling, append !important to any changed rules */
.cosmic-dock #dock {
border-radius: 12px 12px 12px 12px !important;
border: 0 !important;
background-color: darken($bg_color, 3%);
margin: 4px !important;
}
.cosmic-dock.extended #dock {
border-radius: 0px !important;
margin: 0 !important; }
.cosmic-dock.extended.side #dock {
border-top-width: 0 !important;
border-bottom-width: 0 !important; }
.cosmic-dock.extended.side.left #dock {
border-left-width: 0 !important; }
.cosmic-dock.extended.side.right #dock {
border-right-width: 0 !important; }
.cosmic-dock.extended.bottom #dock {
border-bottom-width: 0 !important;
border-left-width: 0 !important;
border-right-width: 0 !important; }
.cosmic-dock .app-well-app:hover .overview-icon, .cosmic-dock .app-well-app:focus .overview-icon, .cosmic-dock .app-well-app:selected .overview-icon {
border-radius: 11px; }

152
gnome-shell/gnome-shell.css
View File

@@ -8,7 +8,7 @@ stage {
/* WIDGETS */
/* Buttons */
.button, .app-folder-dialog .edit-folder-button {
.button {
color: #929ba8;
background-color: #040405;
box-shadow: none;
@@ -19,26 +19,26 @@ stage {
border-radius: 4px;
border-width: 0;
padding: 4px 32px; }
.button:focus, .app-folder-dialog .edit-folder-button:focus {
.button:focus {
color: #0072ff;
text-shadow: 0 1px black;
icon-shadow: 0 1px black;
box-shadow: none;
border: 1px solid #161819; }
.button:insensitive, .app-folder-dialog .edit-folder-button:insensitive {
.button:insensitive {
color: #51565d;
background-color: rgba(30, 31, 35, 0.66);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
border: none;
text-shadow: none;
icon-shadow: none; }
.button:active, .app-folder-dialog .edit-folder-button:active {
.button:active {
color: #0072ff;
background-color: rgba(16, 16, 19, 0.95);
border: 1px solid #161819;
text-shadow: none;
icon-shadow: none; }
.button:hover, .app-folder-dialog .edit-folder-button:hover {
.button:hover {
color: #0072ff;
background-color: #09090b;
border: 1px solid #161819;
@@ -663,10 +663,7 @@ StScrollBar {
padding: 0px;
spacing: 8px; }
.ws-switcher-active-up,
.ws-switcher-active-down,
.ws-switcher-active-left,
.ws-switcher-active-right {
.ws-switcher-active-up, .ws-switcher-active-down {
height: 50px;
background-color: #0072ff;
color: #f7f7f7;
@@ -716,7 +713,7 @@ StScrollBar {
/* transition from solid to transparent */
transition-duration: 500ms;
font-weight: bold;
height: 2.1em;
height: 1.86em;
padding: 0px 0px; }
#panel.unlock-screen, #panel.login-screen, #panel.lock-screen {
background-color: transparent; }
@@ -744,6 +741,10 @@ StScrollBar {
-st-icon-style: symbolic;
margin-left: 4px;
margin-right: 4px; }
#panel .panel-button .system-status-icon,
#panel .panel-button .app-menu-icon > StIcon,
#panel .panel-button .popup-menu-arrow {
icon-shadow: 0px 0px 2px rgba(0, 0, 0, 0.9); }
#panel .panel-button:hover {
background: rgba(39, 39, 47, 0.95);
color: white;
@@ -756,6 +757,16 @@ StScrollBar {
color: #f7f7f7;
text-shadow: 0px 0px 2px rgba(92, 92, 92, 0.9);
transition-duration: 200ms; }
#panel .panel-button:active .system-status-icon,
#panel .panel-button:active .app-menu-icon > StIcon,
#panel .panel-button:active .popup-menu-arrow, #panel .panel-button:overview .system-status-icon,
#panel .panel-button:overview .app-menu-icon > StIcon,
#panel .panel-button:overview .popup-menu-arrow, #panel .panel-button:focus .system-status-icon,
#panel .panel-button:focus .app-menu-icon > StIcon,
#panel .panel-button:focus .popup-menu-arrow, #panel .panel-button:checked .system-status-icon,
#panel .panel-button:checked .app-menu-icon > StIcon,
#panel .panel-button:checked .popup-menu-arrow {
icon-shadow: 0px 0px 2px rgba(0, 0, 0, 0.9); }
#panel .panel-button:active > .system-status-icon, #panel .panel-button:overview > .system-status-icon, #panel .panel-button:focus > .system-status-icon, #panel .panel-button:checked > .system-status-icon {
icon-shadow: red 0 2px 2px; }
#panel .panel-button .system-status-icon {
@@ -773,9 +784,9 @@ StScrollBar {
.lock-screen #panel .panel-button:hover,
.lock-screen #panel .panel-button:active {
color: #afb5be; }
#panel .panel-button.clock-display:hover, #panel .panel-button.clock-display:active, #panel .panel-button.clock-display:overview, #panel .panel-button.clock-display:focus, #panel .panel-button.clock-display:checked {
#panel .panel-button.clock-display:active, #panel .panel-button.clock-display:overview, #panel .panel-button.clock-display:focus, #panel .panel-button.clock-display:checked {
box-shadow: none; }
#panel .panel-button.clock-display:hover .clock, #panel .panel-button.clock-display:active .clock, #panel .panel-button.clock-display:overview .clock, #panel .panel-button.clock-display:focus .clock, #panel .panel-button.clock-display:checked .clock {
#panel .panel-button.clock-display:active .clock, #panel .panel-button.clock-display:overview .clock, #panel .panel-button.clock-display:focus .clock, #panel .panel-button.clock-display:checked .clock {
box-shadow: none; }
#panel .panel-status-indicators-box,
#panel .panel-status-menu-box {
@@ -803,8 +814,7 @@ StScrollBar {
.calendar, .world-clocks-button, .weather-button, .events-button {
background: transparent;
border: none;
color: #929ba8; }
border: none; }
.calendar,
.datemenu-today-button,
@@ -1242,11 +1252,11 @@ StScrollBar {
spacing: 12px; }
/* OVERVIEW */
#overview, .controls-manager, .secondary-monitor-workspaces {
#overview {
spacing: 24px; }
#overviewGroup {
background-color: #202127; }
#overview.cosmic-solid-bg {
background-color: #202127 !important; }
.overview-controls {
padding-bottom: 32px; }
@@ -1266,7 +1276,7 @@ StScrollBar {
.window-caption {
spacing: 20px;
color: white;
background-color: rgba(4, 4, 5, 0.7);
background-color: rgba(16, 16, 19, 0.65);
border-radius: 2px;
padding: 4px 8px; }
@@ -1274,17 +1284,21 @@ StScrollBar {
width: 320px;
padding: 9px;
border-radius: 100px;
border: 1px solid #161819;
border: none;
color: #929ba8;
background-color: #09090b;
background-color: rgba(16, 16, 19, 0.6);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); }
.search-entry:focus {
border-width: 0;
color: #929ba8;
background-color: rgba(16, 16, 19, 0.8);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); }
.search-entry .search-entry-icon {
icon-size: 1em;
padding: 0 4px;
color: rgba(146, 155, 168, 0.7); }
.search-entry:hover, .search-entry:focus {
background-color: #09090b;
border-color: rgba(0, 114, 255, 0.8); }
background-color: rgba(16, 16, 19, 0.8); }
.search-entry:hover .search-entry-icon, .search-entry:focus .search-entry-icon {
color: #929ba8; }
@@ -1335,12 +1349,26 @@ StScrollBar {
padding: 15px; }
/* DASHBOARD */
.dash-background {
background-color: #09090b; }
#dash {
font-size: 9pt;
color: white;
background-color: rgba(16, 16, 19, 0.95);
padding: 6px 0;
border: 1px solid #161819;
border-left: 0px;
border-radius: 0px 5px 5px 0px; }
#dash:rtl {
border-radius: 9px 0 0 9px; }
#dash .placeholder {
background-image: url("assets/dash-placeholder.svg");
background-size: contain;
height: 24px; }
#dash .empty-dash-drop-target {
width: 24px;
height: 24px; }
.dash-separator {
width: 1px;
background-color: #202026; }
.dash-item-container > StWidget {
padding: 4px 8px; }
.dash-label {
border-radius: 7px;
@@ -1400,6 +1428,17 @@ StScrollBar {
.show-apps,
.grid-search-result {
border: none; }
.app-well-app:active .overview-icon,
.app-well-app:checked .overview-icon,
.app-well-app.app-folder:active .overview-icon,
.app-well-app.app-folder:checked .overview-icon,
.show-apps:active .overview-icon,
.show-apps:checked .overview-icon,
.grid-search-result:active .overview-icon,
.grid-search-result:checked .overview-icon {
background-color: rgba(0, 0, 0, 0.85);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
color: #929ba8; }
.app-well-app:hover .overview-icon,
.app-well-app:focus .overview-icon,
.app-well-app:selected .overview-icon,
@@ -1412,21 +1451,10 @@ StScrollBar {
.grid-search-result:hover .overview-icon,
.grid-search-result:focus .overview-icon,
.grid-search-result:selected .overview-icon {
background-color: black;
background-color: rgba(16, 16, 19, 0.5);
transition-duration: 0ms;
border-image: none;
background-image: none; }
.app-well-app:active .overview-icon,
.app-well-app:checked .overview-icon,
.app-well-app.app-folder:active .overview-icon,
.app-well-app.app-folder:checked .overview-icon,
.show-apps:active .overview-icon,
.show-apps:checked .overview-icon,
.grid-search-result:active .overview-icon,
.grid-search-result:checked .overview-icon {
background-color: black;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.15);
color: #929ba8; }
.app-well-app-running-dot {
width: 4px;
@@ -1442,26 +1470,13 @@ StScrollBar {
.show-apps .overview-icon,
.grid-search-result .overview-icon {
color: #f7f7f7;
border-radius: 2px;
padding: 7px 6px;
border: none;
transition-duration: 100ms;
text-align: center;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); }
/* App Folders */
.app-well-app.app-folder {
background-color: #09090b; }
.app-folder-dialog {
background-color: #09090b; }
.app-folder-dialog .edit-folder-button {
padding: 0;
width: 36px;
height: 36px;
border-radius: 18px; }
.app-folder-dialog .edit-folder-button > StIcon {
icon-size: 16px; }
.app-well-app.app-folder > .overview-icon {
background-color: rgba(16, 16, 19, 0.35); }
@@ -1558,7 +1573,7 @@ StScrollBar {
.notification-banner:focus {
background-color: rgba(16, 16, 19, 0.96); }
.notification-banner * {
color: #929ba8; }
color: white; }
.notification-banner .notification-icon {
padding: 5px; }
.notification-banner .notification-content {
@@ -2072,3 +2087,32 @@ StScrollBar {
.openweather-current-databox-captions, .openweather-forecast-day {
color: #0072ff; }
/* Pop_OS COSMIC Dock styling, append !important to any changed rules */
.cosmic-dock #dock {
border-radius: 12px 12px 12px 12px !important;
border: 0 !important;
background-color: #09090b;
margin: 4px !important; }
.cosmic-dock.extended #dock {
border-radius: 0px !important;
margin: 0 !important; }
.cosmic-dock.extended.side #dock {
border-top-width: 0 !important;
border-bottom-width: 0 !important; }
.cosmic-dock.extended.side.left #dock {
border-left-width: 0 !important; }
.cosmic-dock.extended.side.right #dock {
border-right-width: 0 !important; }
.cosmic-dock.extended.bottom #dock {
border-bottom-width: 0 !important;
border-left-width: 0 !important;
border-right-width: 0 !important; }
.cosmic-dock .app-well-app:hover .overview-icon, .cosmic-dock .app-well-app:focus .overview-icon, .cosmic-dock .app-well-app:selected .overview-icon {
border-radius: 11px; }

3
gnome-shell/gnome-shell.scss
View File

@@ -3,4 +3,5 @@ $subtheme: 'main';
@import "colors"; //use gtk colors
@import "drawing";
@import "common";
@import "extensions"
@import "extensions";
@import "cosmic"