CSS Animations
This commit is contained in:
@@ -10,7 +10,7 @@
|
||||
<div>
|
||||
<div v-if="myel.type === shared_consts.ELEMTYPE.TEXT">
|
||||
<div
|
||||
:class="myel.class + (editOn ? ` clEdit` : ``) + getClass()"
|
||||
:class="myel.class + (editOn ? ` clEdit` : ``) + getClass() + ` `+ myel.class_anim"
|
||||
@click="clickOnElem"
|
||||
>
|
||||
{{ myel.container }}
|
||||
@@ -27,7 +27,7 @@
|
||||
<div v-for="(rec, ind) in myel.listcards" :key="ind" >
|
||||
<q-card :class="`my-card center_img bordered ` + myel.class3"
|
||||
:style="rec.style">
|
||||
<q-img :src="getImgFileByElem(myel, rec)" />
|
||||
<q-img :class="myel.class_anim" :src="tools.getImgFileByElem(myel, rec)" />
|
||||
<q-card-section>
|
||||
<div :class="` ` + rec.size" :style="`color: ` + rec.color">
|
||||
{{ rec.alt }}
|
||||
@@ -61,7 +61,7 @@
|
||||
<!--<q-slide-transition>
|
||||
<div v-show="expanded">
|
||||
<q-separator />
|
||||
<q-card-section class="text-subitle2">
|
||||
<q-card-section class="text-subtitle2">
|
||||
|
||||
</q-card-section>
|
||||
</div>
|
||||
@@ -84,7 +84,7 @@
|
||||
<div v-else-if="myel.type === shared_consts.ELEMTYPE.TITLE">
|
||||
<div>
|
||||
<div
|
||||
:class="myel.class + (editOn ? ` clEdit` : ``) + getClass()"
|
||||
:class="myel.class + (editOn ? ` clEdit` : ``) + getClass()+ ` `+ myel.class_anim"
|
||||
@click="clickOnElem"
|
||||
>
|
||||
<CTitle
|
||||
@@ -100,22 +100,51 @@
|
||||
<div v-else-if="myel.type === shared_consts.ELEMTYPE.IMGTITLE">
|
||||
<div>
|
||||
<div
|
||||
:class="myel.class + (editOn ? ` clEdit` : ``) + getClass()"
|
||||
:class="myel.class + (editOn ? ` clEdit` : ``) + getClass() + ` `+ myel.class_anim"
|
||||
@click="clickOnElem"
|
||||
>
|
||||
<CImgTitle
|
||||
v-if="myel.container"
|
||||
:src="myel.container"
|
||||
:title="myel.title"
|
||||
v-if="myel.image"
|
||||
:src="tools.getImgFileByElem(myel, rec)"
|
||||
:title="myel.container"
|
||||
:legendinside="myel.container2"
|
||||
>
|
||||
</CImgTitle>
|
||||
</div>
|
||||
</div>
|
||||
</div> <div v-else-if="myel.type === shared_consts.ELEMTYPE.IMGPOSTER">
|
||||
<div>
|
||||
<div
|
||||
:class="myel.class + (editOn ? ` clEdit` : ``) + getClass()"
|
||||
@click="clickOnElem"
|
||||
>
|
||||
<CImgPoster
|
||||
v-if="myel.image"
|
||||
:src="tools.getImgFileByElem(myel, rec)"
|
||||
:title="myel.container"
|
||||
:myheight="myel.heightimg"
|
||||
:colorTitle="myel.color"
|
||||
:classTitle="myel.class4"
|
||||
:vertalign="myel.vertalign"
|
||||
:speed="myel.speed"
|
||||
:classSubtitle="myel.class3"
|
||||
:colorSubtitle="myel.colorsub"
|
||||
:legendinside="myel.container2"
|
||||
:logo="tools.getImgFileByFilename(myel, myel.container3)"
|
||||
:logoheight="myel.height"
|
||||
:logowidth="myel.width"
|
||||
:fit="myel.fit"
|
||||
:class_anim="myel.class_anim"
|
||||
:class_anim2="myel.class_anim2"
|
||||
>
|
||||
</CImgPoster>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="myel.type === shared_consts.ELEMTYPE.HTML">
|
||||
<div>
|
||||
<div
|
||||
:class="myel.class + (editOn ? ` clEdit` : ``) + getClass()"
|
||||
:class="myel.class + (editOn ? ` clEdit` : ``) + getClass() + ` `+ myel.class_anim"
|
||||
@click="clickOnElem"
|
||||
v-html="myel.containerHtml"
|
||||
></div>
|
||||
@@ -124,11 +153,11 @@
|
||||
<div v-else-if="myel.type === shared_consts.ELEMTYPE.IMAGE">
|
||||
<div class="text-center">
|
||||
<div
|
||||
:class="myel.class + (editOn ? ` clEdit` : ``) + getClass()"
|
||||
:class="myel.class + (editOn ? ` clEdit` : ``) + getClass() + ` `+ myel.class_anim"
|
||||
@click="clickOnElem"
|
||||
>
|
||||
<q-img
|
||||
:src="getImgFileByElem(myel.container)"
|
||||
:src="tools.getImgFileByElem(myel.image)"
|
||||
:fit="myel.fit"
|
||||
class="img"
|
||||
:width="myel.widthimg ? myel.widthimg : undefined"
|
||||
@@ -141,11 +170,11 @@
|
||||
<div v-else-if="myel.type === shared_consts.ELEMTYPE.IMAGEUPLOAD">
|
||||
<div class="text-center">
|
||||
<div
|
||||
:class="myel.class + (editOn ? ` clEdit` : ``) + getClass()"
|
||||
:class="myel.class + (editOn ? ` clEdit` : ``) + getClass() + ` `+ myel.class_anim"
|
||||
@click="clickOnElem"
|
||||
>
|
||||
<q-img
|
||||
:src="getImgFileByElem(myel)"
|
||||
:src="tools.getImgFileByElem(myel)"
|
||||
:fit="myel.fit"
|
||||
class="img"
|
||||
:width="myel.widthimg ? myel.widthimg : undefined"
|
||||
|
||||
Reference in New Issue
Block a user