Skip to content

Commit

Permalink
BUGfix: Gtk-4.0 - extra padding inside maximized windows
Browse files Browse the repository at this point in the history
  • Loading branch information
thekomer committed Dec 25, 2021
1 parent 4603eda commit a6ef972
Show file tree
Hide file tree
Showing 3 changed files with 126 additions and 137 deletions.
73 changes: 34 additions & 39 deletions gtk-4.0/gtk-dark.css
Original file line number Diff line number Diff line change
Expand Up @@ -4680,49 +4680,44 @@ treeview.view header button, treeview.view header button:hover, treeview.view he
/**********************
* Window Decorations *
*********************/
decoration, window {
border-radius: 4px 4px 0 0;
border-width: 0px;
window {
border-width: 0px;
box-shadow: 0 4px 10px 2px rgba(255, 255, 255, 0);
margin: 10px;
border: 2px solid #512508;
background: #512508; }
decoration:backdrop, window:backdrop {
box-shadow: 0 4px 10px 2px rgba(255, 255, 255, 0);
transition: 200ms ease-out;
border: 2px solid #15161b;
background: #15161b; }
.maximized decoration,
.fullscreen decoration,
.tiled decoration, .maximized window,
.fullscreen window,
.tiled window {
border-radius: 0; }
.popup decoration, .popup window {
box-shadow: none;
border: 0px solid #15161b;
background: #15161b; }
.ssd decoration, .ssd window {
border: 2px solid #512508; }
window.csd {
box-shadow: 0 4px 9px 1px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0);
margin: 0px;
border-radius: 4px 4px 0 0; }
window.csd:backdrop {
box-shadow: 0 3px 9px 1px transparent, 0 2px 6px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(255, 255, 255, 0);
transition: 200ms ease-out;
border: 2px solid #15161b; }
window.csd.popup {
border-radius: 7px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(255, 255, 255, 0); }
window.csd.dialog.message {
border-radius: 4px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(255, 255, 255, 0); }
window.solid-csd {
margin: 0;
padding: 4px;
border: solid 1px rgba(255, 255, 255, 0.05);
border-radius: 0;
box-shadow: inset 0 0 0 4px rgba(255, 255, 255, 0.05), inset 0 0 0 #06070c, inset 0 1px rgba(191, 195, 205, 0.07); }
window.solid-csd:backdrop {
box-shadow: inset 0 0 0 4px rgba(255, 255, 255, 0.05), inset 0 0 0 3px #0E111D, inset 0 1px rgba(191, 195, 205, 0.07); }
window.maximized, window.fullscreen {
border-radius: 0;
box-shadow: none; }
.csd.popup decoration, .csd.popup window {
border-radius: 7px;
box-shadow: 0 4px 8px rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.05); }
tooltip.csd decoration, tooltip.csd window {
border-radius: 5px;
box-shadow: none;
border: 0px solid #15161b;
background: #15161b; }
messagedialog.csd decoration, messagedialog.csd window {
border-radius: 7px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(255, 255, 255, 0); }
.solid-csd decoration, .solid-csd window {
window.tiled, window.tiled-top, window.tiled-left, window.tiled-right, window.tiled-bottom {
border-radius: 0;
margin: 0px;
background-color: #0E111D;
border: solid 1px rgba(59, 62, 71, 0.145);
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0), 0 0 0 20px transparent; }
window:backdrop {
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0), 0 0 0 20px transparent;
border: 2px solid #15161b; }
window.popup {
box-shadow: none; }
window.ssd {
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0); }

windowcontrols button.close, windowcontrols button.maximize, windowcontrols button.minimize {
min-width: 20px;
Expand Down
73 changes: 34 additions & 39 deletions gtk-4.0/gtk.css
Original file line number Diff line number Diff line change
Expand Up @@ -4680,49 +4680,44 @@ treeview.view header button, treeview.view header button:hover, treeview.view he
/**********************
* Window Decorations *
*********************/
decoration, window {
border-radius: 4px 4px 0 0;
border-width: 0px;
window {
border-width: 0px;
box-shadow: 0 4px 10px 2px rgba(255, 255, 255, 0);
margin: 10px;
border: 2px solid #512508;
background: #512508; }
decoration:backdrop, window:backdrop {
box-shadow: 0 4px 10px 2px rgba(255, 255, 255, 0);
transition: 200ms ease-out;
border: 2px solid #15161b;
background: #15161b; }
.maximized decoration,
.fullscreen decoration,
.tiled decoration, .maximized window,
.fullscreen window,
.tiled window {
border-radius: 0; }
.popup decoration, .popup window {
box-shadow: none;
border: 0px solid #15161b;
background: #15161b; }
.ssd decoration, .ssd window {
border: 2px solid #512508; }
window.csd {
box-shadow: 0 4px 9px 1px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0);
margin: 0px;
border-radius: 4px 4px 0 0; }
window.csd:backdrop {
box-shadow: 0 3px 9px 1px transparent, 0 2px 6px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(255, 255, 255, 0);
transition: 200ms ease-out;
border: 2px solid #15161b; }
window.csd.popup {
border-radius: 7px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(255, 255, 255, 0); }
window.csd.dialog.message {
border-radius: 4px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(255, 255, 255, 0); }
window.solid-csd {
margin: 0;
padding: 4px;
border: solid 1px rgba(255, 255, 255, 0.05);
border-radius: 0;
box-shadow: inset 0 0 0 4px rgba(255, 255, 255, 0.05), inset 0 0 0 #06070c, inset 0 1px rgba(191, 195, 205, 0.07); }
window.solid-csd:backdrop {
box-shadow: inset 0 0 0 4px rgba(255, 255, 255, 0.05), inset 0 0 0 3px #0E111D, inset 0 1px rgba(191, 195, 205, 0.07); }
window.maximized, window.fullscreen {
border-radius: 0;
box-shadow: none; }
.csd.popup decoration, .csd.popup window {
border-radius: 7px;
box-shadow: 0 4px 8px rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.05); }
tooltip.csd decoration, tooltip.csd window {
border-radius: 5px;
box-shadow: none;
border: 0px solid #15161b;
background: #15161b; }
messagedialog.csd decoration, messagedialog.csd window {
border-radius: 7px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(255, 255, 255, 0); }
.solid-csd decoration, .solid-csd window {
window.tiled, window.tiled-top, window.tiled-left, window.tiled-right, window.tiled-bottom {
border-radius: 0;
margin: 0px;
background-color: #0E111D;
border: solid 1px rgba(59, 62, 71, 0.145);
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0), 0 0 0 20px transparent; }
window:backdrop {
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0), 0 0 0 20px transparent;
border: 2px solid #15161b; }
window.popup {
box-shadow: none; }
window.ssd {
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0); }

windowcontrols button.close, windowcontrols button.maximize, windowcontrols button.minimize {
min-width: 20px;
Expand Down
117 changes: 58 additions & 59 deletions gtk-4.0/widgets/_windows.scss
Original file line number Diff line number Diff line change
@@ -1,81 +1,80 @@
/**********************
* Window Decorations *
*********************/
decoration, window {
border-radius: 4px 4px 0 0;

window {
// lamefun trick to get rounded borders regardless of CSD use
border-width: 0px;

// this needs to be transparent
// see bug #722563
$_wm_border: if($variant=='light', transparentize(black, 0.77), transparentize($borders_color, 0.1));
$_wm_border_backdrop: if($variant=='light', transparentize(black, 0.82), transparentize($borders_color, 0.1));

// lamefun trick to get rounded borders regardless of CSD use
border-width: 0px;

box-shadow: 0 4px 10px 2px transparentize($borders_color, 0.2);
// FIXME rationalize shadows

// this is used for the resize cursor area
margin: 10px;
$_window_radius: 4px;
$_menu_radius: 7px;

// added for accessibility (window borders)
border: 2px solid $window_border_color;
background: $window_border_color;

&:backdrop {
// the transparent shadow here is to enforce that the shadow extents don't
// change when we go to backdrop, to prevent jumping windows.
// The biggest shadow should be in the same order then in the active state
// or the jumping will happen during the transition.
box-shadow: 0 4px 10px 2px transparentize($borders_color, 0.4);
transition: $backdrop_transition;
// added for accessibility (window borders)
border: 2px solid $window_border_backdrop_color;
background: $window_border_backdrop_color;
}

.maximized &,
.fullscreen &,
.tiled & { border-radius: 0; }

.popup & {
box-shadow: none;
border: 0px solid $window_border_backdrop_color;
background: $window_border_backdrop_color;
}

// server-side decorations as used by mutter
.ssd & { box-shadow: none; } //just doing borders, wm draws actual shadows
&.csd {
box-shadow: 0 4px 9px 1px transparentize(black, 0.5),
0 0 0 1px $_wm_border; //doing borders with box-shadow
margin: 0px;
border-radius: $_window_radius $_window_radius 0 0;
&:backdrop {
// the transparent shadow here is to enforce that the shadow extents don't
// change when we go to backdrop, to prevent jumping windows.
// The biggest shadow should be in the same order then in the active state
// or the jumping will happen during the transition.
box-shadow: 0 3px 9px 1px transparent,
0 2px 6px 2px transparentize(black, 0.8),
0 0 0 1px $_wm_border_backdrop;
transition: $backdrop_transition;
// backdrop!!! added for accessibility (window borders)
border: 2px solid $window_border_backdrop_color;
}
&.popup {
border-radius: $_menu_radius;
box-shadow: 0 1px 2px transparentize(black, 0.8),
0 0 0 1px transparentize($_wm_border, 0.1);
}
&.dialog.message {
border-radius: $_window_radius;
box-shadow: 0 1px 2px transparentize(black, 0.8),
0 0 0 1px transparentize($_wm_border, 0.1);
}
}

.csd.popup & {
border-radius: 7px;
box-shadow: 0 4px 8px $menu_shadow_color;
border: 1px solid $borders_color;
}
&.solid-csd {
margin: 0;
padding: 4px;
border: solid 1px $borders_color;
border-radius: 0;
box-shadow: inset 0 0 0 4px $borders_color, inset 0 0 0 $headerbar_color, inset 0 1px transparentize($fg_color, 0.93);

tooltip.csd & {
border-radius: 5px;
box-shadow: none;
border: 0px solid $window_border_backdrop_color;
background: $window_border_backdrop_color;
}
&:backdrop { box-shadow: inset 0 0 0 4px $borders_color, inset 0 0 0 3px $backdrop_bg_color, inset 0 1px transparentize($fg_color, 0.93); }
}

messagedialog.csd & {
border-radius: 7px;
box-shadow: 0 1px 2px transparentize(black, 0.8),
0 0 0 1px transparentize($_wm_border,0.1);
&.maximized,
&.fullscreen { border-radius: 0; box-shadow: none; }

&.tiled,
&.tiled-top,
&.tiled-left,
&.tiled-right,
&.tiled-bottom {
border-radius: 0;
box-shadow: 0 0 0 1px $_wm_border_backdrop,
0 0 0 20px transparent; //transparent control workaround -- #3670
}
&:backdrop {
box-shadow: 0 0 0 1px $_wm_border_backdrop, 0 0 0 20px transparent; // #3670
// backdrop!!! added for accessibility (window borders)
border: 2px solid $window_border_backdrop_color;
}
&.popup { box-shadow: none; }

.solid-csd & {
border-radius: 0;
margin: 0px;
background-color: $backdrop_bg_color;
border: solid 1px $backdrop_borders_color;
box-shadow: none;
}
// server-side decorations as used by mutter
&.ssd { box-shadow: 0 0 0 1px $_wm_border; } //just doing borders, wm draws actual shadows
}

// Window Close button
Expand Down

0 comments on commit a6ef972

Please sign in to comment.