Skip to content

Commit

Permalink
update
Browse files Browse the repository at this point in the history
  • Loading branch information
vinceliuice committed Oct 11, 2024
1 parent c44dd8d commit 774bfd9
Show file tree
Hide file tree
Showing 8 changed files with 200 additions and 88 deletions.
56 changes: 39 additions & 17 deletions src/_sass/gtk/_common-3.20.scss
Original file line number Diff line number Diff line change
Expand Up @@ -503,7 +503,7 @@ button {
&:disabled { @include button(flat-disabled); }
}

&:checked, &:checked:hover { @include button(flat-checked); }
&:checked, &:checked:hover, &:checked:focus { @include button(flat-checked); }

&:checked:disabled { @include button(flat-checked-disabled); }
}
Expand Down Expand Up @@ -1292,6 +1292,8 @@ searchbar > revealer > box {
&:disabled { color: $titlebar-text-secondary-disabled; }

&:checked {
&:focus { color: $titlebar-text; }

&:disabled {
background-color: transparent;
color: $titlebar-text-disabled;
Expand Down Expand Up @@ -1422,7 +1424,7 @@ searchbar > revealer > box {
margin-right: $space-size / 2;
}

.linked:not(.vertical) > entry:not(:only-child) {
.linked > entry:not(:only-child) {
border-radius: $corner-radius;

@if $window == 'round' {
Expand All @@ -1442,9 +1444,14 @@ searchbar > revealer > box {
border-radius: $corner-radius;
padding: ($medium-size - 24px) / 2 ($medium-size - 16px) / 2;
}
}

.linked:not(.vertical) > & {
border-radius: $corner-radius;
.linked > button:not(.suggested-action):not(.destructive-action):not(:only-child) {
border-radius: $corner-radius;

&:checked:focus {
background-color: $overlay-checked;
color: $titlebar-text;
}
}

Expand All @@ -1458,12 +1465,9 @@ searchbar > revealer > box {
}

stackswitcher { // reset
border-radius: $corner-radius;
margin: $space-size 0;

&.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action).text-button {
border-radius: $corner-radius;
}
> button { margin: 0; }
}

// FIXME: Ugly overriding
Expand Down Expand Up @@ -4113,33 +4117,51 @@ cursor-handle {

stackswitcher {
min-height: 0;
padding: 0;
padding: 0 $space-size;
// margin: $space-size 0;
border-radius: $corner-radius;
background-color: $overlay-normal;

&.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action) {
margin: 0 0;
border-radius: $corner-radius;
margin: 0;
background-color: transparent;
background-image: none;
border: none;
animation: none;
box-shadow: none;
transition: box-shadow $ripple-fade-in-duration $ease-out;

&, &:first-child, &:last-child {
border-radius: 0;
}

&.text-button { min-width: 100px; }

&:focus { box-shadow: inset 0 0 0 2px $overlay-focus; }
&:focus {
box-shadow: inset 0 -2px $overlay-focus;
background-color: transparent;
background-image: none;
}

&:hover {
box-shadow: inset 0 0 0 9999px $overlay-hover;
box-shadow: inset 0 -2px $track;
background-color: transparent;
background-image: none;
}

&:active {
box-shadow: inset 0 0 0 9999px gtkalpha($primary, 0.08);
background-image: radial-gradient(circle, gtkalpha($primary, 0.08) 10%, transparent 0%);
box-shadow: inset 0 -2px gtkalpha($primary, 0.65);
background-color: transparent;
background-image: none;
transition: box-shadow $ripple-fade-in-duration $ease-out;
}

&:checked {
background-color: $primary;
color: on($primary);
box-shadow: inset 0 -2px $primary;
background-color: transparent;
background-image: none;
color: $text;
transition: box-shadow $ripple-fade-in-duration $ease-out;
}
}

Expand Down
2 changes: 1 addition & 1 deletion src/_sass/gtk/_common-4.0.scss
Original file line number Diff line number Diff line change
Expand Up @@ -2585,7 +2585,7 @@ scrollbar {
background: none;
border: none;
outline: none;
padding: 0;
padding: if($window == 'round', $space-size / 2, 0);
margin: 0;

> slider {
Expand Down
37 changes: 26 additions & 11 deletions src/gtk/3.0/gtk-Dark-compact.css
Original file line number Diff line number Diff line change
Expand Up @@ -1626,12 +1626,11 @@ headerbar button.titlebutton:not(.suggested-action):not(.destructive-action) {
}

.titlebar stackswitcher {
border-radius: 2px;
margin: 4px 0;
}

.titlebar stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action).text-button {
border-radius: 2px;
.titlebar stackswitcher > button {
margin: 0;
}

.titlebar .path-bar button:not(.suggested-action):not(.destructive-action).text-button {
Expand Down Expand Up @@ -4310,38 +4309,54 @@ cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl)

stackswitcher {
min-height: 0;
padding: 0;
padding: 0 4px;
border-radius: 2px;
background-color: alpha(currentColor, 0.05);
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action) {
margin: 0 0;
border-radius: 2px;
margin: 0;
background-color: transparent;
background-image: none;
border: none;
animation: none;
box-shadow: none;
transition: box-shadow 225ms cubic-bezier(0, 0, 0.2, 1);
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action), stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):first-child, stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):last-child {
border-radius: 0;
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action).text-button {
min-width: 100px;
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):focus {
box-shadow: inset 0 0 0 2px alpha(currentColor, 0.08);
box-shadow: inset 0 -2px alpha(currentColor, 0.08);
background-color: transparent;
background-image: none;
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):hover {
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08);
box-shadow: inset 0 -2px rgba(255, 255, 255, 0.3);
background-color: transparent;
background-image: none;
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):active {
box-shadow: inset 0 0 0 9999px alpha(#3281EA, 0.08);
background-image: radial-gradient(circle, alpha(#3281EA, 0.08) 10%, transparent 0%);
box-shadow: inset 0 -2px alpha(#3281EA, 0.65);
background-color: transparent;
background-image: none;
transition: box-shadow 225ms cubic-bezier(0, 0, 0.2, 1);
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):checked {
background-color: #3281EA;
box-shadow: inset 0 -2px #3281EA;
background-color: transparent;
background-image: none;
color: white;
transition: box-shadow 225ms cubic-bezier(0, 0, 0.2, 1);
}

stackswitcher button.text-button {
Expand Down
37 changes: 26 additions & 11 deletions src/gtk/3.0/gtk-Dark.css
Original file line number Diff line number Diff line change
Expand Up @@ -1626,12 +1626,11 @@ headerbar button.titlebutton:not(.suggested-action):not(.destructive-action) {
}

.titlebar stackswitcher {
border-radius: 2px;
margin: 6px 0;
}

.titlebar stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action).text-button {
border-radius: 2px;
.titlebar stackswitcher > button {
margin: 0;
}

.titlebar .path-bar button:not(.suggested-action):not(.destructive-action).text-button {
Expand Down Expand Up @@ -4310,38 +4309,54 @@ cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl)

stackswitcher {
min-height: 0;
padding: 0;
padding: 0 6px;
border-radius: 2px;
background-color: alpha(currentColor, 0.05);
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action) {
margin: 0 0;
border-radius: 2px;
margin: 0;
background-color: transparent;
background-image: none;
border: none;
animation: none;
box-shadow: none;
transition: box-shadow 225ms cubic-bezier(0, 0, 0.2, 1);
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action), stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):first-child, stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):last-child {
border-radius: 0;
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action).text-button {
min-width: 100px;
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):focus {
box-shadow: inset 0 0 0 2px alpha(currentColor, 0.08);
box-shadow: inset 0 -2px alpha(currentColor, 0.08);
background-color: transparent;
background-image: none;
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):hover {
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08);
box-shadow: inset 0 -2px rgba(255, 255, 255, 0.3);
background-color: transparent;
background-image: none;
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):active {
box-shadow: inset 0 0 0 9999px alpha(#3281EA, 0.08);
background-image: radial-gradient(circle, alpha(#3281EA, 0.08) 10%, transparent 0%);
box-shadow: inset 0 -2px alpha(#3281EA, 0.65);
background-color: transparent;
background-image: none;
transition: box-shadow 225ms cubic-bezier(0, 0, 0.2, 1);
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):checked {
background-color: #3281EA;
box-shadow: inset 0 -2px #3281EA;
background-color: transparent;
background-image: none;
color: white;
transition: box-shadow 225ms cubic-bezier(0, 0, 0.2, 1);
}

stackswitcher button.text-button {
Expand Down
39 changes: 27 additions & 12 deletions src/gtk/3.0/gtk-Light-compact.css
Original file line number Diff line number Diff line change
Expand Up @@ -1626,12 +1626,11 @@ headerbar button.titlebutton:not(.suggested-action):not(.destructive-action) {
}

.titlebar stackswitcher {
border-radius: 2px;
margin: 4px 0;
}

.titlebar stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action).text-button {
border-radius: 2px;
.titlebar stackswitcher > button {
margin: 0;
}

.titlebar .path-bar button:not(.suggested-action):not(.destructive-action).text-button {
Expand Down Expand Up @@ -4310,38 +4309,54 @@ cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl)

stackswitcher {
min-height: 0;
padding: 0;
padding: 0 4px;
border-radius: 2px;
background-color: alpha(currentColor, 0.05);
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action) {
margin: 0 0;
border-radius: 2px;
margin: 0;
background-color: transparent;
background-image: none;
border: none;
animation: none;
box-shadow: none;
transition: box-shadow 225ms cubic-bezier(0, 0, 0.2, 1);
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action), stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):first-child, stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):last-child {
border-radius: 0;
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action).text-button {
min-width: 100px;
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):focus {
box-shadow: inset 0 0 0 2px alpha(currentColor, 0.08);
box-shadow: inset 0 -2px alpha(currentColor, 0.08);
background-color: transparent;
background-image: none;
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):hover {
box-shadow: inset 0 0 0 9999px alpha(currentColor, 0.08);
box-shadow: inset 0 -2px rgba(0, 0, 0, 0.26);
background-color: transparent;
background-image: none;
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):active {
box-shadow: inset 0 0 0 9999px alpha(#1A73E8, 0.08);
background-image: radial-gradient(circle, alpha(#1A73E8, 0.08) 10%, transparent 0%);
box-shadow: inset 0 -2px alpha(#1A73E8, 0.65);
background-color: transparent;
background-image: none;
transition: box-shadow 225ms cubic-bezier(0, 0, 0.2, 1);
}

stackswitcher.linked:not(.vertical) > button:not(.suggested-action):not(.destructive-action):checked {
background-color: #1A73E8;
color: white;
box-shadow: inset 0 -2px #1A73E8;
background-color: transparent;
background-image: none;
color: rgba(0, 0, 0, 0.87);
transition: box-shadow 225ms cubic-bezier(0, 0, 0.2, 1);
}

stackswitcher button.text-button {
Expand Down
Loading

0 comments on commit 774bfd9

Please sign in to comment.