mirror of
https://github.com/horst3180/arc-theme.git
synced 2024-10-27 19:04:02 +00:00
fix flat button transition
This commit is contained in:
parent
200498e4ec
commit
12f6457901
@ -285,7 +285,8 @@ GtkSearchEntry.entry {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
background-color: rgba(56, 60, 74, 0);
|
||||
background-color: rgba(68, 74, 88, 0);
|
||||
border-color: rgba(43, 46, 57, 0);
|
||||
transition: none; }
|
||||
.button.flat:hover {
|
||||
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
|
@ -285,7 +285,8 @@ GtkSearchEntry.entry {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
background-color: rgba(245, 246, 247, 0);
|
||||
background-color: rgba(251, 251, 252, 0);
|
||||
border-color: rgba(207, 214, 230, 0);
|
||||
transition: none; }
|
||||
.button.flat:hover {
|
||||
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
|
@ -285,7 +285,8 @@ GtkSearchEntry.entry {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
background-color: rgba(56, 60, 74, 0);
|
||||
background-color: rgba(68, 74, 88, 0);
|
||||
border-color: rgba(43, 46, 57, 0);
|
||||
transition: none; }
|
||||
.button.flat:hover {
|
||||
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
|
@ -285,7 +285,8 @@ GtkSearchEntry.entry {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
background-color: rgba(245, 246, 247, 0);
|
||||
background-color: rgba(251, 251, 252, 0);
|
||||
border-color: rgba(207, 214, 230, 0);
|
||||
transition: none; }
|
||||
.button.flat:hover {
|
||||
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
|
@ -285,7 +285,8 @@ GtkSearchEntry.entry {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
background-color: rgba(245, 246, 247, 0);
|
||||
background-color: rgba(251, 251, 252, 0);
|
||||
border-color: rgba(207, 214, 230, 0);
|
||||
transition: none; }
|
||||
.button.flat:hover {
|
||||
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
|
@ -285,7 +285,8 @@ GtkSearchEntry.entry {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
background-color: rgba(245, 246, 247, 0);
|
||||
background-color: rgba(251, 251, 252, 0);
|
||||
border-color: rgba(207, 214, 230, 0);
|
||||
transition: none; }
|
||||
.button.flat:hover {
|
||||
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
|
@ -398,7 +398,8 @@ $_dot_color: $selected_bg_color;
|
||||
|
||||
&.flat {
|
||||
@include button(undecorated);
|
||||
background-color: transparentize($bg_color, 1);
|
||||
background-color: transparentize($button_bg, 1);
|
||||
border-color: transparentize($button_border, 1);
|
||||
// to avoid adiacent buttons borders clashing when transitioning, the transition on the normal state is set
|
||||
// to none, while it's added back in the hover state, so the button decoration will fade in on hover, but
|
||||
// it won't fade out when the pointer leave the button allocation area. To make the transition more evident
|
||||
|
@ -285,7 +285,8 @@ GtkSearchEntry.entry {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
background-color: rgba(56, 60, 74, 0);
|
||||
background-color: rgba(68, 74, 88, 0);
|
||||
border-color: rgba(43, 46, 57, 0);
|
||||
transition: none; }
|
||||
.button.flat:hover {
|
||||
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
|
@ -285,7 +285,8 @@ GtkSearchEntry.entry {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
background-color: rgba(245, 246, 247, 0);
|
||||
background-color: rgba(251, 251, 252, 0);
|
||||
border-color: rgba(207, 214, 230, 0);
|
||||
transition: none; }
|
||||
.button.flat:hover {
|
||||
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
|
@ -285,7 +285,8 @@ GtkSearchEntry.entry {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
background-color: rgba(56, 60, 74, 0);
|
||||
background-color: rgba(68, 74, 88, 0);
|
||||
border-color: rgba(43, 46, 57, 0);
|
||||
transition: none; }
|
||||
.button.flat:hover {
|
||||
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
|
@ -285,7 +285,8 @@ GtkSearchEntry.entry {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
background-color: rgba(245, 246, 247, 0);
|
||||
background-color: rgba(251, 251, 252, 0);
|
||||
border-color: rgba(207, 214, 230, 0);
|
||||
transition: none; }
|
||||
.button.flat:hover {
|
||||
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
|
@ -285,7 +285,8 @@ GtkSearchEntry.entry {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
background-color: rgba(245, 246, 247, 0);
|
||||
background-color: rgba(251, 251, 252, 0);
|
||||
border-color: rgba(207, 214, 230, 0);
|
||||
transition: none; }
|
||||
.button.flat:hover {
|
||||
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
|
@ -285,7 +285,8 @@ GtkSearchEntry.entry {
|
||||
border-color: transparent;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
background-color: rgba(245, 246, 247, 0);
|
||||
background-color: rgba(251, 251, 252, 0);
|
||||
border-color: rgba(207, 214, 230, 0);
|
||||
transition: none; }
|
||||
.button.flat:hover {
|
||||
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
|
@ -398,7 +398,8 @@ $_dot_color: $selected_bg_color;
|
||||
|
||||
&.flat {
|
||||
@include button(undecorated);
|
||||
background-color: transparentize($bg_color, 1);
|
||||
background-color: transparentize($button_bg, 1);
|
||||
border-color: transparentize($button_border, 1);
|
||||
// to avoid adiacent buttons borders clashing when transitioning, the transition on the normal state is set
|
||||
// to none, while it's added back in the hover state, so the button decoration will fade in on hover, but
|
||||
// it won't fade out when the pointer leave the button allocation area. To make the transition more evident
|
||||
|
Loading…
Reference in New Issue
Block a user