Skip to content

Commit cb0c442

Browse files
TerminalHashTerminalHash
committed
gnome-shell: deep recoloring and fixes
1 parent 17a60b0 commit cb0c442

1 file changed

Lines changed: 179 additions & 24 deletions

File tree

‎Dark/gnome-shell/gnome-shell.css‎

Lines changed: 179 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -77,8 +77,9 @@ stage {
7777

7878
.workspace-switcher-container, .switcher-list, .resize-popup, .osd-window {
7979
color: #eeeeec;
80-
background-color: rgba(32, 32, 32, 0.96);
81-
border-radius: 14px;
80+
background-color: #353535;
81+
border: 1px solid #0f0f0f;
82+
border-radius: 6px;
8283
padding: 8px;
8384
}
8485

@@ -91,7 +92,7 @@ stage {
9192
.grid-search-result .overview-icon, .list-search-result, .search-provider-icon {
9293
border-radius: 4px;
9394
padding: 4px;
94-
border: 2px solid transparent;
95+
border: 1px solid #0f0f0f;
9596
transition-duration: 100ms;
9697
text-align: center;
9798
}
@@ -102,6 +103,130 @@ stage {
102103
border: 1px solid #202020;
103104
}
104105

106+
/* ================================= */
107+
/* ---====== Screenshot UI ======--- */
108+
109+
.screenshot-ui-panel {
110+
color: white;
111+
background-color: #353535;
112+
border: 1px solid #0F0F0F;
113+
border-radius: 10px;
114+
padding: 12px;
115+
}
116+
117+
.screenshot-ui-show-pointer-button, .screenshot-ui-type-button {
118+
transition-duration: 100ms;
119+
outline-color: rgba(238, 238, 236, 0.3);
120+
border: 1px solid #1b1b1b;
121+
background-color: #3f3f3f;
122+
box-shadow: none;
123+
border-radius: 10px;
124+
}
125+
126+
.screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive {
127+
transition-duration: 100ms;
128+
color: rgba(255, 255, 255, 0.5);
129+
background-color: rgba(255, 255, 255, 0.05);
130+
background-color: transparent;
131+
color: rgba(255, 255, 255, 0.5);
132+
}
133+
134+
.screenshot-ui-show-pointer-button:insensitive, .screenshot-ui-type-button:insensitive {
135+
transition-duration: 100ms;
136+
background-color: transparent;
137+
background-color: none;
138+
box-shadow: none;
139+
}
140+
141+
.screenshot-ui-show-pointer-button:insensitive:insensitive, .screenshot-ui-type-button:insensitive:insensitive {
142+
transition-duration: 100ms;
143+
color: rgba(255, 255, 255, 0.5);
144+
background-color: rgba(255, 255, 255, 0.05);
145+
background-color: transparent;
146+
color: rgba(255, 255, 255, 0.5);
147+
}
148+
149+
.screenshot-ui-show-pointer-button:focus, .screenshot-ui-type-button:focus {
150+
transition-duration: 100ms;
151+
color: white;
152+
background-color: #75507b;
153+
box-shadow: inset 0 0 0 2px rgba(53, 132, 228, 0.6) !important;
154+
}
155+
156+
.screenshot-ui-show-pointer-button:focus:hover, .screenshot-ui-type-button:focus:hover {
157+
background-color: #363d47;
158+
box-shadow: inset 0 0 0 2px rgba(53, 132, 228, 0.7) !important;
159+
}
160+
161+
.screenshot-ui-show-pointer-button:focus:active, .screenshot-ui-type-button:focus:active {
162+
background-color: #3c444e;
163+
box-shadow: inset 0 0 0 2px rgba(53, 132, 228, 0.7) !important;
164+
}
165+
166+
.screenshot-ui-show-pointer-button:hover, .screenshot-ui-type-button:hover {
167+
transition-duration: 100ms;
168+
color: white;
169+
background-color: #353535;
170+
}
171+
172+
.screenshot-ui-show-pointer-button:active, .screenshot-ui-type-button:active {
173+
transition-duration: 100ms;
174+
color: white;
175+
background-color: #202020;
176+
}
177+
178+
.screenshot-ui-show-pointer-button:outlined, .screenshot-ui-type-button:outlined, .screenshot-ui-show-pointer-button:checked, .screenshot-ui-type-button:checked {
179+
transition-duration: 100ms;
180+
color: white;
181+
background-color: #ad7fa8;
182+
}
183+
184+
.screenshot-ui-show-pointer-button:outlined:hover, .screenshot-ui-type-button:outlined:hover, .screenshot-ui-show-pointer-button:checked:hover, .screenshot-ui-type-button:checked:hover {
185+
background-color: #75507b;
186+
}
187+
188+
.screenshot-ui-show-pointer-button:outlined:active, .screenshot-ui-type-button:outlined:active, .screenshot-ui-show-pointer-button:checked:active, .screenshot-ui-type-button:checked:active {
189+
background-color: #5c3566;
190+
}
191+
192+
/* ================================== */
193+
/* ---====== Quick Settings ======--- */
194+
195+
/* Fix this big radius */
196+
.quick-settings {
197+
border-radius: 10px;
198+
}
199+
200+
.quick-settings .button {
201+
padding: 3px;
202+
}
203+
204+
.quick-settings .icon-button {
205+
padding: 6px;
206+
}
207+
208+
/* Use :checked for buttons in quick settings menu */
209+
.quick-toggle:checked {
210+
border-color: #5c3566;
211+
background-color: #A06EA8;
212+
}
213+
214+
/* Good form for icon buttons in quick settings */
215+
.icon-button {
216+
outline-color: rgba(238, 238, 236, 0.3);
217+
border-color: #1b1b1b;
218+
background-image: linear-gradient(to top, #353535 2px, #3f3f3f);
219+
border-radius: 8px;
220+
border-style: 1px solid;
221+
}
222+
223+
.icon-button:hover {
224+
background-image: linear-gradient(to top, #2b2b2b 2px, #353535);
225+
}
226+
227+
228+
/* =========================== */
229+
/* ---====== Buttons ======--- */
105230
.button {
106231
border-radius: 5px;
107232
border-style: solid;
@@ -211,7 +336,8 @@ stage {
211336
border-radius: 0 0 8px 8px;
212337
}
213338

214-
/* WIDGETS */
339+
/* =========================== */
340+
/* ---====== Widgets ======--- */
215341
.shell-link {
216342
color: #6ea7ec;
217343
}
@@ -268,8 +394,8 @@ StEntry StLabel.hint-text {
268394
color: rgba(238, 238, 236, 0.7);
269395
}
270396

271-
/* Buttons */
272-
/* Check Boxes */
397+
/* ================================== */
398+
/* ---====== Image elements ======--- */
273399
.check-box StBoxLayout {
274400
spacing: .8em;
275401
}
@@ -327,7 +453,8 @@ StEntry StLabel.hint-text {
327453
color: white;
328454
}
329455

330-
/* Scrollbars */
456+
/* ============================= */
457+
/* ---====== Scrollbar ======--- */
331458
StScrollView.vfade {
332459
-st-vfade-offset: 68px;
333460
}
@@ -385,13 +512,16 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
385512
margin-bottom: 1.75em;
386513
}
387514

388-
.popup-menu-content {
389-
padding: 10px 0;
515+
/* We using this to date-menu popover, input popover and quick-toggles background */
516+
.popup-menu-content, .candidate-popup-content {
517+
padding: 10px;
518+
border-radius: 10px;
390519
}
391520

392521
.popup-menu-item {
393522
spacing: 4px;
394523
padding: 4px;
524+
border-radius: 6px;
395525
}
396526

397527
.popup-menu-item:ltr {
@@ -498,6 +628,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
498628
}
499629

500630
/* Date/Time Menu */
631+
.datemenu-displays-box {
632+
border-radius: 999px;
633+
}
634+
501635
.clock-display-box {
502636
spacing: 2px;
503637
}
@@ -690,7 +824,7 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
690824
height: 26px;
691825
padding: 0;
692826
margin: 2px;
693-
border-radius: 15px;
827+
border-radius: 8px;
694828
border: 1px solid transparent;
695829
font-feature-settings: "tnum";
696830
}
@@ -1691,13 +1825,15 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
16911825
color: #fff;
16921826
}
16931827

1694-
/* Top Bar */
1828+
/* ========================= */
1829+
/* ---====== Panel ======--- */
16951830
#panel {
1696-
background-color: rgba(0, 0, 0, 1);
1831+
background-color: #353535;
16971832
font-weight: bold;
16981833
height: 32px;
16991834
font-feature-settings: "tnum";
17001835
transition-duration: 250ms;
1836+
padding: 4px 0;
17011837
}
17021838

17031839
#panel:overview {
@@ -1732,11 +1868,11 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
17321868
#panel .panel-button {
17331869
font-weight: bold;
17341870
color: #ccc;
1735-
-natural-hpadding: 8px;
1736-
-minimum-hpadding: 6px;
1871+
-natural-hpadding: 4px;
1872+
-minimum-hpadding: 4px;
17371873
transition-duration: 150ms;
17381874
border: 3px solid transparent;
1739-
border-radius: 4px;
1875+
border-radius: 5px;
17401876
}
17411877

17421878
#panel .panel-button StLabel {
@@ -1826,7 +1962,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
18261962
border-radius: 0 0 0 52px;
18271963
}
18281964

