Sha256: c564d5bef873977da08aa1e30946e0ee0f39a4518bfa323f4db002c47cf8896b

Contents?: true

Size: 911 Bytes

Versions: 41

Compression:

Stored size: 911 Bytes

Contents

+keyframes(noise-anim)
  $steps: 20
  @for $i from 0 through $steps
    #{percentage($i * 1 / $steps)}
      clip: rect(random(100) + px, 9999px, random(100) + px, 0)
+keyframes(noise-anim-2)
  $steps: 20
  @for $i from 0 through $steps
    #{percentage($i * 1 / $steps)}
      clip: rect(random(100) + px, 9999px, random(100) + px, 0)

=glitch($cl: white, $bg-col: black)
  +relative
  overflow: hidden
  +inline-block
  color: $cl
  &:after,
  &:before
    content: attr(data-text)
    color: $cl
    background-color: $bg-col
    overflow: hidden
    clip: rect(0, 900px, 0, 0)
  &:after
    +absolute(left 1px, top 0)
    +text-shadow(-1px 0 0 rgba(red, 0.4))
    +experimental('animation', noise-anim 2s infinite linear alternate-reverse)
  &:before
    +absolute(left -1px, top 0)
    +text-shadow(1px 0 0 rgba(blue, 0.4))
    +experimental('animation', noise-anim-2 3s infinite linear alternate-reverse)

Version data entries

41 entries across 41 versions & 2 rubygems

Version Path
middleman-oulu-0.5.37 assets/stylesheets/options/glitch/_glitch.sass
oulu-rails-0.5.37 vendor/assets/stylesheets/options/glitch/_glitch.sass
middleman-oulu-0.5.36 assets/stylesheets/options/glitch/_glitch.sass
middleman-oulu-0.5.35 assets/stylesheets/options/glitch/_glitch.sass
oulu-rails-0.5.34 vendor/assets/stylesheets/options/glitch/_glitch.sass
oulu-rails-0.5.33 vendor/assets/stylesheets/options/glitch/_glitch.sass
middleman-oulu-0.5.32 assets/stylesheets/options/glitch/_glitch.sass
oulu-rails-0.5.32 vendor/assets/stylesheets/options/glitch/_glitch.sass
middleman-oulu-0.5.31 assets/stylesheets/options/glitch/_glitch.sass
oulu-rails-0.5.31 vendor/assets/stylesheets/options/glitch/_glitch.sass
middleman-oulu-0.5.30 assets/stylesheets/options/glitch/_glitch.sass
oulu-rails-0.5.30 vendor/assets/stylesheets/options/glitch/_glitch.sass
oulu-rails-0.5.29 vendor/assets/stylesheets/options/glitch/_glitch.sass
middleman-oulu-0.5.28 assets/stylesheets/options/glitch/_glitch.css.sass
middleman-oulu-0.5.27 assets/stylesheets/options/glitch/_glitch.css.sass
oulu-rails-0.5.27 vendor/assets/stylesheets/options/glitch/_glitch.css.sass
middleman-oulu-0.5.25 assets/stylesheets/options/glitch/_glitch.css.sass
oulu-rails-0.5.25 vendor/assets/stylesheets/options/glitch/_glitch.css.sass
oulu-rails-0.5.24 vendor/assets/stylesheets/options/glitch/_glitch.css.sass
oulu-rails-0.5.23 vendor/assets/stylesheets/options/glitch/_glitch.css.sass