- Rifatto Committ (era errato quello prima , avevo mischiato quello di brigitte...)
- Corretto Tragitto 6/7 Nave Sognatore...
This commit is contained in:
Paolo Arena
@@ -15,6 +15,30 @@ p {
|
||||
//text-shadow: .125rem .125rem .25rem $grayshadow;
|
||||
}
|
||||
|
||||
.logo{
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
max-height: 200px;
|
||||
max-width: 200px;
|
||||
@media (max-width: 718px) {
|
||||
max-height: 100px;
|
||||
max-width: 100px;
|
||||
}
|
||||
}
|
||||
|
||||
.data_start{
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
max-height: 150px;
|
||||
max-width: 250px;
|
||||
@media (max-width: 718px) {
|
||||
max-height: 90px;
|
||||
max-width: 180px;
|
||||
}
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
@@ -27,8 +51,8 @@ h4 {
|
||||
}
|
||||
|
||||
.landing_background {
|
||||
background: #000 url(../../statics/images/background.jpg) no-repeat 50% fixed;
|
||||
background-size: cover
|
||||
background: #000 url(../../statics/images/foto1.jpg) no-repeat 100% fixed;
|
||||
background-size: contain !important;
|
||||
}
|
||||
|
||||
.landing > section {
|
||||
@@ -61,7 +85,7 @@ h4 {
|
||||
min-width: 350px;
|
||||
}
|
||||
|
||||
&__comeassociarsi{
|
||||
&__comeassociarsi {
|
||||
min-width: 350px;
|
||||
}
|
||||
}
|
||||
@@ -74,6 +98,15 @@ h4 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.subtitle_small {
|
||||
font-weight: 600;
|
||||
text-align: center;
|
||||
letter-spacing: 0.125rem;
|
||||
text-transform: uppercase;
|
||||
font-size: 1rem;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.landing > section.padding {
|
||||
padding: 5.62rem 1rem;
|
||||
}
|
||||
@@ -90,10 +123,13 @@ h4 {
|
||||
|
||||
.landing > section > div {
|
||||
position: relative;
|
||||
max-width: 1240px;
|
||||
width: 100%
|
||||
}
|
||||
|
||||
.maxwidth1200 {
|
||||
max-width: 1200px;
|
||||
}
|
||||
|
||||
.landing__toolbar {
|
||||
background: -webkit-gradient(linear, left top, left bottom, from(#000), to(transparent));
|
||||
background: linear-gradient(180deg, #000, transparent);
|
||||
@@ -107,11 +143,11 @@ h4 {
|
||||
}
|
||||
|
||||
.landing__hero {
|
||||
min-height: 70vh
|
||||
min-height: 20vh
|
||||
}
|
||||
|
||||
.landing__header {
|
||||
height: 18vh
|
||||
height: 0vh
|
||||
}
|
||||
|
||||
.landing__arrow {
|
||||
@@ -125,8 +161,8 @@ h4 {
|
||||
}
|
||||
|
||||
.landing__logo {
|
||||
width: 9.40rem;
|
||||
height: 9.40rem;
|
||||
width: 4.40rem;
|
||||
height: 4.40rem;
|
||||
margin-top: 1.315rem;
|
||||
//-webkit-animation: logo-rotate 240s linear infinite;
|
||||
//animation: logo-rotate 240s linear infinite
|
||||
@@ -211,7 +247,6 @@ body.mobile .landing:before {
|
||||
z-index: -1;
|
||||
//background: #000 url(../../statics/images/cover.jpg) 50%;
|
||||
|
||||
background-size: cover
|
||||
}
|
||||
|
||||
/*
|
||||
@@ -249,16 +284,12 @@ body.mobile .landing:before {
|
||||
text-shadow: 0.125rem 0.125rem 0.25rem $grayshadow;
|
||||
}
|
||||
|
||||
.shadow-max {
|
||||
//color: white;
|
||||
text-shadow: .25rem .25rem .5rem $grayshadow;
|
||||
}
|
||||
|
||||
.text-h1 {
|
||||
font-size: 6rem;
|
||||
font-weight: 300;
|
||||
line-height: 6rem;
|
||||
.text-h1, h1 {
|
||||
font-size: 3rem;
|
||||
font-weight: bold;
|
||||
line-height: 3rem;
|
||||
letter-spacing: -.01562em;
|
||||
margin-bottom: 8px !important;
|
||||
}
|
||||
|
||||
.text-h2 {
|
||||
@@ -272,7 +303,7 @@ body.mobile .landing:before {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.text-vers{
|
||||
.text-vers {
|
||||
font-size: 0.75rem;
|
||||
font-weight: 400;
|
||||
line-height: 1.75rem;
|
||||
@@ -280,22 +311,21 @@ body.mobile .landing:before {
|
||||
text-shadow: .25rem .25rem .5rem $grayshadow;
|
||||
}
|
||||
|
||||
//
|
||||
//.homep-cover-img-1 {
|
||||
// background: #000 url(../../statics/images/foto1.jpg) no-repeat 50% fixed;
|
||||
// //transition: background-image 1s ease-in-out;
|
||||
//}
|
||||
//
|
||||
//.homep-cover-img-2 {
|
||||
// background: #000 url(../../statics/images/foto2.jpg) no-repeat 50% fixed;
|
||||
// //transition: background-image 1s ease-in-out;
|
||||
//}
|
||||
//
|
||||
//.homep-cover-img-3 {
|
||||
// background: #000 url(../../statics/images/foto3.jpg) no-repeat 50% fixed;
|
||||
// //transition: background-image 1s ease-in-out;
|
||||
//}
|
||||
//
|
||||
.homep-cover-img-1 {
|
||||
background: #000 url(../../statics/images/foto1.jpg) no-repeat 50% fixed;
|
||||
//transition: background-image 1s ease-in-out;
|
||||
}
|
||||
|
||||
.homep-cover-img-2 {
|
||||
background: #000 url(../../statics/images/foto2.jpg) no-repeat 50% fixed;
|
||||
//transition: background-image 1s ease-in-out;
|
||||
}
|
||||
|
||||
.homep-cover-img-3 {
|
||||
background: #000 url(../../statics/images/foto3.jpg) no-repeat 50% fixed;
|
||||
//transition: background-image 1s ease-in-out;
|
||||
}
|
||||
|
||||
.homep-cover-img.hide-filter:before {
|
||||
opacity: 0
|
||||
}
|
||||
@@ -326,7 +356,7 @@ body.mobile .landing:before {
|
||||
}
|
||||
|
||||
.clgutter {
|
||||
margin-top: 1.25rem;
|
||||
margin-top: 0.25rem;
|
||||
padding: .62rem;
|
||||
}
|
||||
|
||||
@@ -337,25 +367,23 @@ body.mobile .landing:before {
|
||||
background-repeat: no-repeat !important;
|
||||
}
|
||||
|
||||
|
||||
@media (max-width: 718px) {
|
||||
// PER VERSIONE MOBILE
|
||||
|
||||
.landing__hero {
|
||||
min-height: 50vh;
|
||||
text-align: center
|
||||
}
|
||||
.landing__header {
|
||||
height: 7vh
|
||||
height: 10vh
|
||||
}
|
||||
.clgutter {
|
||||
margin-top: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.landing__hero .text-h1 {
|
||||
font-size: 3rem;
|
||||
line-height: 3.05rem;
|
||||
margin-bottom: 1.5rem
|
||||
.landing__hero .text-h1, h1 {
|
||||
font-size: 2rem;
|
||||
line-height: 2.05rem;
|
||||
margin-bottom: 1.25rem
|
||||
}
|
||||
|
||||
.landing > section.padding {
|
||||
@@ -370,6 +398,14 @@ body.mobile .landing:before {
|
||||
.landing > section.padding_gallery {
|
||||
padding-top: 3.125rem;
|
||||
padding-bottom: 5.625rem;
|
||||
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
.landing > section.padding_gallery > div {
|
||||
padding-top: 3.125rem;
|
||||
padding-bottom: 5.625rem;
|
||||
|
||||
}
|
||||
|
||||
.landing__features h4, .landing__features h6 {
|
||||
@@ -388,6 +424,9 @@ body.mobile .landing:before {
|
||||
.landing__hero-content {
|
||||
padding-bottom: 11.25rem;
|
||||
}
|
||||
.landing__hero2-content {
|
||||
padding-bottom: 7.25rem;
|
||||
}
|
||||
.landing__hero-btns {
|
||||
-webkit-box-pack: center;
|
||||
-ms-flex-pack: center;
|
||||
@@ -401,13 +440,13 @@ body.mobile .landing:before {
|
||||
.text-subtitle1 {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
.text-vers{
|
||||
.text-vers {
|
||||
font-size: 0.6rem;
|
||||
}
|
||||
|
||||
.carousel_img_3 {
|
||||
//background-image: url(../../statics/images/cibo_sano.jpg);
|
||||
background-size: 620px 620px !important;
|
||||
background-size: 500px 500px !important;
|
||||
background-position: 50% top !important;
|
||||
background-repeat: no-repeat !important;
|
||||
}
|
||||
@@ -421,6 +460,12 @@ body.mobile .landing:before {
|
||||
background-color: rgba(0, 0, 0, .3);
|
||||
}
|
||||
|
||||
.sfondo-grigio {
|
||||
padding: 1rem;
|
||||
color: $textcol;
|
||||
background-color: rgba(0, 0, 0, .35);
|
||||
}
|
||||
|
||||
.mycontacts {
|
||||
color: gray;
|
||||
letter-spacing: 0.078rem;
|
||||
@@ -438,9 +483,25 @@ body.mobile .landing:before {
|
||||
letter-spacing: 0.093rem;
|
||||
}
|
||||
|
||||
.text-intro {
|
||||
font-family: "Lucida Calligraphy", serif;
|
||||
font-size: 1rem !important;
|
||||
letter-spacing: 0.1rem;
|
||||
line-height: 1.5;
|
||||
.q-carousel__slide{
|
||||
padding: 8px !important;
|
||||
}
|
||||
|
||||
.step-text{
|
||||
font-size: 1.15rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.mlvalue {
|
||||
margin: 5px 5px;
|
||||
font-weight: bold;
|
||||
font-size: 1rem;
|
||||
|
||||
}
|
||||
|
||||
.q-carousel__slide{
|
||||
// background-size: auto;
|
||||
background-size: contain !important;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 50%;
|
||||
}
|
||||
|
||||
@@ -1,33 +1,48 @@
|
||||
import Vue from 'vue'
|
||||
import { Component } from 'vue-property-decorator'
|
||||
import { GlobalStore, UserStore } from '@store'
|
||||
import { GlobalStore, UserStore, NotevoleStore } from '@store'
|
||||
|
||||
import { Logo } from '../../components/logo'
|
||||
|
||||
import { Footer } from '../../components/Footer'
|
||||
import { CMyPage } from '../../components/CMyPage/index'
|
||||
|
||||
import VueScrollReveal from 'vue-scroll-reveal'
|
||||
import { tools } from '@src/store/Modules/tools'
|
||||
import { toolsext } from '@src/store/Modules/toolsext'
|
||||
import { func_tools, toolsext } from '@src/store/Modules/toolsext'
|
||||
import { Screen } from 'quasar'
|
||||
import MixinMetaTags from '@src/mixins/mixin-metatags'
|
||||
import {
|
||||
CCardCarousel,
|
||||
CImgText,
|
||||
CTitleBanner,
|
||||
CStatus,
|
||||
CStatusReg,
|
||||
CNextZoom,
|
||||
CVerifyTelegram, CVerifyEmail
|
||||
} from '@components'
|
||||
import MixinBase from '@src/mixins/mixin-base'
|
||||
import { static_data } from '@src/db/static_data'
|
||||
import { INotData } from '@src/model'
|
||||
|
||||
Vue.use(VueScrollReveal, {
|
||||
class: 'v-scroll-reveal', // A CSS class applied to elements with the v-scroll-reveal directive; useful for animation overrides.
|
||||
duration: 1200,
|
||||
scale: 0.95,
|
||||
distance: '10px',
|
||||
rotate: {
|
||||
x: 0,
|
||||
y: 0,
|
||||
z: 0
|
||||
}
|
||||
// mobile: true
|
||||
})
|
||||
// Vue.use(VueScrollReveal, {
|
||||
// class: 'v-scroll-reveal', // A CSS class applied to elements with the v-scroll-reveal directive; useful for animation overrides.
|
||||
// duration: 1200,
|
||||
// scale: 0.95,
|
||||
// distance: '10px',
|
||||
// rotate: {
|
||||
// x: 0,
|
||||
// y: 0,
|
||||
// z: 0
|
||||
// }
|
||||
// // mobile: true
|
||||
// })
|
||||
|
||||
@Component({
|
||||
components: { Logo, Footer }
|
||||
mixins: [MixinBase],
|
||||
components: { Logo, Footer, CMyPage, CCardCarousel, CTitleBanner, CImgText, CStatus, CStatusReg, CNextZoom, CVerifyTelegram, CVerifyEmail }
|
||||
})
|
||||
export default class Home extends Vue {
|
||||
export default class Home extends MixinBase {
|
||||
public text: string = ''
|
||||
public visibile: boolean = false
|
||||
public cardvisible: string = 'hidden'
|
||||
@@ -38,30 +53,117 @@ export default class Home extends Vue {
|
||||
public $q
|
||||
public polling
|
||||
public slide = 'first'
|
||||
public slide2 = 1
|
||||
public slide_video = 'yt_1'
|
||||
public mysteps = 0
|
||||
public myaudio = 0
|
||||
public mytestimonianze = 0
|
||||
public tab = 'guida'
|
||||
public slide2 = 0
|
||||
public animare: number = 0
|
||||
public getImmagini = [
|
||||
{
|
||||
title: '', subtitle: '',
|
||||
img: '../../statics/images/eventi_esterni/IMG_6035.jpg'
|
||||
},
|
||||
{
|
||||
title: '', subtitle: '',
|
||||
img: '../../statics/images/eventi_esterni/IMG_6037.jpg'
|
||||
},
|
||||
{
|
||||
title: '', subtitle: '',
|
||||
img: '../../statics/images/eventi_esterni/IMG_6401.jpg'
|
||||
},
|
||||
{
|
||||
title: '', subtitle: '',
|
||||
img: '../../statics/images/eventi_esterni/IMG_7203.jpg'
|
||||
},
|
||||
{
|
||||
title: '', subtitle: '',
|
||||
img: '../../statics/images/eventi_esterni/IMG_7209.jpg'
|
||||
}
|
||||
public endload: boolean = false
|
||||
public indvideo: number = 0
|
||||
public arrvideo_yt = []
|
||||
public arrvideo_mp4 = []
|
||||
|
||||
public arrsteps = [
|
||||
{
|
||||
label: '1',
|
||||
value: 0,
|
||||
title: {
|
||||
it: '<strong>Passo 1 - Contributore Finanziario</strong><br><br>' +
|
||||
'A) Capisco come funziona e lo condivido ad altre 2 persone che vogliono partecipare.<br>' +
|
||||
'B) Entro nella chat e dono i <strong>33€</strong> al gestore della Billettera.',
|
||||
es: '',
|
||||
enUs: ''
|
||||
},
|
||||
myicon: 'fas fa-donate',
|
||||
},
|
||||
{
|
||||
label: '2',
|
||||
value: 1,
|
||||
title: {
|
||||
it: '<strong>Passo 2 - Contributore solidale</strong><br><br>' +
|
||||
'Invio il link per registrarsi alle mie 2 persone, che cosí verseranno i 33€.',
|
||||
es: '',
|
||||
enUs: ''
|
||||
},
|
||||
myicon: 'fas fa-user-friends',
|
||||
myicon2: 'fas fa-coins'
|
||||
},
|
||||
{
|
||||
label: '3',
|
||||
value: 2,
|
||||
title: {
|
||||
it: '<strong>Passo 3 - Tesoriere/segretario</strong><br><br>' +
|
||||
'Collaboro, aggiorno la lista dei doni, fornisco informazioni, ma anche conosco, condivido esperienze, passioni e sogni.',
|
||||
es: '',
|
||||
enUs: ''
|
||||
},
|
||||
myicon: 'fas fa-piggy-bank',
|
||||
myicon2: 'far fa-laugh',
|
||||
myicon3: 'far fa-comments'
|
||||
},
|
||||
{
|
||||
label: '4',
|
||||
value: 3,
|
||||
title: {
|
||||
it: '<strong>Passo 4 - Apertura tua Billettera</strong><br>' +
|
||||
'Creo il mio gruppo Telegram nel quale entrano i miei 2 ospiti, i 2 ospiti dei miei 2 ospiti, che porteranno altre 8 persone (4x2).<br>' +
|
||||
'<br>Ricevuti i 33€ da queste 8 persone (264€), mi tengo i mei <strong>iniziali 33€</strong> e <strong>dono 231 €</strong> alla Billettera "Mas Antigua".',
|
||||
es: '',
|
||||
enUs: ''
|
||||
},
|
||||
myicon: 'fab fa-whatsapp',
|
||||
myicon2: 'fas fa-wallet'
|
||||
},
|
||||
{
|
||||
label: '5',
|
||||
value: 4,
|
||||
title: {
|
||||
it: '<strong>Passo 5</strong><br>' +
|
||||
'Aspetto, da parte delle 8 nuove Billettere, le donazioni di 231€, per un totale di <strong>1848€</strong>.<br>' +
|
||||
'<br>Ringrazio l\'<strong>Universo</strong> per il <strong>dono</strong> ricevuto e fornisco <strong>aiuto</strong> a chi ne ha bisogno.<br>' +
|
||||
'Se desidero, posso <strong>ricominciare</strong>!',
|
||||
es: '',
|
||||
enUs: ''
|
||||
},
|
||||
myicon: 'far fa-clock',
|
||||
myicon2: 'fas fa-euro-sign',
|
||||
myicon3: 'fas fa-praying-hands',
|
||||
myimg: '/' + tools.getimglogo(),
|
||||
}
|
||||
]
|
||||
|
||||
public advise = [
|
||||
{
|
||||
title: {
|
||||
it: 'La forza di questo gioco sono le Persone e la Collaborazione.<br>Vincete la timidezza e scrivete agli amici su whatsapp, facebook, Telegram.',
|
||||
es: '',
|
||||
enUs: ''
|
||||
},
|
||||
color: 'white', icon: 'fas fa-hands-helping',
|
||||
textcolor: 'black'
|
||||
},
|
||||
{
|
||||
title: {
|
||||
it: 'È un lavoro di squadra, dove ognuno fa la sua parte.',
|
||||
es: '',
|
||||
enUs: ''
|
||||
},
|
||||
color: 'white',
|
||||
icon: 'fas fa-users',
|
||||
textcolor: 'black'
|
||||
},
|
||||
{
|
||||
title: {
|
||||
it: 'E\' un\'opportunità di risentire vecchi amici, ed avere un intento comune, per risentirci e di riconnetterci.<br>',
|
||||
es: '',
|
||||
enUs: ''
|
||||
},
|
||||
color: 'white',
|
||||
icon: 'fas fa-hand-holding-heart',
|
||||
textcolor: 'black'
|
||||
}
|
||||
]
|
||||
|
||||
constructor() {
|
||||
@@ -70,25 +172,28 @@ export default class Home extends Vue {
|
||||
this.initprompt()
|
||||
}
|
||||
|
||||
get getappname(){
|
||||
return this.$t('msg.myAppName')
|
||||
public meta() {
|
||||
return tools.metafunc(this)
|
||||
}
|
||||
|
||||
get heightgallery () {
|
||||
if (Screen.width < 400) {
|
||||
return '200px'
|
||||
}else if (Screen.width < 600) {
|
||||
return '300px'
|
||||
} else {
|
||||
return '600px'
|
||||
}
|
||||
get notevolerec() {
|
||||
return UserStore.state
|
||||
}
|
||||
|
||||
get tools() {
|
||||
return tools
|
||||
}
|
||||
|
||||
get TelegVerificato() {
|
||||
return UserStore.state.my.profile.teleg_id > 0
|
||||
}
|
||||
|
||||
get visuStatus() {
|
||||
return !this.isVerificato || !this.TelegVerificato || UserStore.state.my.profile.paymenttypes.length === 0
|
||||
}
|
||||
|
||||
public mounted() {
|
||||
|
||||
let primo = true
|
||||
const mytime = 10000
|
||||
this.polling = setInterval(() => {
|
||||
@@ -99,38 +204,50 @@ export default class Home extends Vue {
|
||||
// console.log('this.firstClassSection', this.firstClassSection)
|
||||
|
||||
}, mytime)
|
||||
}
|
||||
|
||||
get appname() {
|
||||
return process.env.APP_NAME
|
||||
}
|
||||
|
||||
public beforeDestroy() {
|
||||
console.log('beforeDestroy')
|
||||
// console.log('beforeDestroy')
|
||||
clearInterval(this.polling)
|
||||
}
|
||||
|
||||
public created() {
|
||||
if (!!tools.getCookie(tools.TABBED_HOME)) {
|
||||
this.tab = tools.getCookie(tools.TABBED_HOME)
|
||||
}
|
||||
this.animare = process.env.DEV ? 0 : 8000
|
||||
|
||||
for (let index = 0; index <= tools.getvideonum(true); ++index) {
|
||||
this.arrvideo_yt.push(tools.getvideoyt(index))
|
||||
}
|
||||
for (let index = 0; index <= tools.getvideonum(false); ++index) {
|
||||
this.arrvideo_mp4.push(tools.getvideomp4src(index))
|
||||
}
|
||||
|
||||
GlobalStore.actions.prova()
|
||||
|
||||
this.endload = true
|
||||
}
|
||||
|
||||
get getvideonum_youtube() {
|
||||
return tools.getvideonum(true)
|
||||
}
|
||||
|
||||
get getvideonum_mp4() {
|
||||
return tools.getvideonum(false)
|
||||
}
|
||||
|
||||
get heightgallvideo() {
|
||||
return tools.heightgallvideo()
|
||||
}
|
||||
|
||||
get isLogged() {
|
||||
return UserStore.state.isLogged
|
||||
}
|
||||
|
||||
public meta() {
|
||||
return {
|
||||
keywords: { name: 'keywords', content: 'Quasar website' },
|
||||
// meta tags
|
||||
meta: {
|
||||
mykey: { name: 'mykey', content: 'Key 1' },
|
||||
description: { name: 'description', content: 'Page 1' },
|
||||
keywords: { name: 'keywords', content: 'Quasar website' },
|
||||
equiv: { 'http-equiv': 'Content-Type', 'content': 'text/html; charset=UTF-8' }
|
||||
}
|
||||
}
|
||||
get static_data() {
|
||||
return static_data
|
||||
}
|
||||
|
||||
public mystilecard() {
|
||||
@@ -155,7 +272,7 @@ export default class Home extends Vue {
|
||||
}
|
||||
|
||||
public initprompt() {
|
||||
window.addEventListener('beforeinstallprompt', function (event) {
|
||||
window.addEventListener('beforeinstallprompt', (event) => {
|
||||
// console.log('******************************** beforeinstallprompt fired')
|
||||
event.preventDefault()
|
||||
// console.log('§§§§§§§§§§§§§§§§§§§§ IMPOSTA DEFERRED PROMPT !!!!!!!!!!!!!!!!! ')
|
||||
@@ -201,4 +318,46 @@ export default class Home extends Vue {
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
get getappname() {
|
||||
return tools.getappname(this, false)
|
||||
}
|
||||
|
||||
public gettitle_advise(rec) {
|
||||
return rec.title[tools.getLocale()]
|
||||
}
|
||||
|
||||
public geticonlist(rec) {
|
||||
if (rec.icon) {
|
||||
return rec.icon
|
||||
} else {
|
||||
return 'fas fa-info'
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
public getfileimgdown(rec) {
|
||||
return rec.file[tools.getLocale()]
|
||||
}
|
||||
|
||||
get isVerificato() {
|
||||
return UserStore.getters.isVerificato
|
||||
}
|
||||
|
||||
get isEmailVerified() {
|
||||
return UserStore.state.my.verified_email
|
||||
}
|
||||
|
||||
public openrighttoolbar() {
|
||||
GlobalStore.state.RightDrawerOpen = true
|
||||
}
|
||||
|
||||
get TelegCode() {
|
||||
return UserStore.state.my.profile.teleg_checkcode
|
||||
}
|
||||
|
||||
public changetab(val) {
|
||||
tools.setCookie(tools.TABBED_HOME, val)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -1,135 +1,313 @@
|
||||
<template>
|
||||
<q-page class="text-white">
|
||||
<div class="landing">
|
||||
<section>
|
||||
<div class="landing__hero">
|
||||
<q-page>
|
||||
<CMyPage title="">
|
||||
<span>{{ setmeta({
|
||||
title: 'Home',
|
||||
description: $t('msg.myAppDescription'),
|
||||
keywords: $t('msg.keywords_base') } ) }}
|
||||
</span>
|
||||
|
||||
<div class="landing">
|
||||
<div v-if="!isLogged">
|
||||
<div style="height: 15px;">
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<q-img src="statics/images/background.jpg" class="logo"></q-img>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="!tools.sito_online(true)" class="row text-h4 text-center bg-warning">
|
||||
{{ $t('otherpages.sito_offline') }}
|
||||
</div>
|
||||
|
||||
<!--
|
||||
<div class="row justify-center">
|
||||
<div class="text-h5 boldhigh text-uppercase"> {{ $t('event.dateTimeStart') }}</div>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<q-img src="statics/images/data_start.jpg" class="data_start"></q-img>
|
||||
</div>
|
||||
-->
|
||||
<div v-if="isLogged">
|
||||
<CVerifyEmail v-if="!isEmailVerified">
|
||||
|
||||
</CVerifyEmail>
|
||||
|
||||
<CVerifyTelegram v-if="TelegCode || !TelegVerificato">
|
||||
|
||||
</CVerifyTelegram>
|
||||
|
||||
</div>
|
||||
<div v-else>
|
||||
<div v-if="!isLogged && static_data.functionality.ENABLE_REGISTRATION" align="center"
|
||||
style="margin:20px;">
|
||||
<q-btn rounded size="lg" color="primary" @click="openrighttoolbar">{{$t('login.enter')}}
|
||||
</q-btn>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
<div v-if="!isLogged && static_data.functionality.ENABLE_REGISTRATION" align="center" style="margin:20px;">
|
||||
<q-btn rounded size="lg" color="primary" to="/signup">{{$t('reg.submit')}}
|
||||
</q-btn>
|
||||
</div>
|
||||
-->
|
||||
|
||||
</div>
|
||||
|
||||
<q-tabs
|
||||
v-model="tab"
|
||||
dense
|
||||
class="bg-blue text-white shadow-2"
|
||||
indicator-color="white"
|
||||
align="center"
|
||||
narrow-indicator
|
||||
:breakpoint="350"
|
||||
@input="changetab"
|
||||
>
|
||||
<q-tab name="guida" icon="fas fa-check" :label="$t('pages.home')"></q-tab>
|
||||
<q-tab name="zoom" icon="fas fa-video" :label="$t('pages.nextzoom')"></q-tab>
|
||||
<q-tab name="statistiche" icon="fas fa-chart-line" :label="$t('pages.status')"></q-tab>
|
||||
|
||||
</q-tabs>
|
||||
|
||||
<q-tab-panels v-model="tab" animated>
|
||||
<q-tab-panel name="guida">
|
||||
<div v-if="isLogged">
|
||||
<CStatus :dense="false"></CStatus>
|
||||
</div>
|
||||
|
||||
</q-tab-panel>
|
||||
<q-tab-panel name="zoom">
|
||||
<CNextZoom>
|
||||
|
||||
</CNextZoom>
|
||||
|
||||
</q-tab-panel>
|
||||
<q-tab-panel name="statistiche">
|
||||
<CStatusReg>
|
||||
|
||||
</CStatusReg>
|
||||
|
||||
</q-tab-panel>
|
||||
</q-tab-panels>
|
||||
|
||||
<!--<div v-if="false">
|
||||
<CTitleBanner v-if="false" class="q-pa-xs" :title="$t('text.how')" bgcolor="bg-primary"
|
||||
clcolor="text-white"
|
||||
mystyle=" " myclass="myshad" canopen="true">
|
||||
<CImgText src="">
|
||||
<q-icon name="fas fa-gift" size="lg" inverted color="primary"></q-icon>
|
||||
<div class="q-pa-sm" v-if="toolsext.isLang('it')">
|
||||
<p class="cltexth4 text-green-8">È un gioco etico di <span class="boldhigh">Economia Circolare</span>
|
||||
dove ognuno
|
||||
entrando porta in dono <span class="boldhigh">33 €</span> ed esce con <span
|
||||
class="boldhigh">1848 €</span> alla fine del ciclo.</p>
|
||||
<p class="cltexth4 text-red-8">E' uno scambio di Reciproco Aiuto</p>
|
||||
|
||||
<p class="cltexth4 text-blue-8">
|
||||
E' un sistema Circolare Umano:<br>
|
||||
"Con il minimo sforzo ottengo il massimo apporto".
|
||||
</p>
|
||||
</div>
|
||||
</CImgText>
|
||||
|
||||
</CTitleBanner>
|
||||
|
||||
<CTitleBanner class="q-pa-xs" :title="$t('text.step')" bgcolor="bg-positive" clcolor="text-white"
|
||||
mystyle=" " canopen="true">
|
||||
<div class="q-gutter-md">
|
||||
<q-carousel
|
||||
animated
|
||||
:autoplay="animare"
|
||||
swipeable
|
||||
infinite
|
||||
navigation
|
||||
transition-next="slide-left"
|
||||
v-model="mysteps"
|
||||
transition-prev="slide-right"
|
||||
v-model="slide"
|
||||
height="100%"
|
||||
width="100%"
|
||||
transition-next="slide-left"
|
||||
swipeable
|
||||
control-color="white"
|
||||
padding
|
||||
ref="mysteps"
|
||||
height="400px"
|
||||
class="bg-primary text-white shadow-1 rounded-borders"
|
||||
>
|
||||
<q-carousel-slide name="first" :img-src="tools.getimgbysize('../../statics/images/', 'background.jpg')">
|
||||
<div class="landing__header">
|
||||
<div class="row text-center">
|
||||
<logo></logo>
|
||||
</div>
|
||||
<template v-slot:control>
|
||||
<q-carousel-control
|
||||
position="top-left"
|
||||
class="q-gutter-xs"
|
||||
style="opacity: 0.6;">
|
||||
<q-btn
|
||||
push round color="white" text-color="black" icon="arrow_left"
|
||||
@click="$refs.mysteps.previous()"></q-btn>
|
||||
</q-carousel-control>
|
||||
<q-carousel-control
|
||||
position="top-right"
|
||||
class="q-gutter-xs"
|
||||
style="opacity: 0.6;">
|
||||
<q-btn
|
||||
push round color="white" text-color="black" icon="arrow_right"
|
||||
@click="$refs.mysteps.next()"></q-btn>
|
||||
</q-carousel-control>
|
||||
</template>
|
||||
<q-carousel-slide v-for="(rec, index) in arrsteps" :key="index" :name="index"
|
||||
class="column no-wrap flex-center">
|
||||
<div class="row no-wrap items-center justify-around q-gutter-lg">
|
||||
<q-icon :name="rec.myicon" size="56px"></q-icon>
|
||||
<q-icon v-if="rec.myicon2" :name="rec.myicon2" size="56px"></q-icon>
|
||||
<q-icon v-if="rec.myicon3" :name="rec.myicon3" size="56px"></q-icon>
|
||||
<q-img v-if="rec.myimg" :src="rec.myimg"
|
||||
style="height: 56px; width: 56px;"></q-img>
|
||||
</div>
|
||||
<div class="landing__hero-content row justify-center q-gutter-xs clgutter">
|
||||
<div class="flex justify-end">
|
||||
<div class="q-gutter-xs testo-banda clgutter">
|
||||
<div class="text-h3 shadow-max">{{getappname}}</div>
|
||||
<div class="text-subtitle1 shadow text-italic q-pl-sm">
|
||||
{{$t('msg.sottoTitoloApp')}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="landing__arrow absolute-bottom text-center">
|
||||
<i aria-hidden="true" class="q-icon text-h2 text-white material-icons">expand_more</i>
|
||||
</div>
|
||||
</q-carousel-slide>
|
||||
<q-carousel-slide name="second" :img-src="tools.getimgbysize('../../statics/images/', 'whoiam.jpg')">
|
||||
<div class="landing__header">
|
||||
<div class="row text-center">
|
||||
<logo></logo>
|
||||
</div>
|
||||
</div>
|
||||
<div class="landing__hero-content row justify-center q-gutter-xs clgutter">
|
||||
<div class="flex justify-end">
|
||||
<div class="q-gutter-xs testo-banda clgutter">
|
||||
<div class="text-h3 shadow-max">{{getappname}}</div>
|
||||
<div class="text-subtitle1 shadow text-italic q-pl-sm">
|
||||
{{$t('msg.sottoTitoloApp')}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="landing__arrow absolute-bottom text-center">
|
||||
<i aria-hidden="true" class="q-icon text-h2 text-white material-icons">expand_more</i>
|
||||
</div>
|
||||
</q-carousel-slide>
|
||||
<q-carousel-slide name="third" :img-src="tools.getimgbysize('../../statics/images/', 'background3.jpg')">
|
||||
<div class="landing__header">
|
||||
<div class="row text-center">
|
||||
<logo></logo>
|
||||
</div>
|
||||
</div>
|
||||
<div class="landing__hero-content row justify-center q-gutter-xs clgutter">
|
||||
<div class="flex justify-end">
|
||||
<div class="q-gutter-xs testo-banda clgutter">
|
||||
<div class="text-h3 shadow-max">{{getappname}}</div>
|
||||
<div class="text-subtitle1 shadow text-italic q-pl-sm">
|
||||
{{$t('msg.sottoTitoloApp')}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="landing__arrow absolute-bottom text-center">
|
||||
<i aria-hidden="true" class="q-icon text-h2 text-white material-icons">expand_more</i>
|
||||
<div class="q-mt-md text-center step-text" v-html="gettitle_advise(rec)">
|
||||
</div>
|
||||
</q-carousel-slide>
|
||||
</q-carousel>
|
||||
<div class="row justify-center">
|
||||
<q-btn-toggle
|
||||
glossy
|
||||
v-model="mysteps"
|
||||
:options="arrsteps"
|
||||
></q-btn-toggle>
|
||||
</div>
|
||||
</div>
|
||||
</CTitleBanner>
|
||||
|
||||
<section class="q-pa-sm bg-primary landing__swirl-bg text-center">
|
||||
<div class="landing__features row justify-center column" style="max-width: 800px;">
|
||||
<q-carousel
|
||||
animated
|
||||
swipeable
|
||||
navigation
|
||||
infinite
|
||||
transition-next="slide-left"
|
||||
transition-prev="slide-right"
|
||||
v-model="slide_video"
|
||||
ref="slide_video"
|
||||
:height="heightgallvideo"
|
||||
width="100%"
|
||||
>
|
||||
<template v-slot:control>
|
||||
<q-carousel-control
|
||||
position="top-left"
|
||||
class="q-gutter-xs"
|
||||
style="opacity: 0.6;">
|
||||
<q-btn
|
||||
push round color="white" text-color="black" icon="keyboard_arrow_left"
|
||||
@click="$refs.slide_video.previous()"></q-btn>
|
||||
</q-carousel-control>
|
||||
<q-carousel-control
|
||||
position="top-right"
|
||||
class="q-gutter-xs"
|
||||
style="opacity: 0.6;">
|
||||
<q-btn
|
||||
push round color="white" text-color="black" icon="keyboard_arrow_right"
|
||||
@click="$refs.slide_video.next()"></q-btn>
|
||||
</q-carousel-control>
|
||||
</template>
|
||||
|
||||
<q-carousel-slide v-if="getvideonum_mp4 > 0" v-for="index in getvideonum_mp4"
|
||||
:name="`mp4_`+index"
|
||||
:key="index">
|
||||
|
||||
<div v-if="tools.getvideourl(index, false)"
|
||||
class="row justify-evenly items-center q-gutter-sm ">
|
||||
<div class="text-center">
|
||||
<div class="subtitle_small text-blue"
|
||||
v-html="tools.getvideotitle(index, false)"></div>
|
||||
|
||||
<div class="">
|
||||
<q-media-player
|
||||
type="video"
|
||||
:sources="arrvideo_mp4[index]"
|
||||
:poster="tools.getvideoposter(index)"
|
||||
>
|
||||
</q-media-player>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</q-carousel-slide>
|
||||
|
||||
<q-carousel-slide v-if="getvideonum_youtube > 0" v-for="index in getvideonum_youtube"
|
||||
:name="`yt_`+index"
|
||||
:key="index">
|
||||
<div v-if="tools.getvideourl(index, true)"
|
||||
class="row justify-evenly items-center q-gutter-sm ">
|
||||
|
||||
<div class="text-center">
|
||||
<div class="subtitle_small text-blue"
|
||||
v-html="tools.getvideotitle(index, true)"></div>
|
||||
<div class="">
|
||||
<iframe
|
||||
:width="tools.getwidthscale(mythis, getValDb('YT_W', false), 800)"
|
||||
:height="tools.getheightbywidth(mythis, getValDb('YT_W', false), getValDb('YT_H', false), 800)"
|
||||
:src="arrvideo_yt[index]"
|
||||
frameborder="0"
|
||||
allowfullscreen
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</q-carousel-slide>
|
||||
|
||||
|
||||
</q-carousel>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="padding_testo bg-white text-grey-10 text-center" v-scroll-reveal.reset>
|
||||
<div class="landing__features row items-start q-col-gutter-xs intro">
|
||||
<div class="intro__associazione">
|
||||
<!--<img src="../../statics/images/scuolaopbenessere/16427623_404497389905092_1266178961781563443_n.jpg">-->
|
||||
<div class="col-12 text-center"><h4 class="subtitle"></h4>
|
||||
<p class="text-intro" v-html="$t('pages.content.home')">
|
||||
</p>
|
||||
|
||||
<CTitleBanner class="q-pa-xs" :title="$t('text.what')" bgcolor="bg-secondary" clcolor="text-white"
|
||||
mystyle=" " canopen="true">
|
||||
<div class="q-mx-md cltexth4">
|
||||
1) Voglia di giocare, e desiderio di Donare 33 € per aiutare un'altra persona a realizzare i
|
||||
propri
|
||||
sogni.<br><br>
|
||||
2) L'impegno di seguire delle indicazioni nei tempi stabiliti all' interno di una chat, dove
|
||||
ogni
|
||||
passaggio è spiegato e guidato.<br><br>
|
||||
3) Parlare e condividere ai tuoi amici un messaggio dove spieghi questo sistema,
|
||||
impegnandoti così a
|
||||
trovare
|
||||
2 persone interessate ad entrare.
|
||||
</div>
|
||||
|
||||
</CTitleBanner>
|
||||
|
||||
<CTitleBanner cl ass="q-pa-xs" :title="$t('text.advise')" bgcolor="bg-primary" clcolor="text-white"
|
||||
mystyle=" " myclass="myshad" canopen="true">
|
||||
<div v-if="toolsext.isLang('it')">
|
||||
<q-list dense bordered padding class="rounded-borders">
|
||||
<div v-for="(rec, index) in advise" :key="index">
|
||||
<q-item :class="rec.color">
|
||||
<q-item-section avatar>
|
||||
<q-icon :name="geticonlist(rec)" :color="rec.iconcolor" inverted></q-icon>
|
||||
</q-item-section>
|
||||
|
||||
<q-item-section>
|
||||
<span v-html="gettitle_advise(rec)" :style="`color: `+rec.textcolor"></span>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-separator spaced/>
|
||||
</div>
|
||||
</div>
|
||||
</q-list>
|
||||
</div>
|
||||
</CTitleBanner>
|
||||
|
||||
</section>
|
||||
|
||||
<!--
|
||||
<section class="padding bg-primary landing__swirl-bg" v-scroll-reveal.reset>
|
||||
<div class="landing__features row justify-between items-start q-col-gutter-xs">
|
||||
<div class="col-12 col-sm-5">
|
||||
<div class="feature-item"><i aria-hidden="true"
|
||||
class="q-icon fas fa-users"> </i><h4>
|
||||
{{$t('')}}</h4>
|
||||
<p class="feat-descr" v-html="$t('homepage.freesocial.descr')"></p></div>
|
||||
</div>
|
||||
<div class="col-12 col-sm-5">
|
||||
<div class="feature-item"><i aria-hidden="true"
|
||||
class="q-icon fas fa-user-clock"> </i><h4>
|
||||
{{$t('')}}</h4>
|
||||
<p class="feat-descr" v-html="$t('homepage.freetalent.descr')"></p></div>
|
||||
</div>
|
||||
<div class="col-12 col-sm-5">
|
||||
<div class="feature-item"><i aria-hidden="true"
|
||||
class="q-icon fas fa-apple-alt"> </i><h4>
|
||||
{{$t('')}}</h4>
|
||||
<p class="feat-descr" v-html="$t('homepage.freegas.descr')"></p></div>
|
||||
</div>
|
||||
<div class="col-12 col-sm-5">
|
||||
<div class="feature-item"><i aria-hidden="true"
|
||||
class="q-icon fas fa-home"> </i><h4>
|
||||
{{$t('')}}</h4>
|
||||
<p class="feat-descr" v-html="$t('homepage.freeliving.descr')"></p></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
-->
|
||||
<Footer></Footer>
|
||||
</div>
|
||||
</q-page>
|
||||
|
||||
<div v-if="!tools.isMobile()" style="margin: 60px 60px;"></div>
|
||||
|
||||
</div>-->
|
||||
|
||||
|
||||
</div>
|
||||
</CMyPage>
|
||||
</q-page>
|
||||
</template>
|
||||
|
||||
<script lang="ts" src="./home.ts">
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import './home.scss';
|
||||
@import './home.scss';
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user