adw-gtk with Peninsula-dark's windows control button

[ajay230ps]

Hi I like the windows control button on the Peninsula-dark theme, but was looking for light theme version. So copy pasted the windows control lines form the Peninsula-dark and to a blank gtk.css file. Also created a symlink for gtk3 app.

Window controls works perfectly for both light and dark.

/ Creates grey shade on windows control for background apps for GTK 4 (I guess!) /

.maximized decoration, .fullscreen decoration { border-radius: 0; box-shadow: none; }

/ Windows controls decoration /

button.titlebutton { / GTK3 / color: transparent; min-width: 18px; min-height: 18px; } button.titlebutton:backdrop { opacity: 0.5; }

.titlebar, headerbar { border-bottom-color: alpha(currentColor, 0.15); } .titlebar:backdrop, headerbar:backdrop { border-bottom-color: alpha(currentColor, 0.2); }

windowcontrols > button { / GTK4 / color: transparent; min-width: 18px; min-height: 18px; border-radius: 100%; padding: 0; margin: 0 5px; } windowcontrols > button > image { padding: 0; }

button.titlebutton.close, windowcontrols > button.close, button.titlebutton.close:hover:backdrop, windowcontrols > button.close:hover:backdrop { background-color: #e86150; }

button.titlebutton.close:hover, windowcontrols > button.close:hover { background-color: #f19e94; }

button.titlebutton.maximize, windowcontrols > button.maximize, button.titlebutton.maximize:hover:backdrop, windowcontrols > button.maximize:hover:backdrop { background-color: #75c2b3; }

button.titlebutton.maximize:hover, windowcontrols > button.maximize:hover { background-color: #aad9d0; }

button.titlebutton.minimize, windowcontrols > button.minimize, button.titlebutton.minimize:hover:backdrop, windowcontrols > button.minimize:hover:backdrop { background-color: #d7c781; }

button.titlebutton.minimize:hover, windowcontrols > button.minimize:hover { background-color: #e9e1bb; }

button.titlebutton.close:backdrop, button.titlebutton.maximize:backdrop, button.titlebutton.minimize:backdrop, windowcontrols > button.close:backdrop, windowcontrols > button.maximize:backdrop, windowcontrols > button.minimize:backdrop { background-color: #707f8c; }

[lassekongo83]

There are also light colors for the peninsula color scheme. https://gitlab.gnome.org/luc14n0/gnome-text-editor/-/blob/main/data/styles/peninsula.xml

[ajay230ps]

Thanks. TBH I don't understand much of the code which are present on css or the XML files. I just copy pasted with trial and error and it worked. And I'm really glad that I understood little bit more today when using Linux system.

[ajay230ps]

Hi

Found one issue, can you please help me with this if possible,

In nautilus, for minimize windows, mouse right click popup has a outline but if I maximize the window that right popup outline is gone/

For some reason unable to use screenshot for right click pop.

[lassekongo83]

Yeah the theme was designed for dark colors in mind.

Search for the line with .csd.popup decoration and change 0 0 0 1px alpha(shade(@headerbar_bg_color, 1.3), 0.9); to 0 0 0 1px alpha(shade(@window_fg_color, 1.3), 0.9); or simply remove the decoration styles as they aren't needed for a light theme.

[ajay230ps]

I'm using the same lines as added on first post.

.csd.popup decoration is not added

I removed the below code, and now its works.

.maximized decoration,
.fullscreen decoration {
border-radius: 0;
box-shadow: none;
}

Not sure if this will have any issues, but so far found none. And thanks a ton for early response.