surya/myprojplanet_vite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Animations, Policy, Toolbar Colors

Browse Source
This commit is contained in:
Surya Paolo
2022-11-23 10:27:36 +01:00
parent 358bdd5d1e
commit 46bf74e9e2
48 changed files with 1852 additions and 630 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/LandingFooter/LandingFooter.scss
View File

@@ -6,9 +6,9 @@ $textcol_scuro: darkblue;
.landing__footer {
//background: -webkit-gradient(linear, left top, left bottom, color-stop(65%, rgba(0, 0, 0, .1)), to(#000));
background: linear-gradient(180deg, rgb(6, 31, 92) 95%, #FFF);
padding-top: 4.5rem !important;
padding-bottom: 4.5rem !important;
background: linear-gradient(180deg, #061f5c 95%, #FFF);
padding-top: 3.5rem !important;
padding-bottom: 3.5rem !important;
padding-left: 1.25rem;
padding-right: 1.25rem;
color: #9f9f9f;
@@ -156,6 +156,18 @@ $textcol_scuro: darkblue;
color: #999;
letter-spacing: 0.125rem;
}
.mycontacts_email {
text-shadow: 0.125rem 0.125rem 0.125rem #555;
font-weight: bold;
color: #999;
}
.mycontacts_cell {
text-shadow: 0.125rem 0.125rem 0.125rem #555;
font-weight: bold;
color: #999;
font-size: 1.25rem;
}
.mycontacts_text {
font-size: 1rem;
@@ -170,6 +182,7 @@ $textcol_scuro: darkblue;
.footer_link:hover {
color:white;
cursor: pointer;
}
@@ -180,3 +193,8 @@ $textcol_scuro: darkblue;
.margin_buttons_footer > * {
margin: 4px 8px;
}
.mycontacts_address {
font-size: 1rem;
color: gray;
}

12
src/components/LandingFooter/LandingFooter.ts
View File

@@ -1,4 +1,5 @@
import {
computed,
defineComponent, ref,
} from 'vue'
@@ -27,6 +28,16 @@ export default defineComponent({
const site = ref(globalStore.site)
const getBackColorText = computed(() => {
let mycol = ''
if (globalStore.site && globalStore.site.confpages?.col_bgfooter)
mycol = globalStore.site.confpages?.col_bgfooter
else
mycol = '#061f5c'
return 'linear-gradient(180deg, ' + mycol + ' 95%, #FFF)'
})
console.log('LandingFooter - INIT')
function TelegramSupport() {
@@ -76,6 +87,7 @@ export default defineComponent({
getarrValDb,
getValDb,
site,
getBackColorText,
}
},
})

285
src/components/LandingFooter/LandingFooter.vue
View File

@@ -1,38 +1,92 @@
<template>
<div>
<section v-if="site" class="landing__footer">
<section v-if="site && site.contacts" class="landing__footer" :style="`background: `+ getBackColorText + `!important;`">
<div class="row justify-between items-start q-col-gutter-xs">
<div class="col-12 col-sm-4 ">
<div class="col-12 col-sm-4">
<!--<span v-html="t('homepage.footer.description')">-->
<!--</span>-->
<CFacebookFrame
myclass="text-center" :fbimage="getValDb('FBPAGE_IMG', false)"
:urlfbpage="getValDb('FBPAGE_FRAME', false)" :title="getValDb('FBPAGE_TITLE', false)">
v-if="getValDb('FBPAGE_IMG', false)"
myclass="text-center"
:fbimage="getValDb('FBPAGE_IMG', false)"
:urlfbpage="getValDb('FBPAGE_FRAME', false)"
:title="getValDb('FBPAGE_TITLE', false)"
>
</CFacebookFrame>
<div class=" q-my-md">
<div class="landing__footer-icons row flex-center margin_buttons">
<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>
<div class="">
<div v-if="!!site.contacts && !!site.contacts.address">
<p class="mycontacts_title q-mt-sm">
{{ $t('footer.titleaddress') }}
</p>
<p class="mycontacts_address">
{{ site.contacts.address }}
</p>
</div>
<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>
<div class="landing__footer-icons row flex-center margin_buttons">
<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="!!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">
<i aria-hidden="true" class="q-icon fab fa-twitter icon_contact links"> </i></a>
<i
aria-hidden="true"
class="q-icon fab fa-twitter icon_contact links"
>
</i
></a>
<a v-if="!!TelegramSupport()" :href="TelegramSupport()" target="_blank">
<a
v-if="!!TelegramSupport()"
:href="TelegramSupport()"
target="_blank"
>
<span class="text-h5 text-white">Supporto Tecnico: </span>
<i aria-hidden="true" class="q-icon fab fa-telegram icon_contact links"></i></a>
<i
aria-hidden="true"
class="q-icon fab fa-telegram icon_contact links"
></i
></a>
<a v-if="!!ChatWhatsapp()" :href="ChatWhatsapp()" target="_blank">
<i aria-hidden="true" class="q-icon fab fa-whatsapp icon_contact links"></i></a>
<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">
<i aria-hidden="true" class="q-icon fab fa-telegram icon_contact links"></i></a>
<a
v-if="!!Telegram_UsernameHttp()"
:href="Telegram_UsernameHttp()"
target="_blank"
>
<i
aria-hidden="true"
class="q-icon fab fa-telegram icon_contact links"
></i
></a>
<!--<a href="" target="_blank"><i aria-hidden="true" class="q-icon fab fa-github"> </i></a>-->
<!--<a href="https://twitter.com/" target="_blank"><i aria-hidden="true" class="q-icon fab fa-twitter"> </i></a>-->
@@ -47,91 +101,154 @@
<div v-if="site.contacts.map" class="text-center">
<span v-html="getValDb('MAP_TITLE', false)"></span>
<br>
<a :href="site.contacts.map" target="_blank" class="footer_link">Apri Mappa</a>
<br />
<a :href="site.contacts.map" target="_blank" class="footer_link"
>Apri Mappa</a
>
</div>
<!--<div class="q-mt-xs copyrights">-->
<!--<p class="mycontacts_text" v-html="t('homepage.copyrights')"></p>-->
<!--</div>-->
</div>
<div class="col-12 col-sm-4">
<div class="text-center">
<p class="mycontacts_title q-mt-sm">{{ $t('homepage.titlecontatti') }}:</p>
<div class="text-center q-my-sm">
<div class="q-mt-xs mycontacts">
<p class="mycontacts_title">{{ $t('homepage.titlecontatti') }}</p>
<div class="mycontacts_text">
<i
v-if="site.contacts.email" aria-hidden="true"
class="q-icon fas fa-envelope q-mx-sm"></i>
<a :href="`mailto:` + site.contacts.email" class="links">{{
site.contacts.email
}}</a><br>
<div style="margin-bottom: 20px;"></div>
<div class="row margin_buttons_footer">
<div class="row justify-center margin_buttons_x">
<q-btn
v-if="site.contacts.cell"
fab-mini
icon="fas fa-phone"
color="blue-grey-6"
type="a"
size="sm"
target="__blank"
>
</q-btn>
&nbsp;&nbsp;
<div v-if="!!site.contacts.cell" class="mycontacts_cell">
{{ site.contacts.cell }}
</div>
</div>
<div class="row justify-center margin_buttons_x">
<q-btn
v-if="site.contacts.email"
fab-mini
icon="fas fa-envelope"
color="blue-grey-6"
type="a"
size="sm"
:href="tools.getemailto(site.contacts.email)"
target="__blank"
>
</q-btn>
&nbsp;&nbsp;
<a
class="mycontacts_email"
v-if="!!site.contacts.email"
:href="tools.getemailto(site.contacts.email)"
target="_blank"
>{{ site.contacts.email }}</a
><br />
</div>
<div v-if="!!site.contacts.info2" class="mycontacts_email">{{site.contacts.info2}}</div>
</div>
&nbsp;<br />
<div style="margin-bottom: 20px"></div>
<div
v-for="(rec, index) in getarrValDb('CONTACTS_EMAIL_CELL', false)"
v-for="(rec, index) in getarrValDb(
'CONTACTS_EMAIL_CELL',
false
)"
:key="index"
class="mycontacts_text margin_buttons_footer"
style="margin-bottom: 0;">
<div>
{{ rec.name }}: {{ rec.phone }}
</div>
style="margin-bottom: 0"
>
<div>{{ rec.name }}: {{ rec.phone }}</div>
<div>
<i
v-if="rec.email" aria-hidden="true"
class="q-icon fas fa-envelope q-ma-sm"></i> <a
:href="`mailto:`+ rec.email "
class="links">{{ rec.email }}</a>
v-if="rec.email"
aria-hidden="true"
class="q-icon fas fa-envelope q-ma-sm"
></i>
<a :href="`mailto:` + rec.email" class="links">{{
rec.email
}}</a>
</div>
<div class="row justify-center margin_buttons_footer">
<q-btn
v-if="rec.email" fab-mini icon="fas fa-envelope"
color="blue-grey-6" type="a"
v-if="rec.email"
fab-mini
icon="fas fa-envelope"
color="blue-grey-6"
type="a"
size="sm"
:href="tools.getemailto(rec.email)" target="__blank">
:href="tools.getemailto(rec.email)"
target="__blank"
>
</q-btn>
<q-btn
v-if="!!rec.wa && tools.getHttpForWhatsapp(rec.wa)" fab-mini
v-if="!!rec.wa && tools.getHttpForWhatsapp(rec.wa)"
fab-mini
icon="fab fa-whatsapp"
color="green" type="a"
color="green"
type="a"
size="sm"
:href="tools.getHttpForWhatsapp(rec.wa)" target="__blank">
:href="tools.getHttpForWhatsapp(rec.wa)"
target="__blank"
>
</q-btn>
<q-btn
v-if="tools.getHttpForTelegram(rec.usertelegram)" fab-mini
v-if="tools.getHttpForTelegram(rec.usertelegram)"
fab-mini
icon="fab fa-telegram"
color="blue" type="a"
color="blue"
type="a"
size="sm"
:href="tools.getHttpForTelegram(rec.usertelegram)" target="__blank">
:href="tools.getHttpForTelegram(rec.usertelegram)"
target="__blank"
>
</q-btn>
</div>
</div>
<span v-if="getValDb('CALL_WORKING_DAYS', false)"><br>orari per chiamate:<br>
<span v-html="getValDb('CALL_WORKING_DAYS', false)"></span></span>
<span v-if="getValDb('CALL_WORKING_DAYS', false)"
><br />orari per chiamate:<br />
<span v-html="getValDb('CALL_WORKING_DAYS', false)"></span
></span>
</div>
</div>
</div>
<FormNewsletter
v-if="static_data.functionality.SHOW_NEWSLETTER"
:idwebsite="tools.appid()"
:locale="toolsext.getLocale()">
:locale="toolsext.getLocale()"
>
</FormNewsletter>
<p class="text-center">
<router-link v-if="static_data.functionality.SHOW_ONLY_POLICY" to="/policy" custom v-slot="{ navigate }">
<span class="footer_link" @click="navigate" @keypress.enter="navigate" role="link">{{
$t('privacy_policy')
}}</span></router-link>
<router-link
v-if="site.policy && site.policy.show"
to="/policy"
custom
v-slot="{ navigate }"
>
<span
class="footer_link"
@click="navigate"
@keypress.enter="navigate"
role="link"
>{{ $t('privacy_policy') }}</span
></router-link
>
</p>
</div>
<div class="col-12 col-sm-4 q-pa-md">
@@ -140,17 +257,24 @@
</p>
<div v-for="(myitemmenu, ind) in static_data.routes" :key="ind">
<div v-if="myitemmenu.infooter && tools.visumenu(myitemmenu)">
<div v-if="myitemmenu.solotitle">
<span class="footer_link">{{ tools.getLabelByItem(myitemmenu) }}</span><br/>
<span class="footer_link">{{
tools.getLabelByItem(myitemmenu)
}}</span
><br />
</div>
<div v-else>
<router-link :to="myitemmenu.path" custom v-slot="{ navigate }">
<span
class="footer_link" @click="navigate" @keypress.enter="navigate"
role="link"><span
v-if="myitemmenu.level_child > 0">&nbsp;&nbsp;&nbsp;</span>
{{ tools.getLabelByItem(myitemmenu) }}</span><br/>
<span
class="footer_link"
@click="navigate"
@keypress.enter="navigate"
role="link"
><span v-if="myitemmenu.level_child > 0"
>&nbsp;&nbsp;&nbsp;</span
>
{{ tools.getLabelByItem(myitemmenu) }}</span
><br />
</router-link>
</div>
</div>
@@ -158,13 +282,28 @@ class="footer_link" @click="navigate" @keypress.enter="navigate"
</div>
</div>
</section>
<q-page-sticky v-if="site.whatsapp_home" 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"/>
fab
icon="fab fa-whatsapp"
color="green"
type="a"
:href="ChatWhatsapp()"
target="__blank"
class="mybtn_sticky"
/>
</q-page-sticky>
<q-page-scroller position="bottom-right" :scroll-offset="850" :offset="[18, 18]" style="opacity: 0.3">
<q-btn fab icon="keyboard_arrow_up" color="accent"/>
<q-page-scroller
position="bottom-right"
:scroll-offset="850"
:offset="[18, 18]"
style="opacity: 0.3"
>
<q-btn fab icon="keyboard_arrow_up" color="accent" />
</q-page-scroller>
</div>
</template>