Skip to content

Instantly share code, notes, and snippets.

@ViliamKopecky
Created June 6, 2018 07:33
Show Gist options
  • Save ViliamKopecky/37289938563223ec6370696b414e190c to your computer and use it in GitHub Desktop.
Save ViliamKopecky/37289938563223ec6370696b414e190c to your computer and use it in GitHub Desktop.
Custom overscroll colors for top and bottom sides of a page
=overscrolls($topColor, $bottomColor, $darken: 10%)
@if $topColor
body::before
content: ''
position: fixed
right: 0
left: 0
z-index: -1
top: -50%
bottom: 50%
@if $darken
background: $topColor linear-gradient($topColor 50%, darken($topColor, $darken))
@else
background: $topColor
@if $bottomColor
body::after
content: ''
position: fixed
right: 0
left: 0
z-index: -1
top: 50%
bottom: -50%
@if $darken
background: $bottomColor linear-gradient(darken($bottomColor, $darken), $bottomColor 50%)
@else
background: $bottomColor
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment