CSS Animations
This commit is contained in:
Surya Paolo
@@ -32,6 +32,7 @@
|
||||
"@vuelidate/core": "^2.0.0",
|
||||
"@vuelidate/validators": "^2.0.0",
|
||||
"acorn": "^8.8.1",
|
||||
"animate.css": "^4.1.1",
|
||||
"autoprefixer": "^10.4.13",
|
||||
"axios": "^1.1.3",
|
||||
"bcryptjs": "^2.4.3",
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
* the ES6 features that are supported by your Node version. https://node.green/
|
||||
*/
|
||||
|
||||
// Configuration for your app
|
||||
// Configuration for your appanimated
|
||||
// https://v2.quasar.dev/quasar-cli/quasar-conf-js
|
||||
|
||||
/* eslint-env node */
|
||||
@@ -248,9 +248,9 @@ module.exports = configure((ctx) => ({
|
||||
lang: 'it', // Quasar language
|
||||
},
|
||||
|
||||
// animations: 'all', // --- includes all animations
|
||||
animations: 'all', // --- includes all animations
|
||||
// https://v2.quasar.dev/options/animations
|
||||
animations: [],
|
||||
// animations: [],
|
||||
|
||||
// https://v2.quasar.dev/quasar-cli/developing-ssr/configuring-ssr
|
||||
ssr: {
|
||||
|
||||
@@ -1192,6 +1192,10 @@ export const shared_consts = {
|
||||
value: 8,
|
||||
label: 'ImgTitolo',
|
||||
},
|
||||
{
|
||||
value: 9,
|
||||
label: 'Img Poster',
|
||||
},
|
||||
{
|
||||
value: 10,
|
||||
label: 'Testo',
|
||||
@@ -1263,6 +1267,7 @@ export const shared_consts = {
|
||||
MARGINI: 6,
|
||||
CARD: 7,
|
||||
IMGTITLE: 8,
|
||||
IMGPOSTER: 9,
|
||||
TEXT: 10,
|
||||
HTML: 20,
|
||||
IMAGE: 30,
|
||||
@@ -1288,6 +1293,15 @@ export const shared_consts = {
|
||||
RIGHT: 3,
|
||||
},
|
||||
|
||||
VERTALIGNTYPE: {
|
||||
NONE: 0,
|
||||
UP: 1,
|
||||
CENTER: 2,
|
||||
DOWN: 3,
|
||||
DOWN_LEFT: 4,
|
||||
UP_LEFT: 5,
|
||||
},
|
||||
|
||||
|
||||
getStatusStr(status: number) {
|
||||
const trovatorec = this.OrderStatusStr.find((rec) => rec.value === status)
|
||||
|
||||
128
src/components/CImgPoster/CImgPoster.scss
Executable file
128
src/components/CImgPoster/CImgPoster.scss
Executable file
@@ -0,0 +1,128 @@
|
||||
.imgtitle {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
/* flex-flow: row nowrap; */
|
||||
|
||||
padding: 1rem 0 1rem 0;
|
||||
margin: .125rem;
|
||||
|
||||
* {
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
&__img {
|
||||
min-width: 250px;
|
||||
}
|
||||
|
||||
&__imgh100 {
|
||||
max-height: 100px;
|
||||
}
|
||||
|
||||
&__imgh150 {
|
||||
max-height: 150px;
|
||||
}
|
||||
|
||||
&__imgw150 {
|
||||
max-width: 150px;
|
||||
}
|
||||
|
||||
&__imgw100 {
|
||||
max-width: 100px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 718px) {
|
||||
|
||||
// PER VERSIONE MOBILE
|
||||
.landing>section.padding_testo {
|
||||
padding-top: 0.5rem;
|
||||
padding-bottom: 0.1rem;
|
||||
}
|
||||
|
||||
.imgtitle {
|
||||
padding: 0.25rem 0 0.25rem 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.landing>section.padding_testo {
|
||||
padding-top: 1rem;
|
||||
padding-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.section_text {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 3rem;
|
||||
padding: 4px 20px 4px 20px;
|
||||
text-shadow: .2rem .2rem .2rem #3d3d3d;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-size: 1.25rem;
|
||||
padding: 4px 20px 4px 20px;
|
||||
text-shadow: .1rem .1rem .1rem #3d3d3d;
|
||||
}
|
||||
|
||||
@media (max-width: 400px) {
|
||||
.title {
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.mylegendinside {
|
||||
font-size: 1rem;
|
||||
margin-bottom: 50px;
|
||||
opacity: .8;
|
||||
|
||||
}
|
||||
|
||||
.mylegend {
|
||||
text-align: center;
|
||||
color: black;
|
||||
font-size: 1rem;
|
||||
font-style: italic;
|
||||
opacity: .8;
|
||||
text-shadow: .05rem .05rem .05rem #aeaeae;
|
||||
z-index: 1000;
|
||||
|
||||
@media (max-width: 400px) {}
|
||||
}
|
||||
|
||||
.align_top {
|
||||
top: 100px;
|
||||
margin-bottom: auto;
|
||||
}
|
||||
|
||||
.align_top_left {
|
||||
top: 50px;
|
||||
left: 20px;
|
||||
margin-right: auto;
|
||||
margin-bottom: auto;
|
||||
}
|
||||
|
||||
.align_middle {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.align_bottom {
|
||||
margin-bottom: 30px;
|
||||
margin-top: auto;
|
||||
}
|
||||
|
||||
.align_bottom_left {
|
||||
margin-bottom: 20px;
|
||||
left: 20px;
|
||||
margin-right: auto;
|
||||
margin-top: auto;
|
||||
}
|
||||
102
src/components/CImgPoster/CImgPoster.ts
Executable file
102
src/components/CImgPoster/CImgPoster.ts
Executable file
@@ -0,0 +1,102 @@
|
||||
import { defineComponent, ref } from 'vue'
|
||||
|
||||
import { tools } from '@src/store/Modules/tools'
|
||||
import { shared_consts } from '@src/common/shared_vuejs'
|
||||
|
||||
export default defineComponent({
|
||||
name: 'CImgPoster',
|
||||
props: {
|
||||
src: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: '',
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: '',
|
||||
},
|
||||
myheight: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: '',
|
||||
},
|
||||
myheightmobile: {
|
||||
type: Number,
|
||||
required: false,
|
||||
default: 0,
|
||||
},
|
||||
legendinside: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: '',
|
||||
},
|
||||
legend: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: '',
|
||||
},
|
||||
classTitle: String,
|
||||
classSubtitle: String,
|
||||
colorTitle: String,
|
||||
colorSubtitle: String,
|
||||
vertalign: Number,
|
||||
speed: {
|
||||
type: Number,
|
||||
required: false,
|
||||
default: 1
|
||||
},
|
||||
class_anim: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: ''
|
||||
},
|
||||
class_anim2: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: ''
|
||||
},
|
||||
logo: String,
|
||||
logoheight: String,
|
||||
logowidth: String,
|
||||
fit: String,
|
||||
},
|
||||
|
||||
setup(props) {
|
||||
function getsrc(): string {
|
||||
const filefull = tools.getimgFullpathbysize(props.src)
|
||||
|
||||
return tools.getimgbysize(filefull.path, filefull.file)
|
||||
}
|
||||
|
||||
function getaltimg(): string {
|
||||
const filefull = tools.getimgFullpathbysize(props.src)
|
||||
return tools.getaltimg(filefull.path, filefull.file, props.title)
|
||||
}
|
||||
|
||||
function myclass() {
|
||||
let mycl = ''
|
||||
if (props.vertalign === shared_consts.VERTALIGNTYPE.UP) {
|
||||
mycl += ' align_top'
|
||||
} else if (props.vertalign === shared_consts.VERTALIGNTYPE.CENTER) {
|
||||
mycl += ' align_middle'
|
||||
} else if (props.vertalign === shared_consts.VERTALIGNTYPE.DOWN) {
|
||||
mycl += ' align_bottom'
|
||||
} else if (props.vertalign === shared_consts.VERTALIGNTYPE.DOWN_LEFT) {
|
||||
mycl += ' align_bottom_left'
|
||||
} else if (props.vertalign === shared_consts.VERTALIGNTYPE.UP_LEFT) {
|
||||
mycl += ' align_top_left'
|
||||
}
|
||||
|
||||
return mycl
|
||||
}
|
||||
|
||||
return {
|
||||
getsrc,
|
||||
getaltimg,
|
||||
myclass,
|
||||
tools,
|
||||
}
|
||||
},
|
||||
|
||||
})
|
||||
55
src/components/CImgPoster/CImgPoster.vue
Executable file
55
src/components/CImgPoster/CImgPoster.vue
Executable file
@@ -0,0 +1,55 @@
|
||||
<template>
|
||||
<div class="poster_shadows shadow-3">
|
||||
<q-parallax
|
||||
:src="getsrc()"
|
||||
:speed="speed ? speed : 1"
|
||||
:height="myheight ? myheight : undefined"
|
||||
>
|
||||
<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"
|
||||
:style="
|
||||
logowidth
|
||||
? `width: ` + logowidth + `px; + `
|
||||
: undefined + logoheight
|
||||
? ` height: ` + logoheight + `px`
|
||||
: undefined
|
||||
"
|
||||
/>
|
||||
<div :class="classTitle + ` ` + class_anim" :style="` color:` + colorTitle">
|
||||
{{ title }}
|
||||
</div>
|
||||
<div
|
||||
v-if="legendinside"
|
||||
:class="classSubtitle + ` ` + class_anim2"
|
||||
:style="` color:` + colorSubtitle"
|
||||
v-html="legendinside"
|
||||
></div>
|
||||
</div>
|
||||
</template>
|
||||
<div>
|
||||
<!--<q-img
|
||||
v-if="logo"
|
||||
:src="tools.getImgFileByElem(logo)"
|
||||
:fit="fit"
|
||||
class="img"
|
||||
:width="logowidth ? logowidth : undefined"
|
||||
:height="logoheight ? logoheight : undefined"
|
||||
></q-img>-->
|
||||
</div>
|
||||
</q-parallax>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" src="./CImgPoster.ts">
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import './CImgPoster.scss';
|
||||
</style>
|
||||
1
src/components/CImgPoster/index.ts
Executable file
1
src/components/CImgPoster/index.ts
Executable file
@@ -0,0 +1 @@
|
||||
export { default as CImgPoster } from './CImgPoster.vue'
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<q-parallax :src="getsrc()" :height="tools.myheight_imgtitle(myheight, myheightmobile)">
|
||||
<q-parallax :src="getsrc()" :height="myheight ? tools.myheight_imgtitle(myheight, myheightmobile) : undefined">
|
||||
<h1 class="text-white title" style="text-align: center" >{{title}}</h1>
|
||||
<div v-if="legendinside" class="mylegendinside absolute-bottom custom-caption" style="text-align: center" v-html="legendinside"></div>
|
||||
</q-parallax>
|
||||
|
||||
@@ -5,7 +5,8 @@ import {
|
||||
import { IImgGallery, ILabelValue, IMyCard, IMyElem, IMyPage, IOperators } from '@src/model'
|
||||
import { useGlobalStore } from '@store/globalStore'
|
||||
|
||||
import { CImgTitle } from '../CImgTitle/index'
|
||||
import { CImgTitle } from '@/components/CImgTitle'
|
||||
import { CImgPoster } from '@/components/CImgPoster'
|
||||
import { CTitle } from '@/components/CTitle/index'
|
||||
import { tools } from '@store/Modules/tools'
|
||||
import { shared_consts } from '@/common/shared_vuejs'
|
||||
@@ -17,6 +18,7 @@ import { CMyPageIntro } from '@src/components/CMyPageIntro'
|
||||
import { CEventsCalendar } from '@src/components/CEventsCalendar'
|
||||
import { CMyEditor } from '@src/components/CMyEditor'
|
||||
import { CMyFieldRec } from '@src/components/CMyFieldRec'
|
||||
import { CSelectImage } from '@src/components/CSelectImage'
|
||||
import { CSelectColor } from '@src/components/CSelectColor'
|
||||
import { CSelectFontSize } from '@src/components/CSelectFontSize'
|
||||
|
||||
@@ -33,7 +35,7 @@ export default defineComponent({
|
||||
components: {
|
||||
CImgTitle, CTitle, LandingFooter, CEventsCalendar,
|
||||
CCardCarousel, COpenStreetMap, CMyPage, CMyPageIntro, CMyEditor, CMyFieldRec,
|
||||
CSelectColor, CSelectFontSize
|
||||
CSelectColor, CSelectFontSize, CSelectImage, CImgPoster
|
||||
},
|
||||
emits: ['saveElem'],
|
||||
props: {
|
||||
@@ -234,12 +236,26 @@ export default defineComponent({
|
||||
}
|
||||
})
|
||||
}
|
||||
} else if ((props.myelem.type === shared_consts.ELEMTYPE.IMGTITLE) ||
|
||||
(props.myelem.type === shared_consts.ELEMTYPE.IMAGE)) {
|
||||
myel.value.image = myval
|
||||
}
|
||||
modifElem()
|
||||
}
|
||||
|
||||
function showAnimation() {
|
||||
return (myel.value.type === shared_consts.ELEMTYPE.IMAGE)
|
||||
|| (myel.value.type === shared_consts.ELEMTYPE.IMGTITLE)
|
||||
|| (myel.value.type === shared_consts.ELEMTYPE.TEXT)
|
||||
|| (myel.value.type === shared_consts.ELEMTYPE.HTML)
|
||||
|| (myel.value.type === shared_consts.ELEMTYPE.CAROUSEL_IMGS)
|
||||
}
|
||||
|
||||
function updateElem(myvalue: any) {
|
||||
myel.value = myvalue
|
||||
console.log('updateElem', myvalue)
|
||||
if (myel.value.type === shared_consts.ELEMTYPE.IMGTITLE) {
|
||||
myel.value.container = myvalue
|
||||
}
|
||||
modifElem()
|
||||
}
|
||||
|
||||
@@ -276,6 +292,7 @@ export default defineComponent({
|
||||
delRecCard,
|
||||
saveCard,
|
||||
updateElem,
|
||||
showAnimation,
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@@ -69,26 +69,6 @@
|
||||
>
|
||||
</q-btn>
|
||||
</q-bar>
|
||||
<div class="row">
|
||||
<q-input
|
||||
label="Width:"
|
||||
@update:model-value="modifElem"
|
||||
v-model="myel.widthimg"
|
||||
filled
|
||||
dense
|
||||
v-on:keyup.enter="saveElem"
|
||||
>
|
||||
</q-input>
|
||||
<q-input
|
||||
label="Height:"
|
||||
@update:model-value="modifElem"
|
||||
v-model="myel.heightimg"
|
||||
filled
|
||||
dense
|
||||
v-on:keyup.enter="saveElem"
|
||||
>
|
||||
</q-input>
|
||||
</div>
|
||||
<div class="justify-center row q-ma-xs">
|
||||
<q-btn
|
||||
dense
|
||||
@@ -113,6 +93,26 @@
|
||||
>
|
||||
</q-btn>
|
||||
</div>
|
||||
<div class="row">
|
||||
<q-input
|
||||
label="Width:"
|
||||
@update:model-value="modifElem"
|
||||
v-model="myel.widthimg"
|
||||
filled
|
||||
dense
|
||||
v-on:keyup.enter="saveElem"
|
||||
>
|
||||
</q-input>
|
||||
<q-input
|
||||
label="Height:"
|
||||
@update:model-value="modifElem"
|
||||
v-model="myel.heightimg"
|
||||
filled
|
||||
dense
|
||||
v-on:keyup.enter="saveElem"
|
||||
>
|
||||
</q-input>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<q-select
|
||||
@@ -129,6 +129,20 @@
|
||||
map-options
|
||||
>
|
||||
</q-select>
|
||||
<q-select
|
||||
v-if="enableEdit"
|
||||
rounded
|
||||
outlined
|
||||
v-model="myel.vertalign"
|
||||
:options="tools.SelectListVertAlign"
|
||||
@update:model-value="modifElem"
|
||||
dense
|
||||
label="Vert Allinea"
|
||||
style="min-width: 100px"
|
||||
emit-value
|
||||
map-options
|
||||
>
|
||||
</q-select>
|
||||
<q-select
|
||||
v-if="enableEdit"
|
||||
rounded
|
||||
@@ -169,6 +183,21 @@
|
||||
</q-input>
|
||||
</div>
|
||||
|
||||
<q-select
|
||||
v-if="enableEdit && showAnimation"
|
||||
rounded
|
||||
style="min-width: 150px"
|
||||
outlined
|
||||
v-model="myel.class_anim"
|
||||
:options="tools.SelectListAnimation"
|
||||
@update:model-value="modifElem"
|
||||
dense
|
||||
label="Animazione"
|
||||
emit-value
|
||||
map-options
|
||||
>
|
||||
</q-select>
|
||||
|
||||
<div v-if="myel.type === shared_consts.ELEMTYPE.TEXT">
|
||||
<div v-if="enableEdit">
|
||||
<q-input
|
||||
@@ -221,17 +250,6 @@
|
||||
</q-btn>
|
||||
</q-bar>
|
||||
|
||||
<CSelectImage
|
||||
:title="tools.getTitleGall()"
|
||||
:directory="tools.getDirectoryGall(myvalue, 'imgcards')"
|
||||
:imgGall="[myvalue]"
|
||||
:edit="true"
|
||||
:canModify="true"
|
||||
:isInModif="true"
|
||||
@update:imgGall="updateElem"
|
||||
@showandsave="Savedb">
|
||||
</CSelectImage>
|
||||
|
||||
<CMyFieldRec
|
||||
title="Immagine:"
|
||||
table="imgcards"
|
||||
@@ -368,15 +386,18 @@
|
||||
</div>
|
||||
<div v-else-if="myel.type === shared_consts.ELEMTYPE.IMGTITLE">
|
||||
<div v-if="enableEdit">
|
||||
<q-input
|
||||
label="Img"
|
||||
class="fa-border"
|
||||
<CMyFieldRec
|
||||
title="Immagine:"
|
||||
table="myelems"
|
||||
:id="myel._id"
|
||||
:rec="myel"
|
||||
field="image"
|
||||
@update:model-value="modifElem"
|
||||
v-model="myel.container"
|
||||
filled
|
||||
v-on:keyup.enter="saveElem(false)"
|
||||
:canEdit="true"
|
||||
:canModify="true"
|
||||
:fieldtype="costanti.FieldType.image"
|
||||
>
|
||||
</q-input>
|
||||
</CMyFieldRec>
|
||||
|
||||
<q-input
|
||||
label="Title"
|
||||
@@ -387,6 +408,155 @@
|
||||
v-on:keyup.enter="saveElem"
|
||||
>
|
||||
</q-input>
|
||||
<q-input
|
||||
label="Sottotitolo"
|
||||
class="fa-border"
|
||||
@update:model-value="modifElem"
|
||||
v-model="myel.container2"
|
||||
filled
|
||||
v-on:keyup.enter="saveElem"
|
||||
>
|
||||
</q-input>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="myel.type === shared_consts.ELEMTYPE.IMGPOSTER">
|
||||
<div v-if="enableEdit">
|
||||
<q-input
|
||||
label="Velocità"
|
||||
style="max-width: 100px"
|
||||
class="fa-border"
|
||||
@update:model-value="modifElem"
|
||||
v-model="myel.speed"
|
||||
type="number"
|
||||
filled
|
||||
v-on:keyup.enter="saveElem"
|
||||
>
|
||||
</q-input>
|
||||
<CMyFieldRec
|
||||
title="Immagine:"
|
||||
table="myelems"
|
||||
:id="myel._id"
|
||||
:rec="myel"
|
||||
field="image"
|
||||
@update:model-value="modifElem"
|
||||
:canEdit="true"
|
||||
:canModify="true"
|
||||
:fieldtype="costanti.FieldType.image"
|
||||
>
|
||||
</CMyFieldRec>
|
||||
<CMyFieldRec
|
||||
title="Logo:"
|
||||
table="myelems"
|
||||
:id="myel._id"
|
||||
:rec="myel"
|
||||
field="container3"
|
||||
@update:model-value="modifElem"
|
||||
:canEdit="true"
|
||||
:canModify="true"
|
||||
:fieldtype="costanti.FieldType.image"
|
||||
>
|
||||
</CMyFieldRec>
|
||||
<div class="row">
|
||||
<q-input
|
||||
label="Lunghezza Logo:"
|
||||
@update:model-value="modifElem"
|
||||
v-model="myel.width"
|
||||
filled
|
||||
dense
|
||||
v-on:keyup.enter="saveElem"
|
||||
>
|
||||
</q-input>
|
||||
<q-input
|
||||
label="Altezza Logo:"
|
||||
@update:model-value="modifElem"
|
||||
v-model="myel.height"
|
||||
filled
|
||||
dense
|
||||
v-on:keyup.enter="saveElem"
|
||||
>
|
||||
</q-input>
|
||||
</div>
|
||||
|
||||
<q-input
|
||||
label="Titolo"
|
||||
class="fa-border"
|
||||
@update:model-value="modifElem"
|
||||
v-model="myel.container"
|
||||
filled
|
||||
v-on:keyup.enter="saveElem"
|
||||
>
|
||||
</q-input>
|
||||
<q-select
|
||||
v-if="enableEdit"
|
||||
rounded
|
||||
style="min-width: 150px"
|
||||
outlined
|
||||
v-model="myel.class_anim"
|
||||
:options="tools.SelectListAnimation"
|
||||
@update:model-value="modifElem"
|
||||
dense
|
||||
label="Animazione Titolo"
|
||||
emit-value
|
||||
map-options
|
||||
>
|
||||
</q-select>
|
||||
<CSelectColor
|
||||
style="min-width: 100px"
|
||||
v-model="myel.color"
|
||||
@update:model-value="modifElem"
|
||||
title="Col Titolo"
|
||||
>
|
||||
</CSelectColor>
|
||||
<q-input
|
||||
label="Sottotitolo"
|
||||
class="fa-border"
|
||||
@update:model-value="modifElem"
|
||||
v-model="myel.container2"
|
||||
filled
|
||||
v-on:keyup.enter="saveElem"
|
||||
>
|
||||
</q-input>
|
||||
<CSelectColor
|
||||
style="min-width: 100px"
|
||||
v-model="myel.colorsub"
|
||||
@update:model-value="modifElem"
|
||||
title="Col Sottotitolo"
|
||||
>
|
||||
</CSelectColor>
|
||||
</div>
|
||||
<q-select
|
||||
v-if="enableEdit"
|
||||
rounded
|
||||
style="min-width: 150px"
|
||||
outlined
|
||||
v-model="myel.class_anim2"
|
||||
:options="tools.SelectListAnimation"
|
||||
@update:model-value="modifElem"
|
||||
dense
|
||||
label="Animaz SottoTitolo"
|
||||
emit-value
|
||||
map-options
|
||||
>
|
||||
</q-select>
|
||||
<div class="row">
|
||||
<q-input
|
||||
label="Classe Title"
|
||||
class="fa-border"
|
||||
@update:model-value="modifElem"
|
||||
v-model="myel.class4"
|
||||
filled
|
||||
v-on:keyup.enter="saveElem"
|
||||
>
|
||||
</q-input>
|
||||
<q-input
|
||||
label="Classe SubTitle"
|
||||
class="fa-border"
|
||||
@update:model-value="modifElem"
|
||||
v-model="myel.class3"
|
||||
filled
|
||||
v-on:keyup.enter="saveElem"
|
||||
>
|
||||
</q-input>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else-if="myel.type === shared_consts.ELEMTYPE.HTML">
|
||||
@@ -416,7 +586,7 @@
|
||||
<q-input
|
||||
label="NomeFile Img:"
|
||||
@update:model-value="modifElem"
|
||||
v-model="myel.container"
|
||||
v-model="myel.image"
|
||||
filled
|
||||
dense
|
||||
v-on:keyup.enter="saveElem"
|
||||
@@ -427,7 +597,7 @@
|
||||
table="myelems"
|
||||
:id="myel._id"
|
||||
:rec="myel"
|
||||
field="container"
|
||||
field="image"
|
||||
@update:model-value="modifElem"
|
||||
:canEdit="true"
|
||||
:canModify="true"
|
||||
|
||||
@@ -6,6 +6,7 @@ import { IMyCard, IMyElem, IMyPage, IOperators } from '@src/model'
|
||||
import { useGlobalStore } from '@store/globalStore'
|
||||
|
||||
import { CImgTitle } from '../CImgTitle/index'
|
||||
import { CImgPoster } from '@/components/CImgPoster'
|
||||
import { CTitle } from '@/components/CTitle/index'
|
||||
import { tools } from '@store/Modules/tools'
|
||||
import { shared_consts } from '@/common/shared_vuejs'
|
||||
@@ -31,7 +32,7 @@ export default defineComponent({
|
||||
components: {
|
||||
CImgTitle, CTitle, LandingFooter, CEventsCalendar,
|
||||
CCardCarousel, COpenStreetMap, CMyPage, CMyPageIntro, CMyEditor, CMyFieldRec,
|
||||
CSelectColor, CSelectFontSize
|
||||
CSelectColor, CSelectFontSize, CImgPoster,
|
||||
},
|
||||
emits: ['selElemClick'],
|
||||
props: {
|
||||
@@ -203,21 +204,6 @@ export default defineComponent({
|
||||
return mycl
|
||||
}
|
||||
|
||||
function getImgFileByElem(elem: IMyElem, reccard?: IMyCard) {
|
||||
if (elem) {
|
||||
if (elem.type === shared_consts.ELEMTYPE.CARD) {
|
||||
if (reccard?.imagefile)
|
||||
return 'upload/pages/' + elem.path + '/' + reccard.imagefile
|
||||
else
|
||||
return ''
|
||||
} else if (elem.type === shared_consts.ELEMTYPE.IMAGE) {
|
||||
return 'upload/pages/' + elem.path + '/' + elem.container
|
||||
} else {
|
||||
return 'upload/pages/' + elem.path + '/' + elem.image
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function showFit() {
|
||||
if (props.myelem.type)
|
||||
return [shared_consts.ELEMTYPE.TEXT].includes(props.myelem.type)
|
||||
@@ -252,7 +238,6 @@ export default defineComponent({
|
||||
showFit,
|
||||
getValDb,
|
||||
dupElem,
|
||||
getImgFileByElem,
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@@ -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"
|
||||
|
||||
@@ -97,6 +97,11 @@ export default defineComponent({
|
||||
required: false,
|
||||
default: '',
|
||||
},
|
||||
path: {
|
||||
tupe: String,
|
||||
required: false,
|
||||
default: '',
|
||||
},
|
||||
nosaveToDb: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
@@ -152,6 +157,7 @@ export default defineComponent({
|
||||
else
|
||||
mykey.value = props.field
|
||||
}
|
||||
console.log('table', props.table, 'col.value', col.value, 'field', props.field, 'mykey', mykey.value)
|
||||
|
||||
}
|
||||
|
||||
|
||||
@@ -44,6 +44,7 @@
|
||||
:pickup="pickup"
|
||||
v-model:row="rec"
|
||||
minuteinterval="1"
|
||||
:path="path"
|
||||
:nosaveToDb="nosaveToDb"
|
||||
@showandsave="showandsel"
|
||||
>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div>
|
||||
<div v-if="mypath && !!rec">
|
||||
<div class="q-ma-sm q-gutter-sm q-pa-xs">
|
||||
<div class="q-ma-xs q-gutter-xs q-pa-xs">
|
||||
<div v-if="!!rec.img1" class="text-center">
|
||||
<q-img :src="``+ rec.img1" class="img"></q-img>
|
||||
</div>
|
||||
|
||||
@@ -63,6 +63,7 @@ export default defineComponent({
|
||||
const globalStore = useGlobalStore()
|
||||
|
||||
const editOn = ref(false)
|
||||
const visuEditor = ref(false)
|
||||
const addOn = ref(false)
|
||||
const myelemVoid = ref({ _id: objectId(), active: true, type: shared_consts.ELEMTYPE.TEXT, container: '...', path: mypathin.value } as IMyElem)
|
||||
|
||||
@@ -107,6 +108,7 @@ export default defineComponent({
|
||||
function selElemClick(myelem: IMyElem) {
|
||||
console.log('mypageelem selElemClick', myelem)
|
||||
selElem.value = myelem
|
||||
visuEditor.value = !!myelem
|
||||
}
|
||||
|
||||
function mounted() {
|
||||
@@ -127,6 +129,7 @@ export default defineComponent({
|
||||
rec, myelems,
|
||||
mypathin,
|
||||
editOn,
|
||||
visuEditor,
|
||||
addOn,
|
||||
tools,
|
||||
shared_consts,
|
||||
|
||||
@@ -9,10 +9,20 @@
|
||||
icon="fas fa-pencil-alt"
|
||||
>
|
||||
</q-toggle>
|
||||
|
||||
<q-toggle
|
||||
v-if="tools.isManager()"
|
||||
v-model="visuEditor"
|
||||
color="green"
|
||||
@update:model-value="changeVisuDrawer(mypathin, editOn)"
|
||||
icon="fas fa-pencil-alt"
|
||||
>
|
||||
</q-toggle>
|
||||
|
||||
<q-drawer
|
||||
v-model="editOn"
|
||||
v-model="visuEditor"
|
||||
side="right"
|
||||
:width="400"
|
||||
:width="350"
|
||||
:breakpoint="700"
|
||||
elevated
|
||||
>
|
||||
@@ -25,7 +35,7 @@
|
||||
color="white"
|
||||
icon="close"
|
||||
@click="
|
||||
editOn = false;
|
||||
visuEditor = false;
|
||||
"
|
||||
></q-btn>
|
||||
</q-bar>
|
||||
@@ -38,7 +48,7 @@
|
||||
</q-scroll-area>
|
||||
</q-drawer>
|
||||
|
||||
<div class="q-ma-sm q-gutter-sm q-pa-xs">
|
||||
<div class="q-ma-xs q-gutter-xs q-pa-xs">
|
||||
<div v-if="!!rec.img1" class="text-center">
|
||||
<q-img :src="`` + rec.img1" class="img"></q-img>
|
||||
</div>
|
||||
|
||||
@@ -762,6 +762,7 @@ export default defineComponent({
|
||||
noPopupeditByCol,
|
||||
getTitleEditor,
|
||||
t,
|
||||
myrow,
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
@@ -174,7 +174,7 @@
|
||||
<div v-else-if="col.fieldtype === costanti.FieldType.listimages" style="text-align: center;">
|
||||
<CGallery
|
||||
:imagebak="col.showpicprofile_ifnotset ? ((userStore.getImgByProfile(row, true) === '') ? costanti.NESSUN_IMMAGINE : userStore.getImgByProfile(row, true)) : ''"
|
||||
:title="tools.getTitleGall()"
|
||||
:title="tools.getTitleGall(table)"
|
||||
:directory="tools.getDirectoryGall(myrow, table, path)"
|
||||
:imgGall="myvalue"
|
||||
:isInModif="isInModif"
|
||||
@@ -197,8 +197,8 @@
|
||||
{{ $t('reg.photo') }}
|
||||
<CGallery
|
||||
:imagebak="col.showpicprofile_ifnotset ? userStore.getImgByProfile(row['profile'], true) : ''"
|
||||
:title="tools.getTitleGall()"
|
||||
:directory="tools.getDirectoryGall()"
|
||||
:title="tools.getTitleGall(table)"
|
||||
:directory="tools.getDirectoryGall(myrow, table, path)"
|
||||
:imgGall="[{ imagefile: myvalue }]"
|
||||
:edit="isviewfield()"
|
||||
:canModify="canModify"
|
||||
@@ -239,8 +239,8 @@
|
||||
<CSelectImage
|
||||
v-bind="$attrs"
|
||||
:imagebak="col.showpicprofile_ifnotset ? userStore.getImgByProfile(row['profile'], true) : ''"
|
||||
:title="tools.getTitleGall()"
|
||||
:directory="tools.getDirectoryGall()"
|
||||
:title="tools.getTitleGall(table)"
|
||||
:directory="tools.getDirectoryGall(myrow, table, path)"
|
||||
:imgGall="[myvalue]"
|
||||
:edit="isviewfield()"
|
||||
:canModify="canModify"
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import {
|
||||
defineComponent,
|
||||
defineComponent, ref,
|
||||
} from 'vue'
|
||||
|
||||
import { tools } from '@src/store/Modules/tools'
|
||||
@@ -25,6 +25,8 @@ export default defineComponent({
|
||||
|
||||
const { getarrValDb, getValDb } = MixinBase()
|
||||
|
||||
const site = ref(globalStore.site)
|
||||
|
||||
console.log('LandingFooter - INIT')
|
||||
|
||||
function TelegramSupport() {
|
||||
@@ -36,7 +38,10 @@ export default defineComponent({
|
||||
}
|
||||
|
||||
function Telegram_UsernameHttp() {
|
||||
return tools.getHttpForTelegram(globalStore.getValueSettingsByKey('TELEGRAM_USERNAME', false))
|
||||
if (site.value!.contacts!.telegram)
|
||||
return tools.getHttpForTelegram(site.value!.contacts!.telegram)
|
||||
else
|
||||
return ''
|
||||
}
|
||||
|
||||
function FBPage() {
|
||||
@@ -54,7 +59,7 @@ export default defineComponent({
|
||||
|
||||
function ChatWhatsapp() {
|
||||
// @ts-ignore
|
||||
return tools.getHttpForWhatsapp(this.Whatsapp_Cell())
|
||||
return tools.getHttpForWhatsapp(site.value.contacts.whatsapp)
|
||||
}
|
||||
|
||||
return {
|
||||
@@ -69,7 +74,8 @@ export default defineComponent({
|
||||
tools,
|
||||
toolsext,
|
||||
getarrValDb,
|
||||
getValDb
|
||||
getValDb,
|
||||
site,
|
||||
}
|
||||
},
|
||||
})
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<section class="landing__footer">
|
||||
<section v-if="site" class="landing__footer">
|
||||
<div class="row justify-between items-start q-col-gutter-xs">
|
||||
<div class="col-12 col-sm-4 ">
|
||||
<!--<span v-html="t('homepage.footer.description')">-->
|
||||
@@ -14,10 +14,10 @@
|
||||
|
||||
<div class=" q-my-md">
|
||||
<div class="landing__footer-icons row flex-center margin_buttons">
|
||||
<a v-if="!!FBPage()" :href="FBPage()" target="_blank">
|
||||
<a v-if="!!site.contacts.facebook" :href="site.contacts.facebook" target="_blank">
|
||||
<i aria-hidden="true" class="q-icon fab fa-facebook-f icon_contact links"> </i></a>
|
||||
|
||||
<a v-if="!!InstagramPage()" :href="InstagramPage()" target="_blank">
|
||||
<a v-if="!!site.contacts.instagram" :href="site.contacts.instagram" target="_blank">
|
||||
<i aria-hidden="true" class="q-icon fab fa-instagram icon_contact links"> </i></a>
|
||||
|
||||
<a v-if="!!TwitterPage()" :href="TwitterPage()" target="_blank">
|
||||
@@ -28,7 +28,7 @@
|
||||
<span class="text-h5 text-white">Supporto Tecnico: </span>
|
||||
<i aria-hidden="true" class="q-icon fab fa-telegram icon_contact links"></i></a>
|
||||
|
||||
<a v-if="!!Whatsapp_Cell()" :href="ChatWhatsapp()" target="_blank">
|
||||
<a v-if="!!ChatWhatsapp()" :href="ChatWhatsapp()" target="_blank">
|
||||
<i aria-hidden="true" class="q-icon fab fa-whatsapp icon_contact links"></i></a>
|
||||
|
||||
<a v-if="!!Telegram_UsernameHttp()" :href="Telegram_UsernameHttp()" target="_blank">
|
||||
@@ -45,10 +45,10 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="getValDb('URLMAP', false)" class="text-center">
|
||||
<div v-if="site.contacts.map" class="text-center">
|
||||
<span v-html="getValDb('MAP_TITLE', false)"></span>
|
||||
<br>
|
||||
<a :href="getValDb('URLMAP', false)" target="_blank" class="footer_link">Apri Mappa</a>
|
||||
<a :href="site.contacts.map" target="_blank" class="footer_link">Apri Mappa</a>
|
||||
</div>
|
||||
|
||||
<!--<div class="q-mt-xs copyrights">-->
|
||||
@@ -64,10 +64,10 @@
|
||||
|
||||
<div class="mycontacts_text">
|
||||
<i
|
||||
v-if="getValDb('MAIN_EMAIL', false)" aria-hidden="true"
|
||||
v-if="site.contacts.email" aria-hidden="true"
|
||||
class="q-icon fas fa-envelope q-mx-sm"></i>
|
||||
<a :href="`mailto:` + getValDb('MAIN_EMAIL', false)" class="links">{{
|
||||
getValDb('MAIN_EMAIL', false)
|
||||
<a :href="`mailto:` + site.contacts.email" class="links">{{
|
||||
site.contacts.email
|
||||
}}</a><br>
|
||||
<div style="margin-bottom: 20px;"></div>
|
||||
<div
|
||||
@@ -158,7 +158,7 @@ class="footer_link" @click="navigate" @keypress.enter="navigate"
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<q-page-sticky v-if="ChatWhatsapp()" position="bottom-right" :offset="[18, 78]">
|
||||
<q-page-sticky v-if="site.whatsapp_home" position="bottom-right" :offset="[18, 78]">
|
||||
<q-btn
|
||||
fab icon="fab fa-whatsapp" color="green" type="a" :href="ChatWhatsapp()" target="__blank"
|
||||
class="mybtn_sticky"/>
|
||||
|
||||
@@ -15,6 +15,7 @@ export * from './CMyAvatar'
|
||||
export * from './CMyCart'
|
||||
export * from './CMyFieldDb'
|
||||
export * from './CMyFieldRec'
|
||||
export * from './CImgPoster'
|
||||
export * from './CSelectImage'
|
||||
export * from './CMyPage'
|
||||
export * from './CMyPageElem'
|
||||
|
||||
320
src/css/app.scss
320
src/css/app.scss
@@ -10,6 +10,7 @@ body {
|
||||
.text-mycol {
|
||||
color: #333333 !important;
|
||||
}
|
||||
|
||||
.bg-mycol {
|
||||
background: #333333 !important;
|
||||
}
|
||||
@@ -34,6 +35,7 @@ ul li::before {
|
||||
display: inline-block;
|
||||
width: 1em;
|
||||
margin-left: 20px;
|
||||
|
||||
@media (max-width: 600px) {
|
||||
margin-left: 5px;
|
||||
}
|
||||
@@ -44,6 +46,7 @@ ol li::before {
|
||||
display: inline-block;
|
||||
width: 1em;
|
||||
margin-left: 20px;
|
||||
|
||||
@media (max-width: 600px) {
|
||||
margin-left: 5px;
|
||||
}
|
||||
@@ -52,6 +55,7 @@ ol li::before {
|
||||
li {
|
||||
/*color: #2f2c8b;*/
|
||||
font-size: 18px;
|
||||
|
||||
@media (max-width: 600px) {
|
||||
font-size: 1rem;
|
||||
}
|
||||
@@ -70,6 +74,7 @@ h1 {
|
||||
|
||||
max-height: 250px;
|
||||
max-width: 250px;
|
||||
|
||||
@media (max-width: 718px) {
|
||||
max-height: 180px;
|
||||
max-width: 180px;
|
||||
@@ -99,24 +104,26 @@ $heightBtn: 100%;
|
||||
//flex: 0 0 100%;
|
||||
}
|
||||
|
||||
.fade-enter-active, .fade-leave-active {
|
||||
.fade-enter-active,
|
||||
.fade-leave-active {
|
||||
transition: opacity .2s;
|
||||
}
|
||||
|
||||
.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */
|
||||
{
|
||||
.fade-enter,
|
||||
.fade-leave-to
|
||||
|
||||
/* .fade-leave-active below version 2.1.8 */
|
||||
{
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.slide-enter {
|
||||
}
|
||||
.slide-enter {}
|
||||
|
||||
.slide-enter-active {
|
||||
animation: slide-in 0.2s ease-out forwards;
|
||||
}
|
||||
|
||||
.slide-leave {
|
||||
}
|
||||
.slide-leave {}
|
||||
|
||||
.slide-leave-active {
|
||||
animation: slide-out 0.5s ease-out forwards;
|
||||
@@ -126,6 +133,7 @@ $heightBtn: 100%;
|
||||
from {
|
||||
transform: translateX(-500px);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: translateX(0);
|
||||
}
|
||||
@@ -186,7 +194,8 @@ $heightBtn: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.links, .links a {
|
||||
.links,
|
||||
.links a {
|
||||
text-shadow: 1px 1px 1px #555 !important;
|
||||
// font-weight: bold;
|
||||
color: cornflowerblue !important;
|
||||
@@ -196,13 +205,15 @@ $heightBtn: 100%;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.text-subtitle1, h2 {
|
||||
.text-subtitle1,
|
||||
h2 {
|
||||
margin-bottom: 6px;
|
||||
font-size: 1.35rem;
|
||||
font-weight: 400;
|
||||
line-height: 1.75rem;
|
||||
text-shadow: .25 .25rem .5rem $grayshadow;
|
||||
letter-spacing: .00937em;
|
||||
|
||||
&.big {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
@@ -214,12 +225,14 @@ $heightBtn: 100%;
|
||||
font-weight: 400;
|
||||
text-shadow: .25 .25rem .5rem $grayshadow;
|
||||
letter-spacing: .00937em;
|
||||
|
||||
&.big {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.text-subtitle2, h3 {
|
||||
.text-subtitle2,
|
||||
h3 {
|
||||
margin-bottom: 4px;
|
||||
font-size: 1.15rem;
|
||||
font-weight: 400;
|
||||
@@ -263,9 +276,11 @@ $heightBtn: 100%;
|
||||
.text-subtitle1 {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.text-subtitle2 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.text-subtitle3 {
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
@@ -281,6 +296,7 @@ $heightBtn: 100%;
|
||||
.text-big {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.text-sobig {
|
||||
font-size: 1.50rem;
|
||||
}
|
||||
@@ -291,10 +307,12 @@ $heightBtn: 100%;
|
||||
max-width: 400px;
|
||||
min-width: 250px;
|
||||
padding: 1rem 1rem;
|
||||
|
||||
@media (max-width: 500px) {
|
||||
max-width: 400px;
|
||||
min-width: 250px;
|
||||
}
|
||||
|
||||
// box-shadow: none;
|
||||
}
|
||||
|
||||
@@ -355,7 +373,11 @@ $heightBtn: 100%;
|
||||
font-family: "Lucida Calligraphy", serif;
|
||||
}
|
||||
|
||||
.cltexth3, .cltexth2, .cltexth4, .cltexth5, .cltexth6 {
|
||||
.cltexth3,
|
||||
.cltexth2,
|
||||
.cltexth4,
|
||||
.cltexth5,
|
||||
.cltexth6 {
|
||||
font-size: 1.25rem;
|
||||
font-weight: 400;
|
||||
line-height: 1.75rem;
|
||||
@@ -379,7 +401,9 @@ $heightBtn: 100%;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.boldhigh, .boldop, .text-big {
|
||||
.boldhigh,
|
||||
.boldop,
|
||||
.text-big {
|
||||
font-weight: 500;
|
||||
text-shadow: .05rem .05rem .05rem $grayshadow;
|
||||
}
|
||||
@@ -413,39 +437,18 @@ $heightBtn: 100%;
|
||||
}
|
||||
|
||||
@media (max-width: 3000px) {
|
||||
.q-parallax__media > img, .myclimg {
|
||||
max-height: 800px !important;
|
||||
min-width: inherit !important;
|
||||
min-height: inherit !important;
|
||||
}
|
||||
.myclimg, .maxwidth {
|
||||
|
||||
.myclimg,
|
||||
.maxwidth {
|
||||
height: 750px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1600px) {
|
||||
.q-parallax__media > img, .myclimg {
|
||||
max-height: 800px !important;
|
||||
min-width: inherit !important;
|
||||
min-height: inherit !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1400px) {
|
||||
.q-parallax__media > img, .myclimg {
|
||||
max-height: 800px !important;
|
||||
min-width: inherit !important;
|
||||
min-height: inherit !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.q-parallax__media > img, .myclimg {
|
||||
max-height: 800px !important;
|
||||
min-width: inherit !important;
|
||||
min-height: inherit !important;
|
||||
}
|
||||
.myclimg, .maxwidth {
|
||||
|
||||
.myclimg,
|
||||
.maxwidth {
|
||||
height: 700px !important;
|
||||
}
|
||||
}
|
||||
@@ -455,45 +458,33 @@ $heightBtn: 100%;
|
||||
}
|
||||
|
||||
@media (max-width: 1000px) {
|
||||
.q-parallax__media > img, .myclimg {
|
||||
max-height: 700px !important;
|
||||
min-width: inherit !important;
|
||||
min-height: inherit !important;
|
||||
}
|
||||
.myclimg, .maxwidth {
|
||||
|
||||
.myclimg,
|
||||
.maxwidth {
|
||||
height: 650px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
.q-parallax__media > img, .myclimg {
|
||||
max-height: 600px !important;
|
||||
min-width: inherit !important;
|
||||
min-height: inherit !important;
|
||||
}
|
||||
.myclimg, .maxwidth {
|
||||
|
||||
.myclimg,
|
||||
.maxwidth {
|
||||
height: 550px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 700px) {
|
||||
.q-parallax__media > img, .myclimg {
|
||||
max-height: 500px !important;
|
||||
min-width: inherit !important;
|
||||
min-height: inherit !important;
|
||||
}
|
||||
.myclimg, .maxwidth {
|
||||
|
||||
.myclimg,
|
||||
.maxwidth {
|
||||
height: 400px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.q-parallax__media > img, .myclimg {
|
||||
max-height: 450px !important;
|
||||
min-height: inherit !important;
|
||||
min-width: 100% !important;
|
||||
}
|
||||
.myclimg, .maxwidth {
|
||||
|
||||
.myclimg,
|
||||
.maxwidth {
|
||||
height: 400px !important;
|
||||
}
|
||||
}
|
||||
@@ -505,12 +496,14 @@ $heightBtn: 100%;
|
||||
left: -9999px;
|
||||
top: -9999px;
|
||||
}
|
||||
|
||||
div#preloader img {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media print {
|
||||
|
||||
div#preloader,
|
||||
div#preloader img {
|
||||
visibility: hidden;
|
||||
@@ -560,14 +553,14 @@ $heightBtn: 100%;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.text-evidente{
|
||||
.text-evidente {
|
||||
font-size: 1.25rem;
|
||||
color: blue;
|
||||
line-height: 1.75rem;
|
||||
letter-spacing: .01em;
|
||||
}
|
||||
|
||||
.text-evidente2{
|
||||
.text-evidente2 {
|
||||
font-size: 1.25rem;
|
||||
color: blue;
|
||||
line-height: 1.75rem;
|
||||
@@ -606,7 +599,7 @@ $heightBtn: 100%;
|
||||
margin: -8px -8px;
|
||||
}
|
||||
|
||||
.margin_buttons > * {
|
||||
.margin_buttons>* {
|
||||
margin: 12px 12px !important;
|
||||
}
|
||||
|
||||
@@ -640,7 +633,9 @@ $heightBtn: 100%;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
.clBorderWarning, .clBorderZoom, .clBorderTutor {
|
||||
.clBorderWarning,
|
||||
.clBorderZoom,
|
||||
.clBorderTutor {
|
||||
border: #f69f09 solid 5px;
|
||||
border-radius: 32px;
|
||||
font-size: 1rem;
|
||||
@@ -654,7 +649,8 @@ $heightBtn: 100%;
|
||||
border: #666cf6 solid 3px;
|
||||
}
|
||||
|
||||
.clBorderImportant, .clBorderSteps {
|
||||
.clBorderImportant,
|
||||
.clBorderSteps {
|
||||
border: red solid 5px;
|
||||
border-radius: 16px;
|
||||
font-size: 1rem;
|
||||
@@ -718,6 +714,7 @@ $heightBtn: 100%;
|
||||
|
||||
max-height: 350px;
|
||||
max-width: 350px;
|
||||
|
||||
@media (max-width: 718px) {
|
||||
max-height: 350px;
|
||||
max-width: 350px;
|
||||
@@ -735,6 +732,7 @@ $heightBtn: 100%;
|
||||
|
||||
max-height: 550px;
|
||||
max-width: 550px;
|
||||
|
||||
@media (max-width: 718px) {
|
||||
max-height: 350px;
|
||||
max-width: 350px;
|
||||
@@ -747,19 +745,20 @@ $heightBtn: 100%;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.text-h7{
|
||||
.text-h7 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.text-h8{
|
||||
.text-h8 {
|
||||
font-size: 0.85rem !important;
|
||||
}
|
||||
|
||||
.text-h9{
|
||||
.text-h9 {
|
||||
font-size: 0.65rem !important;
|
||||
}
|
||||
|
||||
.bordo_stondato, .bordo_stondato_blu{
|
||||
.bordo_stondato,
|
||||
.bordo_stondato_blu {
|
||||
margin: 4px;
|
||||
border-radius: 3rem;
|
||||
padding-left: 14px;
|
||||
@@ -773,7 +772,8 @@ $heightBtn: 100%;
|
||||
border: solid 3px #0f01b5;
|
||||
}
|
||||
|
||||
.bordo_stondato2, .bordo_stondato_blu2{
|
||||
.bordo_stondato2,
|
||||
.bordo_stondato_blu2 {
|
||||
margin: 4px;
|
||||
border-radius: 3rem;
|
||||
padding-left: 2px;
|
||||
@@ -783,7 +783,7 @@ $heightBtn: 100%;
|
||||
border: solid 3px #49b502;
|
||||
}
|
||||
|
||||
.bordo_stondato_stretto{
|
||||
.bordo_stondato_stretto {
|
||||
margin: 4px;
|
||||
border-radius: 3rem;
|
||||
padding-left: 14px;
|
||||
@@ -793,7 +793,7 @@ $heightBtn: 100%;
|
||||
border: solid 3px #49b502;
|
||||
}
|
||||
|
||||
.bordo_stondato_small{
|
||||
.bordo_stondato_small {
|
||||
margin: 0px;
|
||||
border-radius: 2rem;
|
||||
padding-left: 4px;
|
||||
@@ -803,7 +803,7 @@ $heightBtn: 100%;
|
||||
border: solid 2px #49b502;
|
||||
}
|
||||
|
||||
.bordo_stondato_pending{
|
||||
.bordo_stondato_pending {
|
||||
margin: 4px;
|
||||
border-radius: 3rem;
|
||||
padding-left: 14px;
|
||||
@@ -813,7 +813,7 @@ $heightBtn: 100%;
|
||||
border: solid 1px #4a6598;
|
||||
}
|
||||
|
||||
.bordo_stondato_circuiti{
|
||||
.bordo_stondato_circuiti {
|
||||
margin: 4px;
|
||||
border-radius: 1.15rem;
|
||||
padding-left: 5px;
|
||||
@@ -824,7 +824,7 @@ $heightBtn: 100%;
|
||||
box-shadow: 0 0 6px rgba(246, 246, 246, 0.2);
|
||||
}
|
||||
|
||||
.bordo_quadrato{
|
||||
.bordo_quadrato {
|
||||
margin: 1px;
|
||||
border-radius: 0.5rem;
|
||||
padding-left: 2px;
|
||||
@@ -844,26 +844,32 @@ $heightBtn: 100%;
|
||||
/* this is when the loading indicator appears */
|
||||
|
||||
}
|
||||
|
||||
.my-sticky-header-table .q-table__middle {
|
||||
max-height: 650px !important;
|
||||
|
||||
@media (max-width: 718px) {
|
||||
// PER VERSIONE MOBILE
|
||||
max-height: 400px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.my-sticky-header-table .q-table__top,
|
||||
.my-sticky-header-table .q-table__bottom,
|
||||
.my-sticky-header-table thead tr:first-child th {
|
||||
/* bg color is important for th; just specify one */
|
||||
background-color: #f0ffff;
|
||||
}
|
||||
|
||||
.my-sticky-header-table thead tr th {
|
||||
position: sticky;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.my-sticky-header-table thead tr:first-child th {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.my-sticky-header-table.q-table--loading thead tr:last-child th {
|
||||
/* height of all previous header rows */
|
||||
top: 48px;
|
||||
@@ -875,10 +881,12 @@ $heightBtn: 100%;
|
||||
margin-right: auto;
|
||||
max-width: 800px;
|
||||
min-width: 800px;
|
||||
|
||||
@media (max-width: 500px) {
|
||||
max-width: 350px;
|
||||
min-width: 300px;
|
||||
}
|
||||
|
||||
padding-bottom: 20px;
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
@@ -889,6 +897,7 @@ $heightBtn: 100%;
|
||||
}
|
||||
|
||||
.my-card-shadow:hover {
|
||||
|
||||
// transition: transform .2s ease-in;
|
||||
// transform: scale(1.03);
|
||||
@media (max-width: 500px) {
|
||||
@@ -897,44 +906,50 @@ $heightBtn: 100%;
|
||||
}
|
||||
|
||||
|
||||
.text-small{
|
||||
.text-small {
|
||||
font-size: 0.90rem;
|
||||
|
||||
@media (max-width: 500px) {
|
||||
font-size: 0.8rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
#mycontainer {
|
||||
min-height:100%;
|
||||
position:relative;
|
||||
min-height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.myheader {
|
||||
padding: 5px;
|
||||
|
||||
@media (max-width: 500px) {
|
||||
padding: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
#mybody {
|
||||
padding: 5px;
|
||||
|
||||
@media (max-width: 500px) {
|
||||
padding: 1px;
|
||||
}
|
||||
}
|
||||
.myfooter{
|
||||
|
||||
}
|
||||
.myfooter {}
|
||||
|
||||
.iconplusminus{
|
||||
.iconplusminus {
|
||||
font-size: 6px;
|
||||
}
|
||||
|
||||
.clpos{
|
||||
.clpos {
|
||||
color: #C0C0C0;
|
||||
}
|
||||
.clresp{
|
||||
|
||||
.clresp {
|
||||
color: #206d24;
|
||||
}
|
||||
.clrespempty{
|
||||
|
||||
.clrespempty {
|
||||
color: #DDDDDD;
|
||||
}
|
||||
|
||||
@@ -968,12 +983,13 @@ $heightBtn: 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.centeritems{
|
||||
.centeritems {
|
||||
place-content: center;
|
||||
}
|
||||
|
||||
.combowidth {
|
||||
min-width: 190px;
|
||||
|
||||
@media (max-width: 450px) {
|
||||
min-width: 125px;
|
||||
white-space: nowrap;
|
||||
@@ -985,7 +1001,7 @@ $heightBtn: 100%;
|
||||
height: 90px;
|
||||
}
|
||||
|
||||
.dialog_card{
|
||||
.dialog_card {
|
||||
min-width: 100%;
|
||||
width: 100% !important;
|
||||
margin-left: 2px !important;
|
||||
@@ -1002,14 +1018,14 @@ $heightBtn: 100%;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
|
||||
.imgprofile{
|
||||
.imgprofile {
|
||||
border: 0px solid rgb(29, 118, 13);
|
||||
border-radius: 16px;
|
||||
box-shadow: 0 0 45px rgba(246, 246, 246, 0.2);
|
||||
margin: 1px;
|
||||
}
|
||||
|
||||
.imgprofile_small{
|
||||
.imgprofile_small {
|
||||
border: 0px solid rgb(29, 118, 13);
|
||||
border-radius: 30px;
|
||||
box-shadow: 0 0 45px rgba(246, 246, 246, 0.2);
|
||||
@@ -1017,7 +1033,7 @@ $heightBtn: 100%;
|
||||
transform: scale(1.0);
|
||||
}
|
||||
|
||||
.iconprofile_small{
|
||||
.iconprofile_small {
|
||||
border-radius: 30px;
|
||||
}
|
||||
|
||||
@@ -1025,33 +1041,36 @@ $heightBtn: 100%;
|
||||
width: -webkit-fill-available;
|
||||
}
|
||||
|
||||
.small-screen-only{
|
||||
.small-screen-only {
|
||||
@media (max-width: $breakpoint-xs-max) {
|
||||
display: block;
|
||||
}
|
||||
|
||||
@media (min-width: $breakpoint-sm-min) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.large-screen-only{
|
||||
.large-screen-only {
|
||||
@media (max-width: $breakpoint-xs-max) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (min-width: $breakpoint-sm-min) {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.no-padding{
|
||||
.no-padding {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.popupedit{
|
||||
.popupedit {
|
||||
border: 1px solid #bbb;
|
||||
border-radius: $generic-border-radius
|
||||
}
|
||||
.dateevent{
|
||||
|
||||
.dateevent {
|
||||
border-radius: 16px;
|
||||
border: red solid 2px;
|
||||
padding: 3px;
|
||||
@@ -1063,15 +1082,15 @@ $heightBtn: 100%;
|
||||
|
||||
}
|
||||
|
||||
.datainizio, .datafine{
|
||||
.datainizio,
|
||||
.datafine {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.regione{
|
||||
.regione {}
|
||||
|
||||
}
|
||||
|
||||
.accom_num, .accom_maxosp {
|
||||
.accom_num,
|
||||
.accom_maxosp {
|
||||
font-size: 1.25rem;
|
||||
background-color: green;
|
||||
font-weight: bold;
|
||||
@@ -1084,10 +1103,10 @@ $heightBtn: 100%;
|
||||
background-color: blue !important;
|
||||
}
|
||||
|
||||
.img_effetto_3d{
|
||||
.img_effetto_3d {
|
||||
border-radius: 10px !important;
|
||||
height: 300px;
|
||||
max-width:300px;
|
||||
max-width: 300px;
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
|
||||
@@ -1096,16 +1115,16 @@ $heightBtn: 100%;
|
||||
src: url(./fonts/walterturncoat.woff);
|
||||
}
|
||||
|
||||
.title_shadow{
|
||||
font-family: WalterTurncoat,handwriting, Arial, sans-serif;
|
||||
.title_shadow {
|
||||
font-family: WalterTurncoat, handwriting, Arial, sans-serif;
|
||||
font-size: 1.25rem;
|
||||
color: #8300e9!important;
|
||||
color: #8300e9 !important;
|
||||
font-weight: 500;
|
||||
text-shadow: .1rem .1rem .1rem $grayshadow;
|
||||
}
|
||||
|
||||
.title_view_shadow{
|
||||
font-family: WalterTurncoat,handwriting, Arial, sans-serif;
|
||||
.title_view_shadow {
|
||||
font-family: WalterTurncoat, handwriting, Arial, sans-serif;
|
||||
font-size: 0.85rem;
|
||||
text-shadow: .05rem .05rem .05rem $grayshadow;
|
||||
letter-spacing: 0.25px;
|
||||
@@ -1135,28 +1154,29 @@ $heightBtn: 100%;
|
||||
background-repeat: no-repeat !important;
|
||||
}
|
||||
|
||||
.username{
|
||||
.username {
|
||||
font-weight: bold;
|
||||
text-shadow: .25 .25rem .5rem $grayshadow;
|
||||
letter-spacing: 0.025rem;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.q-card__section{
|
||||
.q-card__section {
|
||||
@media (max-width: 600px) {
|
||||
padding: 8px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.align_elem_right {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.text-section{
|
||||
.text-section {
|
||||
font-size: 1.15rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.sezioni{
|
||||
.sezioni {
|
||||
vertical-align: center;
|
||||
padding: 4px;
|
||||
}
|
||||
@@ -1207,3 +1227,77 @@ $heightBtn: 100%;
|
||||
background-position: 50% center !important;
|
||||
background-repeat: no-repeat !important;
|
||||
}
|
||||
|
||||
.poster_shadows {
|
||||
border-radius: 30px;
|
||||
background: #1729ea;
|
||||
background: -webkit-linear-gradient(45deg, #17ead9, #6078ea) !important;
|
||||
background: linear-gradient(45deg, #17ead9, #6078ea) !important;
|
||||
}
|
||||
|
||||
.duration-2s {
|
||||
transition-duration: 5s !important;
|
||||
}
|
||||
|
||||
.duration-3s {
|
||||
transition-duration: 3s !important;
|
||||
}
|
||||
|
||||
.duration-4s {
|
||||
transition-duration: 4s !important;
|
||||
}
|
||||
|
||||
.duration-5s {
|
||||
transition-duration: 5s !important;
|
||||
}
|
||||
|
||||
.fade-enter-active,
|
||||
.fade-leave-active {
|
||||
transition: opacity 2s ease;
|
||||
}
|
||||
|
||||
.fade-enter-from,
|
||||
.fade-leave-to {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.fromsky-enter-active,
|
||||
.fromsky-leave-active {
|
||||
transition: opacity 2s ease;
|
||||
}
|
||||
|
||||
.fromsky-enter-from {
|
||||
top: -100px;
|
||||
}
|
||||
|
||||
.fromsky-leave-to {
|
||||
top: initial;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.anim_toBottom {
|
||||
animation: moveToBottom 2s ease-in-out;
|
||||
}
|
||||
.anim_toRight {
|
||||
animation: moveToRight 2s ease-in-out;
|
||||
}
|
||||
|
||||
@keyframes moveToRight {
|
||||
0% {
|
||||
transform: translateX(-300px);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: translateX(0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes moveToBottom {
|
||||
0% {
|
||||
transform: translateY(-100px);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -120,7 +120,9 @@ export interface IMyElem {
|
||||
container2?: string
|
||||
container3?: string
|
||||
span?: boolean
|
||||
transition?: boolean
|
||||
align?: number
|
||||
vertalign?: number
|
||||
fit?: string
|
||||
parambool?: boolean
|
||||
parambool2?: boolean
|
||||
@@ -142,6 +144,9 @@ export interface IMyElem {
|
||||
image?: string
|
||||
class2?: string
|
||||
class3?: string
|
||||
class4?: string
|
||||
class_anim?: string
|
||||
class_anim2?: string
|
||||
styleadd?: string
|
||||
list?: IImgGallery[]
|
||||
listcards?: IMyCard[]
|
||||
@@ -175,6 +180,7 @@ export interface IMyPage {
|
||||
active?: boolean
|
||||
inmenu?: boolean
|
||||
color?: string
|
||||
colorsub?: string
|
||||
onlyif_logged?: boolean
|
||||
only_residenti?: boolean
|
||||
only_consiglio?: boolean
|
||||
@@ -190,6 +196,17 @@ export interface IOption {
|
||||
options: number
|
||||
}
|
||||
|
||||
export interface IContacts {
|
||||
facebook?: string
|
||||
instagram?: string
|
||||
whatsapp?: string
|
||||
telegram?: string
|
||||
youtube?: string
|
||||
email?: string
|
||||
address?: string
|
||||
map?: string
|
||||
}
|
||||
|
||||
export interface ISites {
|
||||
_id?: string
|
||||
attiva?: boolean
|
||||
@@ -213,6 +230,7 @@ export interface ISites {
|
||||
confsite: IOption
|
||||
description?: string
|
||||
keywords?: string
|
||||
contacts?: IContacts
|
||||
}
|
||||
|
||||
export interface INewsToSent {
|
||||
|
||||
@@ -16,6 +16,7 @@ export default defineComponent({
|
||||
setup() {
|
||||
|
||||
const mysite = ref(null)
|
||||
const tab = ref('server')
|
||||
|
||||
const globalStore = useGlobalStore()
|
||||
|
||||
@@ -28,6 +29,7 @@ export default defineComponent({
|
||||
return {
|
||||
mysite,
|
||||
costanti,
|
||||
tab,
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
@@ -31,10 +31,10 @@
|
||||
:rec="mysite"
|
||||
mykey="adminemail"
|
||||
debounce="1000"
|
||||
:type="costanti.FieldType.string"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
|
||||
|
||||
<CMyFieldDb
|
||||
title="Titolo"
|
||||
table="sites"
|
||||
@@ -51,6 +51,7 @@
|
||||
table="sites"
|
||||
:id="mysite._id"
|
||||
:rec="mysite"
|
||||
:type="costanti.FieldType.string"
|
||||
mykey="description"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
@@ -61,10 +62,119 @@
|
||||
:id="mysite._id"
|
||||
:rec="mysite"
|
||||
mykey="keywords"
|
||||
:type="costanti.FieldType.string"
|
||||
debounce="1000"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
|
||||
<q-tabs v-model="tab" inline-label class="bg-yellow shadow-2">
|
||||
<q-tab name="server" label="Server" icon="mail" />
|
||||
<q-tab name="contacts" label="Contatti" icon="mail" />
|
||||
</q-tabs>
|
||||
|
||||
<q-tab-panels v-model="tab" animated>
|
||||
<q-tab-panel name="contacts">
|
||||
<CMyFieldDb
|
||||
table="sites"
|
||||
title="Facebook"
|
||||
:id="mysite._id"
|
||||
:rec="mysite"
|
||||
mykey="contacts"
|
||||
mysubkey="facebook"
|
||||
debounce="1000"
|
||||
:type="costanti.FieldType.string"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
<CMyFieldDb
|
||||
table="sites"
|
||||
title="Instagram"
|
||||
:id="mysite._id"
|
||||
:rec="mysite"
|
||||
mykey="contacts"
|
||||
mysubkey="instagram"
|
||||
debounce="1000"
|
||||
:type="costanti.FieldType.string"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
<CMyFieldDb
|
||||
table="sites"
|
||||
title="Whatsapp"
|
||||
:id="mysite._id"
|
||||
:rec="mysite"
|
||||
mykey="contacts"
|
||||
mysubkey="whatsapp"
|
||||
debounce="1000"
|
||||
:type="costanti.FieldType.string"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
<CMyFieldDb
|
||||
table="sites"
|
||||
title="Whatsapp_home"
|
||||
:id="mysite._id"
|
||||
:rec="mysite"
|
||||
mykey="contacts"
|
||||
mysubkey="whatsapp_home"
|
||||
debounce="1000"
|
||||
:type="costanti.FieldType.boolean"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
<CMyFieldDb
|
||||
table="sites"
|
||||
title="Telegram"
|
||||
:id="mysite._id"
|
||||
:rec="mysite"
|
||||
mykey="contacts"
|
||||
mysubkey="telegram"
|
||||
debounce="1000"
|
||||
:type="costanti.FieldType.string"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
<CMyFieldDb
|
||||
table="sites"
|
||||
title="YouTube"
|
||||
:id="mysite._id"
|
||||
:rec="mysite"
|
||||
mykey="contacts"
|
||||
mysubkey="youtube"
|
||||
debounce="1000"
|
||||
:type="costanti.FieldType.string"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
<CMyFieldDb
|
||||
table="sites"
|
||||
title="Email"
|
||||
:id="mysite._id"
|
||||
:rec="mysite"
|
||||
mykey="contacts"
|
||||
mysubkey="email"
|
||||
debounce="1000"
|
||||
:type="costanti.FieldType.string"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
<CMyFieldDb
|
||||
table="sites"
|
||||
title="Address"
|
||||
:id="mysite._id"
|
||||
:rec="mysite"
|
||||
mykey="contacts"
|
||||
mysubkey="address"
|
||||
debounce="1000"
|
||||
:type="costanti.FieldType.string"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
<CMyFieldDb
|
||||
table="sites"
|
||||
title="Map"
|
||||
:id="mysite._id"
|
||||
:rec="mysite"
|
||||
mykey="contacts"
|
||||
mysubkey="map"
|
||||
debounce="1000"
|
||||
:type="costanti.FieldType.string"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
</q-tab-panel>
|
||||
<q-tab-panel name="server">
|
||||
<CMyFieldDb
|
||||
title="Host"
|
||||
table="sites"
|
||||
@@ -72,6 +182,7 @@
|
||||
:rec="mysite"
|
||||
mykey="host"
|
||||
debounce="1000"
|
||||
:type="costanti.FieldType.string"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
|
||||
@@ -82,6 +193,7 @@
|
||||
:rec="mysite"
|
||||
mykey="host_test"
|
||||
debounce="1000"
|
||||
:type="costanti.FieldType.string"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
|
||||
@@ -92,13 +204,18 @@
|
||||
:rec="mysite"
|
||||
field="confsite.options"
|
||||
:canEdit="true"
|
||||
:canModify="true">
|
||||
:canModify="true"
|
||||
>
|
||||
</CMyFieldRec>
|
||||
</q-tab-panel>
|
||||
</q-tab-panels>
|
||||
|
||||
<CMyFieldDb title="BOT Telegram"
|
||||
<CMyFieldDb
|
||||
title="BOT Telegram"
|
||||
mykey="TELEG_BOT_LINK"
|
||||
:serv="false"
|
||||
:type="costanti.FieldType.string">
|
||||
:type="costanti.FieldType.string"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
|
||||
<CMyFieldDb
|
||||
@@ -133,7 +250,6 @@
|
||||
debounce="1000"
|
||||
>
|
||||
</CMyFieldDb>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</CMyPage>
|
||||
|
||||
@@ -125,6 +125,7 @@ export const colgallery = [
|
||||
|
||||
export const colmylistcards = [
|
||||
AddCol({ name: 'imagefile', label_trans: 'imagefile', fieldtype: costanti.FieldType.string }),
|
||||
AddCol({ name: 'image', label_trans: 'image', fieldtype: costanti.FieldType.string }),
|
||||
AddCol({ name: 'alt', label_trans: 'alt', fieldtype: costanti.FieldType.string }),
|
||||
AddCol({ name: 'description', label_trans: 'description', fieldtype: costanti.FieldType.string }),
|
||||
AddCol({ name: 'style', label_trans: 'style' }),
|
||||
@@ -146,6 +147,7 @@ export const colmyelems = [
|
||||
AddCol({ name: 'container3', label_trans: 'myelems.container3' }),
|
||||
AddCol({ name: 'img', label_trans: 'myelems.img' }),
|
||||
AddCol({ name: 'align', label_trans: 'myelems.align', fieldtype: costanti.FieldType.number }),
|
||||
AddCol({ name: 'vertalign', label_trans: 'myelems.vertalign', fieldtype: costanti.FieldType.number }),
|
||||
AddCol({ name: 'fit', label_trans: 'myelems.fit', fieldtype: costanti.FieldType.string }),
|
||||
AddCol({ name: 'parambool', label_trans: 'myelems.parambool', fieldtype: costanti.FieldType.boolean }),
|
||||
AddCol({ name: 'parambool2', label_trans: 'myelems.parambool2', fieldtype: costanti.FieldType.boolean }),
|
||||
@@ -163,6 +165,7 @@ export const colmyelems = [
|
||||
AddCol({ name: 'width', label_trans: 'myelems.width', fieldtype: costanti.FieldType.number }),
|
||||
AddCol({ name: 'onlyif_logged', label_trans: 'myelems.onlyif_logged', fieldtype: costanti.FieldType.boolean }),
|
||||
AddCol({ name: 'color', label_trans: 'myelems.color' }),
|
||||
AddCol({ name: 'colorsub', label_trans: 'myelems.colorsub' }),
|
||||
AddCol({ name: 'class', label_trans: 'myelems.class' }),
|
||||
AddCol({ name: 'styleadd', label_trans: 'myelems.styleadd' }),
|
||||
AddCol({
|
||||
@@ -1460,6 +1463,56 @@ export const colTableSites = [
|
||||
fieldtype: costanti.FieldType.binary,
|
||||
jointable: 'confsite_opt',
|
||||
}),
|
||||
AddCol({
|
||||
name: 'contacts.facebook',
|
||||
field: 'contacts',
|
||||
subfield: 'facebook',
|
||||
label_trans: 'reg.facebook',
|
||||
fieldtype: costanti.FieldType.string,
|
||||
}),
|
||||
AddCol({
|
||||
name: 'contacts.instagram',
|
||||
field: 'contacts',
|
||||
subfield: 'instagram',
|
||||
label_trans: 'reg.instagram',
|
||||
}),
|
||||
AddCol({
|
||||
name: 'contacts.whatsapp',
|
||||
field: 'contacts',
|
||||
subfield: 'whatsapp',
|
||||
label_trans: 'reg.whatsapp',
|
||||
}),
|
||||
AddCol({
|
||||
name: 'contacts.whatsapp',
|
||||
field: 'contacts',
|
||||
subfield: 'whatsapp',
|
||||
label_trans: 'reg.whatsapp_home',
|
||||
fieldtype: costanti.FieldType.boolean,
|
||||
}),
|
||||
AddCol({
|
||||
name: 'contacts.telegram',
|
||||
field: 'contacts',
|
||||
subfield: 'telegram',
|
||||
label_trans: 'reg.telegram',
|
||||
}),
|
||||
AddCol({
|
||||
name: 'contacts.email',
|
||||
field: 'contacts',
|
||||
subfield: 'email',
|
||||
label_trans: 'reg.email',
|
||||
}),
|
||||
AddCol({
|
||||
name: 'contacts.address',
|
||||
field: 'contacts',
|
||||
subfield: 'address',
|
||||
label_trans: 'reg.address',
|
||||
}),
|
||||
AddCol({
|
||||
name: 'contacts.map',
|
||||
field: 'contacts',
|
||||
subfield: 'map',
|
||||
label_trans: 'reg.map',
|
||||
}),
|
||||
AddCol(DeleteRec),
|
||||
AddCol(DuplicateRec),
|
||||
]
|
||||
|
||||
@@ -12,7 +12,7 @@ import {
|
||||
ITodo,
|
||||
IUserFields,
|
||||
Privacy,
|
||||
TipoVisu, IGroup, IMySkill, IMyBacheca, IImgGallery, IMsgGlobParam, IUserExport, ISpecialField, IAccount, IMyCircuit, ISendCoin, IMovement, IMovVisu, INotif,
|
||||
TipoVisu, IGroup, IMySkill, IMyBacheca, IImgGallery, IMsgGlobParam, IUserExport, ISpecialField, IAccount, IMyCircuit, ISendCoin, IMovement, IMovVisu, INotif, IMyElem, IMyCard,
|
||||
} from '@model'
|
||||
|
||||
import { fieldsTable } from '@store/Modules/fieldsTable'
|
||||
@@ -593,6 +593,22 @@ export const tools = {
|
||||
},
|
||||
],
|
||||
|
||||
SelectListAnimation: [
|
||||
{
|
||||
label: '[Nessuna]',
|
||||
value: '',
|
||||
},
|
||||
{
|
||||
label: 'Dal basso verso l\'alto',
|
||||
value: 'anim_toBottom',
|
||||
},
|
||||
{
|
||||
label: 'Da sinistra verso Destra',
|
||||
value: 'anim_toRight',
|
||||
},
|
||||
|
||||
],
|
||||
|
||||
SelectListClass: [
|
||||
{
|
||||
label: '[Nessuna]',
|
||||
@@ -632,6 +648,33 @@ export const tools = {
|
||||
},
|
||||
],
|
||||
|
||||
SelectListVertAlign: [
|
||||
{
|
||||
label: '[Nessuno]',
|
||||
value: 0,
|
||||
},
|
||||
{
|
||||
label: 'Alto',
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: 'Centro',
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: 'Basso',
|
||||
value: 3,
|
||||
},
|
||||
{
|
||||
label: 'Basso_Sinistra',
|
||||
value: 4,
|
||||
},
|
||||
{
|
||||
label: 'Alto_Sinistra',
|
||||
value: 5,
|
||||
},
|
||||
],
|
||||
|
||||
SelectListAlign: [
|
||||
{
|
||||
label: '[Nessuno]',
|
||||
@@ -6838,6 +6881,25 @@ export const tools = {
|
||||
return ris
|
||||
},
|
||||
|
||||
getImgFileByFilename(elem: IMyElem, filename: string) {
|
||||
return 'upload/pages/' + elem.path + '/' + filename
|
||||
},
|
||||
|
||||
getImgFileByElem(elem: IMyElem, reccard?: IMyCard) {
|
||||
if (elem) {
|
||||
if (elem.type === shared_consts.ELEMTYPE.CARD) {
|
||||
if (reccard?.imagefile)
|
||||
return 'upload/pages/' + elem.path + '/' + reccard.imagefile
|
||||
else
|
||||
return ''
|
||||
} else if (elem.type === shared_consts.ELEMTYPE.IMAGE) {
|
||||
return 'upload/pages/' + elem.path + '/' + elem.container
|
||||
} else {
|
||||
return 'upload/pages/' + elem.path + '/' + elem.image
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// getLocale() {
|
||||
// if (navigator.languages && navigator.languages.length > 0) {
|
||||
// return navigator.languages[0]
|
||||
|
||||
BIN
upload/pages/home/sfondo.jpg
Normal file
BIN
upload/pages/home/sfondo.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 181 KiB |
@@ -2720,6 +2720,11 @@ alphanum-sort@^1.0.1, alphanum-sort@^1.0.2:
|
||||
resolved "https://registry.yarnpkg.com/alphanum-sort/-/alphanum-sort-1.0.2.tgz#97a1119649b211ad33691d9f9f486a8ec9fbe0a3"
|
||||
integrity sha512-0FcBfdcmaumGPQ0qPn7Q5qTgz/ooXgIyp1rf8ik5bGX8mpE2YHjC0P/eyQvxu1GURYQgq9ozf2mteQ5ZD9YiyQ==
|
||||
|
||||
animate.css@^4.1.1:
|
||||
version "4.1.1"
|
||||
resolved "https://registry.yarnpkg.com/animate.css/-/animate.css-4.1.1.tgz#614ec5a81131d7e4dc362a58143f7406abd68075"
|
||||
integrity sha512-+mRmCTv6SbCmtYJCN4faJMNFVNN5EuCTTprDTAo7YzIGji2KADmakjVA3+8mVDkZ2Bf09vayB35lSQIex2+QaQ==
|
||||
|
||||
ansi-align@^3.0.1:
|
||||
version "3.0.1"
|
||||
resolved "https://registry.yarnpkg.com/ansi-align/-/ansi-align-3.0.1.tgz#0cdf12e111ace773a86e9a1fad1225c43cb19a59"
|
||||
|
||||
Reference in New Issue
Block a user