Skip to content

Commit

Permalink
New upstream snapshot for GTK4 (mamolinux#70)
Browse files Browse the repository at this point in the history
Co-authored-by: hsbasu <[email protected]>
  • Loading branch information
github-actions[bot] and hsbasu authored Apr 9, 2024
1 parent 19e889f commit aa3dffd
Show file tree
Hide file tree
Showing 6 changed files with 137 additions and 179 deletions.
12 changes: 7 additions & 5 deletions gtk/upstream/gtk-4.0/Yaru/_colors.scss
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ $fg_color: if($variant == 'light', $inkstone, $porcelain);
$selected_fg_color: $accent_fg_color;
$selected_bg_color: $accent_bg_color;
$selected_borders_color: if($variant== 'light', darken($selected_bg_color, 15%), darken($selected_bg_color, 30%));
$selected_text_bg_color: transparentize($selected_bg_color, 0.7);
$selected_text_bg_color: if($variant == 'light', transparentize($selected_bg_color, 0.7), transparentize($selected_bg_color, 0.2));
$borders_color: if($variant == 'light', darken($bg_color, 18%), darken($bg_color, 10%));
$alt_borders_color: if($variant == 'light', darken($bg_color, 24%), darken($bg_color, 18%));
$borders_edge: if($variant == 'light', transparentize(white, 0.2), transparentize($fg_color, 0.93));
Expand All @@ -21,7 +21,7 @@ $top_hilight: $borders_edge;
$dark_fill: mix($borders_color, $bg_color, 50%);
$headerbar_bg_color: if($variant == 'light', lighten($bg_color, 5%), darken($bg_color, 3%));
$menu_color: if($variant == 'light', $bg_color, lighten($jet, 2%));
$menu_selected_color: if($variant == 'light', darken($bg_color, 6%), darken($bg_color, 8%));
$menu_selected_color: if($variant =='light', darken($bg_color, 6%), lighten($bg_color, 6%)); // Yaru change: use lighter color in dark theme (mimic Libadwaita)

$scrollbar_bg_color: if($variant == 'light', mix($bg_color, $fg_color, 80%), mix($base_color, $bg_color, 50%));
$scrollbar_slider_color: mix($fg_color, $bg_color, 60%);
Expand Down Expand Up @@ -64,7 +64,7 @@ $backdrop_borders_color: mix($borders_color, $bg_color, 80%);
$backdrop_dark_fill: mix($backdrop_borders_color, $backdrop_bg_color, 35%);

//special cased widget colors
$suggested_bg_color: if($variant == 'light', lighten($green, 5%), darken($green, 5%));
$suggested_bg_color: if($accent_bg_color == $orange, if($variant == 'light', lighten($green, 5%), darken($green, 5%)), $accent_bg_color);
$suggested_border_color: if($variant=='light', darken($suggested_bg_color, 5%), darken($suggested_bg_color, 10%));
$progress_bg_color: if($variant== 'light', lighten($accent_bg_color, 10%), lighten($accent_bg_color, 5%));
$progress_border_color: $progress_bg_color;
Expand All @@ -79,5 +79,7 @@ $dim_label_opacity: 0.55;

// Yaru: Optimize accent-color definition for default background colors
@import 'sass-utils';
$link_color: optimize-contrast($bg_color, $accent_bg_color);
$link_visited_color: if($variant == 'light', darken($link_color, 10%), lighten($link_color, 10%));
$contrast_target: if($variant=='light', 6, 5.5);
$link_color: optimize-contrast($bg_color, $accent_bg_color, $target: $contrast_target);
$link_visited_color: if($variant=='light', darken($link_color, 10%),
optimize-contrast($bg_color, $accent_bg_color));
125 changes: 108 additions & 17 deletions gtk/upstream/gtk-4.0/Yaru/_common.scss
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,10 @@ image:disabled {
-gtk-icon-filter: opacity(0.5);
}

picture:disabled {
opacity: 0.5;
}

.view,
%view {
color: $text_color;
Expand Down Expand Up @@ -255,39 +259,39 @@ spinner {

.large-title {
font-weight: 300;
font-size: 24pt;
font-size: 240%;
}
.title-1 {
font-weight: 800;
font-size: 20pt;
font-size: 200%;
}
.title-2 {
font-weight: 800;
font-size: 15pt;
font-size: 150%;
}
.title-3 {
font-weight: 700;
font-size: 15pt;
font-size: 150%;
}
.title-4 {
font-weight: 700;
font-size: 13pt;
font-size: 130%;
}
.heading {
font-weight: 700;
font-size: 11pt;
font-size: 110%;
}
.body {
font-weight: 400;
font-size: 11pt;
font-size: 110%;
}
.caption-heading {
font-weight: 700;
font-size: 9pt;
font-size: 90%;
}
.caption {
font-weight: 400;
font-size: 9pt;
font-size: 90%;
}

/****************
Expand Down Expand Up @@ -947,6 +951,10 @@ modelbutton.flat arrow {
margin: 1px;

@extend %button_basic_flat;

&:hover { @include button(undecorated-hover, $c:darken($bg_color, 4%)); }
&:active,
&:checked { @include button(undecorated-active, $c:darken($bg_color, 4%)); }
}

button.color {
Expand Down Expand Up @@ -1653,6 +1661,14 @@ window.devel {
* Pathbars *
************/

pathbar scrolledwindow undershoot.left {
border-left: solid 1px $borders_color;
}

pathbar scrolledwindow undershoot.right {
border-right: solid 1px $borders_color;
}

pathbar > button {
&.text-button, &.image-button, & {
padding-left: 4px;
Expand Down Expand Up @@ -2467,8 +2483,6 @@ switch {
transition: $button_transition;
}

> image { color: transparent; } /* only show i / o for the accessible theme */

&:hover > slider {
@include button(hover);
}
Expand Down Expand Up @@ -3254,7 +3268,6 @@ list {
border-color: $borders_color;

&:backdrop {
color: $backdrop_text_color;
background-color: $backdrop_base_color;
border-color: $backdrop_borders_color;
}
Expand Down Expand Up @@ -3327,6 +3340,9 @@ columnview {

treeexpander {
border-spacing: 4px;
indent {
-gtk-icon-size: 8px;
}
}

/********************************************************
Expand Down Expand Up @@ -3360,14 +3376,22 @@ columnview row:not(:selected) cell editablelabel.editing text selection {


.rich-list { /* rich lists usually containing other widgets than just labels/text */
& > row {
& > row, & > header {
padding: 8px 12px;
min-height: 32px; /* should be tall even when only containing a label */

& > box {
border-spacing: 12px;
}
}
& > header {
@extend %osd;
background-color: $osd_bg_color;

border-bottom: 1px solid $borders-color;
border-top: 1px solid $borders-color;
font-weight: bold;
}
}

/********************************************************
Expand All @@ -3394,6 +3418,37 @@ columnview.complex {
}
}

/**********************************************************************
* Boxed Lists *
* Lists inside a rounded frame. Can be used together with .rich-list * *
**********************************************************************/

.boxed-list {
border-radius: $window_radius;
border: 1px solid $borders_color;

> row {
@include focus-ring($offset: -1px);

border-bottom: 1px solid transparentize($borders_color, 0.5);

&:backdrop {
border-bottom-color: transparentize($backdrop_borders_color, 0.5);
}

&:first-child {
border-top-left-radius: $window_radius;
border-top-right-radius: $window_radius;
}

&:last-child {
border-bottom-left-radius: $window_radius;
border-bottom-right-radius: $window_radius;
border-bottom: none;
}
}
}

/*********************
* App Notifications *
*********************/
Expand Down Expand Up @@ -3503,6 +3558,10 @@ calendar {
@extend %selected_items;
border-radius: 3px;
}

&:checked {
background-color: gtkalpha($selected_bg_color, 0.3);
}
}

> label.day-number.other-month {
Expand Down Expand Up @@ -3532,7 +3591,7 @@ window.dialog.message { // Message Dialog styling

& label.title {
font-weight: 800;
font-size: 15pt;
font-size: 150%;
}

&.csd { // rounded bottom border styling for csd version
Expand Down Expand Up @@ -3567,6 +3626,36 @@ filechooser {
}

#pathbarbox { border-bottom: 1px solid $bg_color; }

gridview child {
border-radius: 12px;
margin: 12px;

&:hover {
background-color: gtkalpha(currentColor, .04);
}

&:active {
background-color: gtkalpha(currentColor, .08);
}

&:selected {
background-color: gtkalpha($selected_bg_color, .15);
color: inherit;
}

&:selected:hover {
background-color: gtkalpha($selected_bg_color, .20);
}

&:selected:active {
background-color: gtkalpha($selected_bg_color, .25);
}

& filethumbnail image {
filter: drop-shadow(0px 1px 1px rgba(0,0,0,0.3));
}
}
}


Expand Down Expand Up @@ -3632,7 +3721,7 @@ stacksidebar {
color: $fg_color;
}
&:selected:hover:dir(ltr), &:selected:hover:dir(rtl) {
background-color: darken($menu_selected_color,5%);
background-color: if($variant == 'light', darken($menu_selected_color, 5%), lighten($menu_selected_color, 5%)); // Yaru change: use lighter color in dark theme (mimic Libadwaita)
}
&.activatable:active, &.activatable:selected:active {
box-shadow: none; // #3413
Expand Down Expand Up @@ -3663,7 +3752,7 @@ separator.sidebar {
margin: 0 $menu-margin 2px;
@include focus-ring($focus-state: 'focus-visible:focus-within');
&:hover {
background-color: darken($menu_selected_color, 5%);
background-color: if($variant == 'light', darken($menu_selected_color, 5%), lighten($menu_selected_color, 5%)); // Yaru change: use lighter color in dark theme (mimic Libadwaita)
}

&:selected {
Expand All @@ -3676,7 +3765,7 @@ separator.sidebar {


&:hover {
background-color: darken($menu_selected_color,5%);
background-color: if($variant == 'light', darken($menu_selected_color, 5%), lighten($menu_selected_color, 5%)); // Yaru change: use lighter color in dark theme (mimic Libadwaita)
}

}
Expand Down Expand Up @@ -4213,6 +4302,8 @@ shortcuts-section {
// shortcut window keys
shortcut {
border-spacing: 6px;
border-radius: 5px;
@include focus-ring();
}

shortcut > .keycap {
Expand Down
23 changes: 21 additions & 2 deletions gtk/upstream/gtk-4.0/Yaru/_tweaks.scss
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,7 @@ windowcontrols {
$_base_button_color: transparentize($fg_color, 0.9);
$_base_hover_color: transparentize($fg_color, 0.85);
$_base_active_color: transparentize($fg_color, 0.75);

padding: 3px;
margin: 0 4px;

Expand All @@ -90,12 +90,31 @@ windowcontrols {
}

&:active,
&:checked {
&:checked {
background: $_base_active_color;
}
}
}

%titlebar,
headerbar {
&.default-decoration {
windowcontrols {
button,
menubutton {
min-height: 20px;
min-width: 20px;
margin: 0 3px;
}

menubutton button {
min-height: 18px;
min-width: 18px;
}
}
}
}


// Mimic Libadwaita slider

Expand Down
Loading

0 comments on commit aa3dffd

Please sign in to comment.