quasar-framework/src/vue-components/parallax/parallax.mat.styl

Simultaneously build desktop/mobile SPA websites & phone/tablet apps with VueJS

$paralax-text-shadow ?= 0 0 5px white

.quasar-parallax
  position relative
  width 100%
  overflow hidden

.quasar-parallax-image
  position absolute
  top 0
  right 0
  bottom 0
  left 0

  img
    visibility hidden
    position absolute
    left 50%
    bottom 0
    min-width 100%
    min-height 100%
    z-index -1

    &.ready
      visibility visible

.quasar-parallax-text
  text-shadow $paralax-text-shadow