- fixed strange things...

src/components/CImgTitle/CImgTitle.scss

@@ -0,0 +1,114 @@
+
+.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: 2500px) {
+  .myclimg {
+    height: 550px !important;
+  }
+}
+
+@media (max-width: 1600px) {
+  .myclimg {
+    height: 550px !important;
+  }
+}
+
+@media (max-width: 1000px) {
+  .myclimg {
+    height: 450px !important;
+  }
+}
+
+@media (max-width: 800px) {
+  .myclimg {
+    height: 400px !important;
+  }
+}
+
+
+@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: 3.5rem;
+  padding: 10px;
+  text-shadow: .2rem .2rem .2rem #3d3d3d;
+}
+
+@media (max-width: 400px) {
+  .title{
+    padding: 5px;
+    font-size: 3rem;
+  }
+}
+
+.mylegendinside{
+  font-size: 1rem;
+  margin-bottom: 50px;
+  opacity: .8;
+
+  @media (max-width: 400px) {
+    margin-bottom: -10px;
+  }
+}
+
+.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) {
+  }
+}

src/components/CImgTitle/CImgTitle.ts

@@ -0,0 +1,44 @@
+import Vue from 'vue'
+import { Component, Prop } from 'vue-property-decorator'
+import { GlobalStore, UserStore } from '@store'
+
+import VueScrollReveal from 'vue-scroll-reveal'
+import { tools } from '@src/store/Modules/tools'
+import { toolsext } from '@src/store/Modules/toolsext'
+import { Screen } from 'quasar'
+
+// 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({
+  name: 'CImgTitle'
+})
+export default class CImgTitle extends Vue {
+  @Prop({ required: false, default: '' }) public src: string
+  @Prop({ required: false, default: '' }) public title: string
+  @Prop({ required: false, default: 0 }) public myheight: number
+  @Prop({ required: false, default: 0 }) public myheightmobile: number
+  @Prop({ required: false, default: '' }) public legendinside: string
+  @Prop({ required: false, default: '' }) public legend: string
+
+  get tools() {
+    return tools
+  }
+
+  get getsrc() {
+    // return this.src
+    const filefull = tools.getimgFullpathbysize(this.src)
+
+    return tools.getimgbysize(filefull.path, filefull.file)
+  }
+}

src/components/CImgTitle/CImgTitle.vue

@@ -0,0 +1,15 @@
+<template>
+    <div>
+        <q-parallax :src="getsrc" :height="tools.myheight_imgtitle(myheight, myheightmobile)">
+            <h2 class="text-white center_to_image title">{{title}}</h2>
+            <div v-if="legendinside" class="mylegendinside absolute-bottom custom-caption center_to_image" v-html="legendinside"></div>
+        </q-parallax>
+        <div v-if="legend" class="mylegend" v-html="legend"></div>
+    </div>
+</template>
+
+<script lang="ts" src="./CImgTitle.ts">
+</script>
+<style lang="scss" scoped>
+    @import './CImgTitle.scss';
+</style>

src/components/CImgTitle/index.ts

@@ -0,0 +1 @@
+export {default as CImgTitle} from './CImgTitle.vue'

src/components/CPreloadImages/CPreloadImages.scss

@@ -0,0 +1,66 @@
+$heightBtn: 100%;
+$grayshadow: #555;
+
+.text-subtitle-carica {
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.75rem;
+  letter-spacing: .00937em;
+  text-shadow: .1rem .1rem .1rem $grayshadow;
+}
+
+.text-subtitle-certificato {
+  font-size: 0.75rem;
+  line-height: 1rem;
+}
+
+@media (max-width: 718px) {
+  // PER VERSIONE MOBILE
+  .text-subtitle-carica {
+    font-size: 1rem;
+  }
+}
+
+.op {
+  text-align: center !important;
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.75rem;
+  letter-spacing: .00937em;
+  text-shadow: .1rem .1rem .1rem $grayshadow;
+
+  &__cell {
+    font-size: 1rem;
+    color: red;
+  }
+
+  &__email {
+    font-size: 1rem;
+    color: #3b5998;
+  }
+
+  &__email a {
+    text-decoration: none;
+  }
+
+  &__facebook a {
+    font-size: 1rem;
+    text-decoration: none;
+  }
+
+  &__storia {
+    margin-top: 1rem;
+    margin-bottom: 1rem;
+    text-align: justify;
+  }
+}
+
+.myimg {
+  border-radius: 300px !important;
+}
+
+.q-img {
+  &__image {
+    border-radius: 300px !important;
+  }
+}

src/components/CPreloadImages/CPreloadImages.ts

@@ -0,0 +1,29 @@
+import Vue from 'vue'
+import { Component, Prop, Watch } from 'vue-property-decorator'
+
+import { tools } from '../../store/Modules/tools'
+import { toolsext } from '@src/store/Modules/toolsext'
+import { IPreloadImages } from '../../model'
+
+@Component({
+  name: 'CPreloadImages'
+})
+
+export default class CPreloadImages extends Vue {
+  @Prop({ required: true }) public arrimg: IPreloadImages[]
+
+  get tools() {
+    return tools
+  }
+
+  public getimg(recimg: IPreloadImages) {
+    if (recimg.mobile) {
+      const filefull = tools.getimgFullpathbysize(recimg.imgname)
+
+      return tools.getimgbysize(filefull.path, filefull.file)
+    } else {
+      return recimg.imgname
+    }
+  }
+
+}

src/components/CPreloadImages/CPreloadImages.vue

@@ -0,0 +1,14 @@
+<template>
+    <div id="preloader">
+        <div v-for="(image, index) in arrimg">
+            <img :src="getimg(image)" width="1" height="1"/>
+        </div>
+    </div>
+</template>
+
+<script lang="ts" src="./CPreloadImages.ts">
+</script>
+
+<style lang="scss" scoped>
+    @import './CPreloadImages.scss';
+</style>

src/components/CPreloadImages/index.ts

@@ -0,0 +1 @@
+export {default as CPreloadImages} from './CPreloadImages.vue'