From 1620d6a7799ad0bd47714605c9a8e2fad9d562f1 Mon Sep 17 00:00:00 2001 From: Nishchay Kaushik Date: Mon, 31 Dec 2018 18:44:54 +0530 Subject: [PATCH 1/2] Button shadow change: add more spread on normal, reduce spread on active --- lib/button/theme.module.scss | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/lib/button/theme.module.scss b/lib/button/theme.module.scss index 05e459b6..37724aab 100644 --- a/lib/button/theme.module.scss +++ b/lib/button/theme.module.scss @@ -14,10 +14,11 @@ position: relative; text-align: center; text-decoration: none; - box-shadow: 0 1px 1px 2px rgba(0, 0, 0, 0.07), 0 2px 4px 0 rgba(163, 152, 152, 0.5), 0 3px 4px 0 rgba(168, 160, 160, 0.5); + transition: box-shadow 100ms linear; + box-shadow: -3px 6px 10px 0px rgba(168, 160, 160, 0.5); border-radius: 6px; &:active { - box-shadow: 0 1px 1px 2px rgba(0, 0, 0, 0.07), 0 2px 6px 0 rgba(163, 152, 152, 0.5), -5px 8px 10px 0 rgba(168, 160, 160, 0.5); + box-shadow: 0 1px 1px 2px rgba(0, 0, 0, 0.07), 0 2px 4px 0 rgba(163, 152, 152, 0.5), 0 3px 2px 0 rgba(168, 160, 160, 0.5); } &>.rippleWrapper { overflow: hidden; From 377d8814b14c33f3950aa5aab36b9d15058811c0 Mon Sep 17 00:00:00 2001 From: Nishchay Kaushik Date: Mon, 31 Dec 2018 18:51:28 +0530 Subject: [PATCH 2/2] Icon button change shadow styles --- lib/button/theme.module.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/lib/button/theme.module.scss b/lib/button/theme.module.scss index 37724aab..5ba45f85 100644 --- a/lib/button/theme.module.scss +++ b/lib/button/theme.module.scss @@ -48,9 +48,9 @@ justify-content: center !important; box-sizing: border-box; border-radius: 50%; - box-shadow: 0 2px 9px 0 rgba(0, 0, 0, 0.5) !important; + box-shadow: 0 2px 9px 4px $very-light-pink-75, 0 2px 4px 2px rgba(0, 0, 0, 0.5) !important; &:active { - box-shadow: 0 2px 9px 4px $very-light-pink-75, 0 2px 4px 2px rgba(0, 0, 0, 0.5) !important; + box-shadow: 0 2px 9px 0 rgba(0, 0, 0, 0.5) !important; } & > * { max-height: 30px;