[gtk+] Adwaita: add a transition to the switch slider
- From: Lapo Calamandrei <lapo src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gtk+] Adwaita: add a transition to the switch slider
- Date: Sun, 20 Mar 2016 23:47:18 +0000 (UTC)
commit eacd632e5e759e13dc9770356fa4e9d29fa50939
Author: Lapo Calamandrei <calamandrei gmail com>
Date: Mon Mar 21 00:44:47 2016 +0100
Adwaita: add a transition to the switch slider
gtk/theme/Adwaita/_common.scss | 16 +++++++++++-----
gtk/theme/Adwaita/gtk-contained-dark.css | 2 ++
gtk/theme/Adwaita/gtk-contained.css | 2 ++
3 files changed, 15 insertions(+), 5 deletions(-)
---
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index 7c45aa4..ae6c941 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -5,6 +5,7 @@
$ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
$asset_suffix: if($variant=='dark', '-dark', '');
$backdrop_transition: 200ms ease-out;
+$button_transition: all 200ms $ease-out-quad;
* {
padding: 0;
@@ -437,14 +438,13 @@ $_dot_color: if($variant=='light', $selected_bg_color,
button {
@at-root %button_basic, & {
- $_button_transition: all 200ms $ease-out-quad;
min-height: 24px;
min-width: 16px;
padding: 4px 8px;
border: 1px solid;
border-radius: 3px;
- transition: $_button_transition;
+ transition: $button_transition;
@include button(normal);
@@ -457,10 +457,10 @@ button {
transition: none;
&:hover {
- transition: $_button_transition;
+ transition: $button_transition;
transition-duration: 500ms;
- &:active { transition: $_button_transition; }
+ &:active { transition: $button_transition; }
}
}
@@ -2459,6 +2459,8 @@ switch {
min-height: 27px;
border: 1px solid;
border-radius: 3px;
+ transition: $button_transition;
+
@include button(normal-alt, $edge: $shadow_color);
}
@@ -2469,7 +2471,11 @@ switch {
&:disabled slider { @include button(insensitive); }
&:backdrop {
- slider { @include button(backdrop); }
+ slider {
+ transition: $backdrop_transition;
+
+ @include button(backdrop);
+ }
&:active slider { border-color: if($variant == 'light', $selected_bg_color, $selected_borders_color); }
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index 2a3abaa..400fb16 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -2444,6 +2444,7 @@ switch {
min-height: 27px;
border: 1px solid;
border-radius: 3px;
+ transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
color: #eeeeec;
outline-color: rgba(238, 238, 236, 0.3);
border-color: #1c1f1f;
@@ -2468,6 +2469,7 @@ switch {
switch:disabled slider label, switch:disabled slider {
color: #949796; }
switch:backdrop slider {
+ transition: 200ms ease-out;
border-color: #1f2222;
background-image: linear-gradient(to bottom, #393f3f);
text-shadow: none;
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index 77c0002..7baa9a7 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -2457,6 +2457,7 @@ switch {
min-height: 27px;
border: 1px solid;
border-radius: 3px;
+ transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
color: #2e3436;
outline-color: rgba(46, 52, 54, 0.3);
border-color: #9d9d99;
@@ -2481,6 +2482,7 @@ switch {
switch:disabled slider label, switch:disabled slider {
color: #8b8e8f; }
switch:backdrop slider {
+ transition: 200ms ease-out;
border-color: #a5a5a1;
background-image: linear-gradient(to bottom, #e8e8e7);
text-shadow: none;
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]