gtk3: Drop workaround for text transition on headerbar
No longer necessary due to recent code refactoring
by roundabout, Saturday, 2 September 2017, 02:55:05 (1504320905), pushed by roundabout, Sunday, 11 May 2025, 13:22:13 (1746969733)
Author identity: nana-4 <hnmaigo@gmail.com>
34f0940371739392280aee277f8d19a5b56b812e
src/gtk-3.0/3.20/gtk-compact.css
@@ -1223,7 +1223,7 @@ searchbar,
***************/
.titlebar:not(headerbar),
headerbar {
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1);
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1), color 270ms cubic-bezier(0, 0, 0.2, 1);
min-height: 44px;
padding: 0 6px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.1);
@@ -1248,14 +1248,12 @@ headerbar:backdrop:disabled :not(button) > label {
.titlebar:not(headerbar) .title,
headerbar .title {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-weight: bold;
}
.titlebar:not(headerbar) .subtitle,
headerbar .subtitle {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-size: smaller;
}
@@ -1334,7 +1332,7 @@ headerbar button.destructive-action:disabled {
.selection-mode.titlebar:not(headerbar),
headerbar.selection-mode {
transition: background-color 0.00001s 270ms;
transition: background-color 0.00001s 270ms, color 270ms cubic-bezier(0, 0, 0.2, 1);
animation: header_ripple_effect 270ms cubic-bezier(0, 0, 0.2, 1);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2);
background-color: #42A5F5;
src/gtk-3.0/3.20/gtk-dark-compact.css
@@ -1223,7 +1223,7 @@ searchbar,
***************/
.titlebar:not(headerbar),
headerbar {
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1);
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1), color 270ms cubic-bezier(0, 0, 0.2, 1);
min-height: 44px;
padding: 0 6px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.1);
@@ -1248,14 +1248,12 @@ headerbar:backdrop:disabled :not(button) > label {
.titlebar:not(headerbar) .title,
headerbar .title {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-weight: bold;
}
.titlebar:not(headerbar) .subtitle,
headerbar .subtitle {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-size: smaller;
}
@@ -1334,7 +1332,7 @@ headerbar button.destructive-action:disabled {
.selection-mode.titlebar:not(headerbar),
headerbar.selection-mode {
transition: background-color 0.00001s 270ms;
transition: background-color 0.00001s 270ms, color 270ms cubic-bezier(0, 0, 0.2, 1);
animation: header_ripple_effect 270ms cubic-bezier(0, 0, 0.2, 1);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2);
background-color: #42A5F5;
src/gtk-3.0/3.20/gtk-dark.css
@@ -1223,7 +1223,7 @@ searchbar,
***************/
.titlebar:not(headerbar),
headerbar {
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1);
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1), color 270ms cubic-bezier(0, 0, 0.2, 1);
min-height: 48px;
padding: 0 6px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.1);
@@ -1248,14 +1248,12 @@ headerbar:backdrop:disabled :not(button) > label {
.titlebar:not(headerbar) .title,
headerbar .title {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-weight: bold;
}
.titlebar:not(headerbar) .subtitle,
headerbar .subtitle {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-size: smaller;
}
@@ -1334,7 +1332,7 @@ headerbar button.destructive-action:disabled {
.selection-mode.titlebar:not(headerbar),
headerbar.selection-mode {
transition: background-color 0.00001s 270ms;
transition: background-color 0.00001s 270ms, color 270ms cubic-bezier(0, 0, 0.2, 1);
animation: header_ripple_effect 270ms cubic-bezier(0, 0, 0.2, 1);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2);
background-color: #42A5F5;
src/gtk-3.0/3.20/gtk-light-compact.css
@@ -1223,7 +1223,7 @@ searchbar,
***************/
.titlebar:not(headerbar),
headerbar {
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1);
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1), color 270ms cubic-bezier(0, 0, 0.2, 1);
min-height: 44px;
padding: 0 6px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.4);
@@ -1248,14 +1248,12 @@ headerbar:backdrop:disabled :not(button) > label {
.titlebar:not(headerbar) .title,
headerbar .title {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-weight: bold;
}
.titlebar:not(headerbar) .subtitle,
headerbar .subtitle {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-size: smaller;
}
@@ -1334,7 +1332,7 @@ headerbar button.destructive-action:disabled {
.selection-mode.titlebar:not(headerbar),
headerbar.selection-mode {
transition: background-color 0.00001s 270ms;
transition: background-color 0.00001s 270ms, color 270ms cubic-bezier(0, 0, 0.2, 1);
animation: header_ripple_effect 270ms cubic-bezier(0, 0, 0.2, 1);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2);
background-color: #42A5F5;
src/gtk-3.0/3.20/gtk-light.css
@@ -1223,7 +1223,7 @@ searchbar,
***************/
.titlebar:not(headerbar),
headerbar {
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1);
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1), color 270ms cubic-bezier(0, 0, 0.2, 1);
min-height: 48px;
padding: 0 6px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.4);
@@ -1248,14 +1248,12 @@ headerbar:backdrop:disabled :not(button) > label {
.titlebar:not(headerbar) .title,
headerbar .title {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-weight: bold;
}
.titlebar:not(headerbar) .subtitle,
headerbar .subtitle {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-size: smaller;
}
@@ -1334,7 +1332,7 @@ headerbar button.destructive-action:disabled {
.selection-mode.titlebar:not(headerbar),
headerbar.selection-mode {
transition: background-color 0.00001s 270ms;
transition: background-color 0.00001s 270ms, color 270ms cubic-bezier(0, 0, 0.2, 1);
animation: header_ripple_effect 270ms cubic-bezier(0, 0, 0.2, 1);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2);
background-color: #42A5F5;
src/gtk-3.0/3.20/gtk.css
@@ -1223,7 +1223,7 @@ searchbar,
***************/
.titlebar:not(headerbar),
headerbar {
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1);
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1), color 270ms cubic-bezier(0, 0, 0.2, 1);
min-height: 48px;
padding: 0 6px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.1);
@@ -1248,14 +1248,12 @@ headerbar:backdrop:disabled :not(button) > label {
.titlebar:not(headerbar) .title,
headerbar .title {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-weight: bold;
}
.titlebar:not(headerbar) .subtitle,
headerbar .subtitle {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-size: smaller;
}
@@ -1334,7 +1332,7 @@ headerbar button.destructive-action:disabled {
.selection-mode.titlebar:not(headerbar),
headerbar.selection-mode {
transition: background-color 0.00001s 270ms;
transition: background-color 0.00001s 270ms, color 270ms cubic-bezier(0, 0, 0.2, 1);
animation: header_ripple_effect 270ms cubic-bezier(0, 0, 0.2, 1);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2);
background-color: #42A5F5;
src/gtk-3.0/3.22/gtk-compact.css
@@ -1224,7 +1224,7 @@ searchbar,
***************/
.titlebar:not(headerbar),
headerbar {
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1);
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1), color 270ms cubic-bezier(0, 0, 0.2, 1);
min-height: 44px;
padding: 0 6px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.1);
@@ -1249,14 +1249,12 @@ headerbar:backdrop:disabled :not(button) > label {
.titlebar:not(headerbar) .title,
headerbar .title {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-weight: bold;
}
.titlebar:not(headerbar) .subtitle,
headerbar .subtitle {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-size: smaller;
}
@@ -1335,7 +1333,7 @@ headerbar button.destructive-action:disabled {
.selection-mode.titlebar:not(headerbar),
headerbar.selection-mode {
transition: background-color 0.00001s 270ms;
transition: background-color 0.00001s 270ms, color 270ms cubic-bezier(0, 0, 0.2, 1);
animation: header_ripple_effect 270ms cubic-bezier(0, 0, 0.2, 1);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2);
background-color: #42A5F5;
src/gtk-3.0/3.22/gtk-dark-compact.css
@@ -1224,7 +1224,7 @@ searchbar,
***************/
.titlebar:not(headerbar),
headerbar {
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1);
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1), color 270ms cubic-bezier(0, 0, 0.2, 1);
min-height: 44px;
padding: 0 6px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.1);
@@ -1249,14 +1249,12 @@ headerbar:backdrop:disabled :not(button) > label {
.titlebar:not(headerbar) .title,
headerbar .title {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-weight: bold;
}
.titlebar:not(headerbar) .subtitle,
headerbar .subtitle {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-size: smaller;
}
@@ -1335,7 +1333,7 @@ headerbar button.destructive-action:disabled {
.selection-mode.titlebar:not(headerbar),
headerbar.selection-mode {
transition: background-color 0.00001s 270ms;
transition: background-color 0.00001s 270ms, color 270ms cubic-bezier(0, 0, 0.2, 1);
animation: header_ripple_effect 270ms cubic-bezier(0, 0, 0.2, 1);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2);
background-color: #42A5F5;
src/gtk-3.0/3.22/gtk-dark.css
@@ -1224,7 +1224,7 @@ searchbar,
***************/
.titlebar:not(headerbar),
headerbar {
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1);
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1), color 270ms cubic-bezier(0, 0, 0.2, 1);
min-height: 48px;
padding: 0 6px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.1);
@@ -1249,14 +1249,12 @@ headerbar:backdrop:disabled :not(button) > label {
.titlebar:not(headerbar) .title,
headerbar .title {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-weight: bold;
}
.titlebar:not(headerbar) .subtitle,
headerbar .subtitle {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-size: smaller;
}
@@ -1335,7 +1333,7 @@ headerbar button.destructive-action:disabled {
.selection-mode.titlebar:not(headerbar),
headerbar.selection-mode {
transition: background-color 0.00001s 270ms;
transition: background-color 0.00001s 270ms, color 270ms cubic-bezier(0, 0, 0.2, 1);
animation: header_ripple_effect 270ms cubic-bezier(0, 0, 0.2, 1);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2);
background-color: #42A5F5;
src/gtk-3.0/3.22/gtk-light-compact.css
@@ -1224,7 +1224,7 @@ searchbar,
***************/
.titlebar:not(headerbar),
headerbar {
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1);
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1), color 270ms cubic-bezier(0, 0, 0.2, 1);
min-height: 44px;
padding: 0 6px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.4);
@@ -1249,14 +1249,12 @@ headerbar:backdrop:disabled :not(button) > label {
.titlebar:not(headerbar) .title,
headerbar .title {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-weight: bold;
}
.titlebar:not(headerbar) .subtitle,
headerbar .subtitle {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-size: smaller;
}
@@ -1335,7 +1333,7 @@ headerbar button.destructive-action:disabled {
.selection-mode.titlebar:not(headerbar),
headerbar.selection-mode {
transition: background-color 0.00001s 270ms;
transition: background-color 0.00001s 270ms, color 270ms cubic-bezier(0, 0, 0.2, 1);
animation: header_ripple_effect 270ms cubic-bezier(0, 0, 0.2, 1);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2);
background-color: #42A5F5;
src/gtk-3.0/3.22/gtk-light.css
@@ -1224,7 +1224,7 @@ searchbar,
***************/
.titlebar:not(headerbar),
headerbar {
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1);
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1), color 270ms cubic-bezier(0, 0, 0.2, 1);
min-height: 48px;
padding: 0 6px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.4);
@@ -1249,14 +1249,12 @@ headerbar:backdrop:disabled :not(button) > label {
.titlebar:not(headerbar) .title,
headerbar .title {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-weight: bold;
}
.titlebar:not(headerbar) .subtitle,
headerbar .subtitle {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-size: smaller;
}
@@ -1335,7 +1333,7 @@ headerbar button.destructive-action:disabled {
.selection-mode.titlebar:not(headerbar),
headerbar.selection-mode {
transition: background-color 0.00001s 270ms;
transition: background-color 0.00001s 270ms, color 270ms cubic-bezier(0, 0, 0.2, 1);
animation: header_ripple_effect 270ms cubic-bezier(0, 0, 0.2, 1);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2);
background-color: #42A5F5;
src/gtk-3.0/3.22/gtk.css
@@ -1224,7 +1224,7 @@ searchbar,
***************/
.titlebar:not(headerbar),
headerbar {
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1);
transition: background-color 180ms cubic-bezier(0, 0, 0.2, 1), color 270ms cubic-bezier(0, 0, 0.2, 1);
min-height: 48px;
padding: 0 6px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.1);
@@ -1249,14 +1249,12 @@ headerbar:backdrop:disabled :not(button) > label {
.titlebar:not(headerbar) .title,
headerbar .title {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-weight: bold;
}
.titlebar:not(headerbar) .subtitle,
headerbar .subtitle {
transition: all 270ms cubic-bezier(0, 0, 0.2, 1);
padding: 0 12px;
font-size: smaller;
}
@@ -1335,7 +1333,7 @@ headerbar button.destructive-action:disabled {
.selection-mode.titlebar:not(headerbar),
headerbar.selection-mode {
transition: background-color 0.00001s 270ms;
transition: background-color 0.00001s 270ms, color 270ms cubic-bezier(0, 0, 0.2, 1);
animation: header_ripple_effect 270ms cubic-bezier(0, 0, 0.2, 1);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2);
background-color: #42A5F5;
src/gtk-3.0/3.22/sass/_common.scss
@@ -1030,7 +1030,7 @@ searchbar,
***************/
%titlebar,
headerbar {
transition: background-color $shorter_duration $deceleration_curve;
transition: background-color $shorter_duration $deceleration_curve, color $longer_duration $deceleration_curve;
min-height: $large_size;
padding: 0 $container_padding;
box-shadow: $shadow_1, inset 0 1px $titlebar_highlight_color;
@@ -1046,13 +1046,11 @@ headerbar {
}
.title {
transition: $longer_transition;
padding: 0 12px;
font-weight: bold;
}
.subtitle {
transition: $longer_transition;
padding: 0 12px;
font-size: smaller;
@@ -1111,7 +1109,7 @@ headerbar {
&.selection-mode {
// FIXME: 0.00001s is workaround for transition bug of gtk+ 3.22
// see https://bugzilla.gnome.org/show_bug.cgi?id=774064
transition: background-color 0.00001s $longer_duration;
transition: background-color 0.00001s $longer_duration, color $longer_duration $deceleration_curve;
animation: header_ripple_effect $longer_duration $deceleration_curve;
box-shadow: $shadow_1, inset 0 1px $alt_highlight_color;
background-color: $primary_color;