Contents

@use "variables" as *;

.scrim {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: $scrim-background;
  z-index: -1;
  opacity: 0;

  &[data-hide-animating] {
    animation: fade-out;
    animation-duration: $duration;
    animation-fill-mode: forwards;
  }

  &[data-show-animating] {
    animation: fade-in;
    animation-duration: $duration;
    animation-fill-mode: forwards;
  }
}

.scrim[data-scrim-open-value="true"] {
  opacity: 1;
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

Version data entries

22 entries across 22 versions & 1 rubygems

Version	Path
katalyst-kpop-3.0.0.beta.2	app/assets/stylesheets/katalyst/kpop/_scrim.scss
katalyst-kpop-3.0.0.beta.1	app/assets/stylesheets/katalyst/kpop/_scrim.scss