From 85138a0fff448012c9fcff4a911ac83e1851b045 Mon Sep 17 00:00:00 2001 From: Khurshid Alam Date: Sun, 5 Feb 2017 10:39:36 +0530 Subject: [PATCH] [Gtk-3.22][Button-Redesign] Spinbutton: Fixing color and entry border --- src/gtk-3.20/scss/widgets/_button.scss | 30 +++++++++++++++++++------- src/gtk-3.20/scss/widgets/_entry.scss | 15 ++++++++----- 2 files changed, 32 insertions(+), 13 deletions(-) diff --git a/src/gtk-3.20/scss/widgets/_button.scss b/src/gtk-3.20/scss/widgets/_button.scss index 0e166da..785d531 100644 --- a/src/gtk-3.20/scss/widgets/_button.scss +++ b/src/gtk-3.20/scss/widgets/_button.scss @@ -273,12 +273,12 @@ $border_strength: if(lightness($bg) > 50, 0, .1); $shadow_strength: if(lightness($bg) > 50, 0, .1); - $button_bg: if(lightness($bg) > 50, shade($bg, 1.08), shade($bg, 1.2)); + $button_bg: if(lightness($bg) > 50, $bg, shade($bg, 1.2)); @extend %button; @if (lightness($button_bg) > 50) { border-color: border_normal($button_bg); - @include linear-gradient($button_bg, 1.08); + @include linear-gradient(shade($button_bg, 1.08)); } @else { @include linear-gradient($button_bg); @include border(rgba(0, 0, 0, .12 + $border_strength)); @@ -298,7 +298,7 @@ &:focus, &:hover { @if (lightness($button_bg) > 50) { border-color: border_active($button_bg); - @include linear-gradient(shade($button_bg, 1.10)); + @include linear-gradient(shade($button_bg, 1.11)); } @else { @include linear-gradient(shade($button_bg, 1.2)); @include border(rgba(0, 0, 0, .2 + $border_strength)); @@ -417,9 +417,16 @@ } &:not(.vertical) { - @extend %entry; - @include linear-gradient($base_color, to top); - border-color: border_normal($base_color); + @if (lightness($bg_color) > 50) { + border: 1px solid border_normal($bg_color); + background-color: transparent; + background-image: none; + box-shadow: inset 1px 0 shade($base_color, .9); + } @else { + @extend %entry; + @include linear-gradient($base_color, to top); + @include border($base_color); + } padding: 0; @@ -444,11 +451,18 @@ border-radius: 0; border-color: alpha($borders_color, .8); border-style: none none none solid; - background-color: shade($bg_color, 1.08); background-image: none; box-shadow: none; - &:hover { background-color: shade($bg_color, 1.2); } + @if (lightness($bg_color) > 50) { + background-color: shade($bg_color, 1.08); + } + + &:hover { + @if (lightness($bg_color) > 50) { + background-color: shade($bg_color, 1.11); + } + } &:dir(rtl) { border-style: none solid none none; } diff --git a/src/gtk-3.20/scss/widgets/_entry.scss b/src/gtk-3.20/scss/widgets/_entry.scss index 11bd047..baa07e4 100644 --- a/src/gtk-3.20/scss/widgets/_entry.scss +++ b/src/gtk-3.20/scss/widgets/_entry.scss @@ -90,11 +90,16 @@ border-width: 1px; border-style: solid; border-radius: $roundness; - transition: border 150ms ease; - box-shadow: inset 1px 1px alpha($dark_shadow, .06), - inset -1px 0 alpha($dark_shadow, .06); + border-color: border_normal($bg_color); + transition: border 100ms ease-out; + &:focus, &:hover, &:active { transition: border 100ms ease-in; } + + box-shadow: inset 1px 0 alpha($dark_shadow, 0.10), + inset 0 1px alpha($dark_shadow, 0.12), + inset -1px 0 alpha($dark_shadow, 0.10), + inset 0 -1px alpha($dark_shadow, 0.05); + - &:focus, &:hover, &:active { transition: none; } &:selected { &, &:selected:focus { @@ -149,7 +154,7 @@ @mixin entry($bg, $fg, $border: $borders_color) { @extend %entry; @include linear-gradient($bg, to top); - @include border($bg); + border-color: border_normal($bg); padding: $spacing;