<template>
  <div class="poster_shadows shadow-3">

    <q-parallax
      :speed="speed ? speed : 1"
      :height="myheight"
    >
      <template v-slot:media>
        <img
          :class="tools.getClassAnim(anim)"
          :src="getsrc()"
        />
      </template>

      <template v-slot:content="scope">
        <div
          :class="`column items-center ` + myclass()"
          :style="{
            opacity: 0.45 + (1 - scope.percentScrolled) * 0.55,
          }"
        >
          <img
            v-if="logo"
            :src="logo"
            :class="tools.getClassAnim(anim)"
            :style="
              logowidth
                ? `width: ` + logowidth + `px !important; + `
                : undefined
                ? ` height: ` + logoheight + `px !important`
                : undefined
            "
          />
          <div v-for="(rec, index) in elemsText" :key="index">
            <div
              v-if="rec"
              :class="
                rec.class + ` ` + rec.size + ` ` + tools.getClassAnim(rec.anim)
              "
              :style="` color:` + rec.color"
              v-html="rec.text"
            ></div>
          </div>
        </div>
      </template>
    </q-parallax>
  </div>
</template>

<script lang="ts" src="./CImgPoster.ts">
</script>
<style lang="scss" scoped>
@import './CImgPoster.scss';
</style>