1829-
/* OVERVIEW */
1965+
/* ============================ */
1966+
/* ---====== Overview ======--- */
18301967
.controls-manager, .secondary-monitor-workspaces {
18311968
spacing: 14px;
18321969
}
@@ -1883,10 +2020,10 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
18832020
.search-entry {
18842021
width: 320px;
18852022
padding: 2px 8px;
1886-
border-radius: 18px;
2023+
border-radius: 6px;
18872024
color: rgba(255, 255, 255, 0.7);
18882025
background-color: rgba(255, 255, 255, 0.1);
1889-
border: 0;
2026+
border: 1px solid #0f0f0f;
18902027
margin-top: 8px;
18912028
margin-bottom: 0;
18922029
}
@@ -1899,7 +2036,6 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
18992036

19002037
.search-entry:hover {
19012038
background-color: rgba(255, 255, 255, 0.15);
1902-
border-color: transparent;
19032039
color: white;
19042040
}
19052041

@@ -2194,7 +2330,8 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
21942330
icon-size: 48px;
21952331
}
21962332

2197-
/* Dash */
2333+
/* ======================== */
2334+
/* ---====== Dash ======--- */
21982335
#dash {
21992336
font-size: 80%;
22002337
margin-top: 4px;
@@ -2235,14 +2372,32 @@ StScrollBar StButton#vhandle:active, StScrollBar StButton#hhandle:active {
22352372
#dash .app-well-app .overview-icon, #dash .show-apps .overview-icon {
22362373
border-radius: 6px;
22372374
padding: 6px;
2375+
background-color: #353535;
2376+
border: 1px solid #0f0f0f;
2377+
}
2378+
2379+
#dash .app-well-app:hover .overview-icon, #dash .show-apps:hover .overview-icon {
2380+
background-color: #454545;
2381+
}
2382+
2383+
#dash .app-well-app:focus .overview-icon, #dash .show-apps:focus .overview-icon {
2384+
background-color: #2d2d2d;
2385+
}
2386+
2387+
#dash .app-well-app:drop .overview-icon, #dash .show-apps:drop .overview-icon {
2388+
background-color: #707070;
2389+
}
2390+
2391+
#dash .app-well-app:active .overview-icon, #dash .show-apps:active .overview-icon {
2392+
background-color: #505050;
22382393
}
22392394

22402395
.dash-background {
2241-
border: 1px solid rgba(255, 255, 255, 0.16);
2242-
background-color: rgba(27, 27, 27, 0.76);
2396+
border: 1px solid #0f0f0f;
2397+
background-color: #212121;
22432398
margin-bottom: 4px;
2244-
padding: 1px;
2245-
border-radius: 8px;
2399+
padding: 4px;
2400+
border-radius: 6px;
22462401
}
22472402

22482403
.dash-item-container .app-well-app, .show-apps {

0 commit comments

Comments
 (0)