Sha256: d2e0e57f8d0a33fafdc8fac6fb131becbf72b5400d0681f53b7cd2afe8a5ca53

Contents?: true

Size: 1.17 KB

Versions: 1

Compression:

Stored size: 1.17 KB

Contents

.hover-tile-outer
  ///////////////////////////////////////////////////////////////////////////////////
  $base-border-color: gainsboro !default
  $base-line-height: 1.5em !default
  $medium-screen: em(640) !default
  h4
    margin: 0
  p
    line-height: $base-line-height
  //////////////////////////////////////////////////////////////////////////////////
  $hover-tile-height: 10em
  background: url("https://raw.githubusercontent.com/thoughtbot/refills/master/source/images/mountains.png")
  background-position: top
  background-size: cover
  background-color: beige
  border: 1px solid $base-border-color
  cursor: pointer
  height: $hover-tile-height
  margin-bottom: $base-line-height
  +media($medium-screen)
    width: 40%

  .hover-tile-container
    height: $hover-tile-height
    overflow: hidden
  .hover-tile-container:hover > .hover-tile
    +transform(translate(0, -100%))
  .hover-tile
    +transition(all, 0.2s ease-in-out)
    background: inherit
    color: white
    height: inherit
    overflow: hidden
    padding: $base-spacing
  .hover-tile-hidden
    background: transparentize(#000, 0.5)
    p
      color: transparentize(#fff, 0.3)
    h4
      margin-bottom: 0.5em

Version data entries

1 entries across 1 versions & 1 rubygems

Version Path
breezeblocks-0.0.1 source/stylesheets/breezeblocks/_hover-tile-animation.sass