mirror of
https://github.com/desktop/desktop
synced 2024-09-20 00:21:23 +00:00
Make transition to shadow less noticeable
This commit is contained in:
parent
a5cf091030
commit
621b6e7eed
|
@ -192,10 +192,11 @@ $overlay-background-color: rgba(0, 0, 0, 0.4);
|
|||
* for use when content can be expanded through other means than
|
||||
* scrolling. Used in conjuction with background-size, background-attachment, background-repeat.
|
||||
*/
|
||||
--no-shadow: #{linear-gradient($white, $white)};
|
||||
--no-shadow-top: #{linear-gradient($white, rgba(255, 255, 255, 0))};
|
||||
--no-shadow-bottom: #{linear-gradient(rgba(255, 255, 255, 0), $white)};
|
||||
--top-shadow: #{linear-gradient(0deg, rgba($white, 0) 0%, rgba($gray-200, 0.6) 90%, rgba($gray-200, 1) 100%)};
|
||||
--bottom-shadow: #{linear-gradient(180deg, rgba($white, 0) 0%, rgba($gray-200, 0.6) 90%, rgba($gray-200, 1) 100%) 0 100%};
|
||||
--box-overflow-shadow-background-two: #{var(--no-shadow), var(--no-shadow) 0 100%, var(--top-shadow), var(--bottom-shadow)};
|
||||
--box-overflow-shadow-background-two: #{var(--no-shadow-top), var(--no-shadow-bottom) 0 100%, var(--top-shadow), var(--bottom-shadow)};
|
||||
|
||||
/**
|
||||
* Text color for selected boxes with active keyboard focus
|
||||
|
|
|
@ -157,10 +157,11 @@ body.theme-dark {
|
|||
* for use when content can be expanded through other means than
|
||||
* scrolling. Used in conjuction with background-size, background-attachment, background-repeat.
|
||||
*/
|
||||
--no-shadow: #{linear-gradient($gray-900, $gray-900)};
|
||||
--no-shadow-top: #{linear-gradient($gray-900, rgba(255, 255, 255, 0))};
|
||||
--no-shadow-bottom: #{linear-gradient(rgba(255, 255, 255, 0), $gray-900)};
|
||||
--top-shadow: #{linear-gradient(0deg, rgba($gray-900, 0) 0%, rgba(black, 0.6) 90%, rgba(black, 1) 100%)};
|
||||
--bottom-shadow: #{linear-gradient(180deg, rgba($gray-900, 0) 0%, rgba(black, 0.6) 90%, rgba(black, 1) 100%) 0 100%};
|
||||
--box-overflow-shadow-background-two: #{var(--no-shadow), var(--no-shadow) 0 100%, var(--top-shadow), var(--bottom-shadow)};
|
||||
--box-overflow-shadow-background-two: #{var(--no-shadow-top), var(--no-shadow-bottom) 0 100%, var(--top-shadow), var(--bottom-shadow)};
|
||||
|
||||
/**
|
||||
* Placeholder color for input boxes
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
overflow-y: auto;
|
||||
background: var(--box-overflow-shadow-background-two);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 30px, 100% 30px, 100% 30px, 100% 30px;
|
||||
background-size: 100% 30px, 100% 30px, 100% 15px, 100% 15px;
|
||||
background-attachment: local, local, scroll, scroll;
|
||||
padding: var(--spacing);
|
||||
padding-top: 0;
|
||||
|
|
Loading…
Reference in a new issue