cnm/src/root/home/home.vue

<template>
    <q-page class="text-white">
        <div class="landing">
            <section>
                <div class="landing__hero">
                    <q-carousel
                            animated
                            :autoplay="animare"
                            swipeable
                            infinite
                            navigation
                            transition-next="slide-left"
                            transition-prev="slide-right"
                            v-model="slide"
                            height="100%"
                            width="100%"
                    >
                        <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>
                            </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>
                        </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>
                        </div>
                    </div>
                </div>

            </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>
</template>

<script lang="ts" src="./home.ts">
</script>

<style lang="scss" scoped>
    @import './home.scss';
</style>