Compare commits
No commits in common. "f493178e3cc4fd73e754768e0071fc1a0b365f53" and "3402653f197ee37b7db4ed8d70f778b3a41f5f5c" have entirely different histories.
f493178e3c
...
3402653f19
@ -8,9 +8,6 @@
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400&family=Righteous&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
||||
<title>Tayrona Foods</title>
|
||||
</head>
|
||||
|
||||
|
||||
59
src/App.vue
59
src/App.vue
@ -1,77 +1,30 @@
|
||||
<script>
|
||||
<script setup>
|
||||
import Footer from './components/Footer.vue';
|
||||
import Menu from './components/Menu.vue';
|
||||
|
||||
const pagesWithCarousel = [
|
||||
'home', 'social', 'about', 'products'
|
||||
];
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
stickyClass: ''
|
||||
}
|
||||
},
|
||||
components: { Footer, Menu },
|
||||
created() {
|
||||
window.addEventListener('scroll', this.handleScroll);
|
||||
},
|
||||
destroyed() {
|
||||
window.removeEventListener('scroll', this.handleScroll);
|
||||
},
|
||||
beforeRouteEnter() {
|
||||
this.stickyClass = '';
|
||||
},
|
||||
methods: {
|
||||
handleScroll() {
|
||||
console.log('this.$route.name :>> ', this.$route.name);
|
||||
if (!pagesWithCarousel.includes(this.$route.name)) {
|
||||
this.stickyClass = 'has-sticky has-sticky-1'
|
||||
return;
|
||||
}
|
||||
|
||||
if (window.scrollY > 0 && window.scrollY <= 574) {
|
||||
this.stickyClass = 'has-sticky has-sticky-0';
|
||||
} else if(window.scrollY > 574) {
|
||||
this.stickyClass = 'has-sticky has-sticky-1';
|
||||
} else {
|
||||
this.stickyClass = '';
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="main-container" :class="stickyClass">
|
||||
<Menu />
|
||||
<div class="content-wrapper">
|
||||
<div class="main-container">
|
||||
<RouterView />
|
||||
</div>
|
||||
<Footer></Footer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.content-wrapper {
|
||||
padding-top: 130px;
|
||||
background-color: #000;
|
||||
}
|
||||
.content {
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
padding: 0 72px 72px;
|
||||
|
||||
h2 {
|
||||
font-size: 36px;
|
||||
font-size: 52px;
|
||||
font-weight: 500;
|
||||
line-height: 50px;
|
||||
line-height: 70px;
|
||||
text-align: center;
|
||||
padding: 52px 0;
|
||||
padding: 72px 0;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 24px;
|
||||
font-size: 32px;
|
||||
font-weight: 500;
|
||||
line-height: 70px;
|
||||
text-align: center;
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 255 KiB |
BIN
src/assets/images/bg_1.png
Normal file
BIN
src/assets/images/bg_1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 243 KiB After Width: | Height: | Size: 918 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 860 KiB After Width: | Height: | Size: 887 KiB |
BIN
src/assets/images/grains.png
Normal file
BIN
src/assets/images/grains.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 754 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 182 KiB |
BIN
src/assets/images/kid-coffee.png
Normal file
BIN
src/assets/images/kid-coffee.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 705 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 162 KiB |
BIN
src/assets/images/kids.png
Normal file
BIN
src/assets/images/kids.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 233 KiB |
BIN
src/assets/images/mountains.png
Normal file
BIN
src/assets/images/mountains.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 123 KiB |
BIN
src/assets/images/products.png
Normal file
BIN
src/assets/images/products.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 530 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 810 KiB |
BIN
src/assets/images/proysoc.01.png
Normal file
BIN
src/assets/images/proysoc.01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.1 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 39 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 54 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 36 KiB |
@ -1,40 +0,0 @@
|
||||
<template>
|
||||
<section class="big-carousel">
|
||||
<Carousel :autoplay="5000" class="big-carousel" :wrapAround="true" >
|
||||
<Slide v-for="(slide, index) in images" :key="index">
|
||||
<img :src="$helper.getImage(slide)" alt="" />
|
||||
</Slide>
|
||||
</Carousel>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import 'vue3-carousel/dist/carousel.css'
|
||||
import { Carousel, Slide, Pagination, Navigation } from 'vue3-carousel'
|
||||
export default {
|
||||
props: {
|
||||
images: Array,
|
||||
},
|
||||
components: {
|
||||
Carousel,
|
||||
Slide,
|
||||
Pagination,
|
||||
Navigation,
|
||||
},
|
||||
mounted() {
|
||||
console.log(this.images);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.big-carousel {
|
||||
margin-top:0;
|
||||
padding: 0;
|
||||
|
||||
|
||||
.carousel__slide {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -2,68 +2,64 @@
|
||||
import LocaleSelector from './LocaleSelector.vue';
|
||||
|
||||
export default {
|
||||
components: { LocaleSelector },
|
||||
props: {
|
||||
type: String,
|
||||
title: String,
|
||||
},
|
||||
components: { LocaleSelector }
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<section class="menu">
|
||||
<section class="menu" :class="type">
|
||||
<div class="overlay">
|
||||
<nav>
|
||||
<img class="logo" src="@images/tayrona-foods-yellow.png" />
|
||||
<img class="logo" src="@images/logo-kreis_34.png" />
|
||||
<div class="links">
|
||||
<router-link class="link" to="/">{{ $t('menu.home')}}</router-link>
|
||||
<router-link class="link" to="/about">{{ $t('menu.about') }}</router-link>
|
||||
<router-link class="link" to="/products">{{ $t('menu.products') }}</router-link>
|
||||
<!-- <router-link class="link" to="/store">{{ $t('Tienda') }}</router-link> -->
|
||||
<a href="https://tayronafoods.myshopify.com" target="_blank" class="link">{{ $t('Tienda') }}</a>
|
||||
<router-link class="link" to="/shopping">{{ $t('menu.shopping') }}</router-link>
|
||||
<router-link class="link" to="/social">{{ $t('menu.social') }}</router-link>
|
||||
<router-link class="link" to="/contact">{{ $t('menu.contact') }}</router-link>
|
||||
<!-- <router-link class="link" to="/social">{{ $t('menu.social') }}</router-link>
|
||||
<router-link class="link" to="/contact">{{ $t('menu.contact') }}</router-link> -->
|
||||
<LocaleSelector class="link"></LocaleSelector>
|
||||
</div>
|
||||
</nav>
|
||||
<h1 class="title" v-if="title">{{ title }}</h1>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.menu {
|
||||
background-color: transparent;
|
||||
height: 130px;
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: 1000;
|
||||
height: 574px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
|
||||
.overlay {
|
||||
width: 100%;
|
||||
|
||||
|
||||
.nav-wrapper {
|
||||
position: relative;
|
||||
width: 1366px;
|
||||
height: 100%;
|
||||
// background: #000;
|
||||
background: linear-gradient(89.82deg, rgba(30, 30, 30, 0.72) -6.88%, rgba(0, 0, 0, 0.18) 87.45%);
|
||||
}
|
||||
|
||||
.title {
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
font-size: 65px;
|
||||
line-height: 70px;
|
||||
text-align: right;
|
||||
padding: 88px 93px 0;
|
||||
}
|
||||
nav {
|
||||
margin: 0 auto;
|
||||
padding: 16px 50px;
|
||||
padding: 24px 93px 0;
|
||||
display: grid;
|
||||
grid-template-columns: auto auto;
|
||||
background: transparent;
|
||||
width: 1366px;
|
||||
height: 100%;
|
||||
transition: background-color .3s ease-in-out;
|
||||
|
||||
.has-sticky-0 & {
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.has-sticky-1 & {
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
.logo {
|
||||
height: 100px;
|
||||
width: 100px;;
|
||||
height: 90px;
|
||||
width: 90px;;
|
||||
}
|
||||
|
||||
.links {
|
||||
@ -90,6 +86,28 @@ export default {
|
||||
}
|
||||
}
|
||||
|
||||
&.home {
|
||||
background-image: url('@images/mountains.png');
|
||||
}
|
||||
|
||||
&.about {
|
||||
background-image: url('@images/coffee1.jpg');
|
||||
}
|
||||
|
||||
&.products {
|
||||
background-image: url('@images/products.png');
|
||||
}
|
||||
|
||||
&.social {
|
||||
background-image: url('@images/proysoc.01.png');
|
||||
}
|
||||
|
||||
&.contact {
|
||||
background-color: #000;
|
||||
height: 180px;
|
||||
.overlay {
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<div class="product-box">
|
||||
<div class="header">
|
||||
<div class="kind-image">
|
||||
<img :src="$helper.getImage(product.kind.image)" />
|
||||
<div>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<h2>{{ $t(product.name) }}</h2>
|
||||
@ -10,30 +10,28 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="product-box-image">
|
||||
<img :src="$helper.getImage(product.images[0])" alt="" />
|
||||
<img :src="$helper.getImage(product.image)" alt="">
|
||||
</div>
|
||||
<div class="footer">
|
||||
<product-table :product="product"></product-table>
|
||||
<!-- <h2>{{ $t(product.footer) }}</h2>
|
||||
<h3>{{ $t(product.footer) }}</h3> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ProductTable from "./ProductTable.vue";
|
||||
export default {
|
||||
props: {
|
||||
product: Object,
|
||||
},
|
||||
components: {
|
||||
ProductTable,
|
||||
},
|
||||
};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.product-box {
|
||||
width: 360px;
|
||||
height: 480px;
|
||||
background: #DAD7DA;
|
||||
border-radius: 12px;
|
||||
background-position: top left;
|
||||
box-sizing: border-box;
|
||||
@ -41,10 +39,6 @@ export default {
|
||||
padding: 0 px 0;
|
||||
|
||||
.header {
|
||||
background-color: #1f1f1f;
|
||||
border-top-left-radius: 12px;
|
||||
border-top-right-radius: 12px;
|
||||
color: #c1c1a1;
|
||||
padding: 12px 16px;
|
||||
align-items: center;
|
||||
align-self: stretch;
|
||||
@ -52,13 +46,6 @@ export default {
|
||||
display: grid;
|
||||
grid-template-columns: 40px auto;
|
||||
|
||||
.kind-image {
|
||||
align-self: start;
|
||||
img {
|
||||
width: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
padding: 0px;
|
||||
font-weight: 500;
|
||||
@ -71,17 +58,16 @@ export default {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
text-align: left;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
&-image {
|
||||
width: 360px;
|
||||
height: 285px;
|
||||
width: fixed;
|
||||
height: fixed;
|
||||
}
|
||||
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<Carousel class="carousel" :items-to-show="3" :wrap-around="false">
|
||||
<Slide v-for="product in products" :key="product.name">
|
||||
<Slide v-for="product in products" :key="product.kind">
|
||||
<div class="carousel-item">
|
||||
<ProductBox :product="product"></ProductBox>
|
||||
</div>
|
||||
@ -8,6 +8,7 @@
|
||||
|
||||
<template #addons>
|
||||
<Navigation />
|
||||
<Pagination />
|
||||
</template>
|
||||
</Carousel>
|
||||
</template>
|
||||
|
||||
@ -12,6 +12,9 @@ export default {
|
||||
toggle() {
|
||||
this.flipped = !this.flipped;
|
||||
},
|
||||
translate(val) {
|
||||
console.log('Vue.$t :>> ', Vue.$t);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -20,9 +23,9 @@ export default {
|
||||
<div class="flip-card" :class="{flipped}" @click="toggle">
|
||||
<div v-if="product" class="flip-card-inner" :class="(product && product.kind) || 'no-product'">
|
||||
<div class="flip-card-front">
|
||||
<img class="logo" :src="$helper.getImage(product.kind.getImageimage)" />
|
||||
<img class="logo" :src="$helper.getImage(product.image)" />
|
||||
<div>
|
||||
<h3 class="title">{{ $t(product.kind.localized)}}</h3>
|
||||
<h3 class="title">{{ $t(product.kind_localized)}}</h3>
|
||||
<h3 class="slogan">{{ $t(product.slogan) }}</h3>
|
||||
</div>
|
||||
<div class="description">{{ $t(product.description) }}</div>
|
||||
@ -36,8 +39,8 @@ export default {
|
||||
</div>
|
||||
<div class="info-data">
|
||||
<div class="info-data-left">
|
||||
<img class="logo" :src="$helper.getImage(product.kind.image)" />
|
||||
<p class="kind">{{ $t(product.kind.localized) }}</p>
|
||||
<img class="logo" :src="$helper.getImage(product.image)" />
|
||||
<p class="kind">{{ $t(product.kind_localized) }}</p>
|
||||
<p class="slogan">{{ $t(product.slogan) }}</p>
|
||||
</div>
|
||||
<div class="info-data-right">
|
||||
|
||||
@ -1,256 +0,0 @@
|
||||
<template>
|
||||
<div class="info" :class="product.kind.name">
|
||||
<div class="info-data">
|
||||
<div class="info-data-left" >
|
||||
<img class="logo" :src="$helper.getImage(product.kind.image)" />
|
||||
<p class="kind">{{ $t(product.kind.localized) }}</p>
|
||||
<p class="slogan">{{ $t(product.slogan) }}</p>
|
||||
</div>
|
||||
<div class="info-data-right">
|
||||
<div class="info-data-row">
|
||||
<div class="info-data-box land">
|
||||
<div class="info-data-box-label">{{ $t("labels.country") }}</div>
|
||||
<div class="info-data-box-value">
|
||||
{{ $t(product.country) }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-data-box height">
|
||||
<div class="info-data-box-label">{{ $t("labels.height") }}</div>
|
||||
<div class="info-data-box-value">
|
||||
<div class="text-overflow">
|
||||
{{ $t(product.height) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-data-row">
|
||||
<div class="info-data-box revision">
|
||||
<div class="info-data-box-label">{{ $t("labels.revision") }}</div>
|
||||
<div class="info-data-box-value">
|
||||
<div class="text-overflow">
|
||||
{{ $t(product.revision) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-data-box harvest">
|
||||
<div class="info-data-box-label">{{ $t("labels.harvest") }}</div>
|
||||
<div class="info-data-box-value">
|
||||
<div class="text-overflow">
|
||||
{{ $t(product.harvest) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-data-box profile">
|
||||
<div class="info-data-box-label">{{ $t("labels.profile") }}</div>
|
||||
<div class="info-data-box-value">
|
||||
<div class="text-overflow">
|
||||
{{ $t(product.profile) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-data-row">
|
||||
<div class="info-data-box taste">
|
||||
<div class="info-data-box-label">{{ $t("labels.taste") }}</div>
|
||||
<div class="info-data-box-value">
|
||||
<div class="text-overflow">
|
||||
{{ $t(product.taste) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info-data-box mouthfeel">
|
||||
<div class="info-data-box-label">{{ $t("labels.texture") }}</div>
|
||||
<div class="info-data-box-value">
|
||||
<div class="text-overflow">
|
||||
{{ $t(product.texture) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
product: Object
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.info {
|
||||
font-size: 12px;
|
||||
border-bottom-left-radius: 15px;
|
||||
border-bottom-right-radius: 15px;
|
||||
.logo {
|
||||
width: 50px
|
||||
}
|
||||
&.earth {
|
||||
background-color: #A6AF94;
|
||||
}
|
||||
&.water {
|
||||
background-color: #889CA7;
|
||||
}
|
||||
&.air {
|
||||
background-color: #F4EEB0;
|
||||
}
|
||||
&.fire {
|
||||
background-color: #D58C83;
|
||||
}
|
||||
&.no-product {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
|
||||
&-data {
|
||||
display: grid;
|
||||
grid-template-columns: 20% 80%;
|
||||
border-style: solid;
|
||||
border-width: 2px;
|
||||
border-bottom-left-radius: 15px;
|
||||
border-bottom-right-radius: 15px;
|
||||
|
||||
&-left {
|
||||
padding-top: 16px;
|
||||
border-bottom-left-radius: 15px;
|
||||
}
|
||||
|
||||
&-right {
|
||||
border-bottom-right-radius: 15px;
|
||||
display: grid;
|
||||
grid-template-rows: repeat(3, 1fr);
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
|
||||
.earth & {
|
||||
background-color: #babfa9;
|
||||
}
|
||||
.water & {
|
||||
background-color: #92a7b1;
|
||||
}
|
||||
.air & {
|
||||
background-color: #f4f4cc;
|
||||
}
|
||||
.fire & {
|
||||
background-color: #d59c95;
|
||||
}
|
||||
}
|
||||
|
||||
&-row {
|
||||
border-top-style: solid;
|
||||
border-top-width: 2px;
|
||||
border-bottom-style: solid;
|
||||
border-bottom-width: 2px;
|
||||
display: inline-flex;
|
||||
// flex-wrap: nowrap;
|
||||
// justify-content: space-around;
|
||||
min-width: 100%;
|
||||
height: 100%;
|
||||
|
||||
&:first-child {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.earth & {
|
||||
border-color: #a6af94;
|
||||
}
|
||||
|
||||
.water & {
|
||||
border-color: #889ca7;
|
||||
}
|
||||
.air & {
|
||||
border-color: #f4eeb0;
|
||||
}
|
||||
.fire & {
|
||||
border-color: #d58c83;
|
||||
}
|
||||
}
|
||||
|
||||
&-box {
|
||||
padding: 4px 0 0 8px;
|
||||
border-right-style: solid;
|
||||
border-right-width: 3px;
|
||||
min-width: 100px;
|
||||
flex-basis: 0px;
|
||||
flex-grow: 1;
|
||||
|
||||
.text-overflow {
|
||||
// width: 98%;
|
||||
// text-overflow: ellipsis;
|
||||
// overflow: hidden;
|
||||
// white-space: nowrap;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.earth & {
|
||||
border-color: #a6af94;
|
||||
}
|
||||
|
||||
.water & {
|
||||
border-color: #889ca7;
|
||||
}
|
||||
.air & {
|
||||
border-color: #f4eeb0;
|
||||
}
|
||||
.fire & {
|
||||
border-color: #d58c83;
|
||||
}
|
||||
|
||||
&-label {
|
||||
font-family: "Righteous", cursive;
|
||||
text-transform: uppercase;
|
||||
font-size: 9px;
|
||||
}
|
||||
&-value {
|
||||
font-family: "Cormorant Garamond", serif;
|
||||
line-height: 12px;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
&.kind {
|
||||
font-family: "Righteous", cursive;
|
||||
text-align: center;
|
||||
line-height: 20px;
|
||||
margin-left: 4px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1.3px;
|
||||
font-size: 10px;
|
||||
}
|
||||
&.slogan {
|
||||
font-family: "Cormorant Garamond", serif;
|
||||
text-align: center;
|
||||
line-height: 12px;
|
||||
margin-left: 4px;
|
||||
font-size: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.earth & {
|
||||
border-color: #babfa9;
|
||||
}
|
||||
.water & {
|
||||
border-color: #92a7b1;
|
||||
}
|
||||
.air & {
|
||||
border-color: #f4f4cc;
|
||||
}
|
||||
.fire & {
|
||||
border-color: #d59c95;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
82
src/data.js
82
src/data.js
@ -1,31 +1,11 @@
|
||||
export const kinds = {
|
||||
earth: {
|
||||
name: 'earth',
|
||||
localized: 'common.earth',
|
||||
image: 'logo_tierra.svg'
|
||||
},
|
||||
water: {
|
||||
name: 'water',
|
||||
localized: 'common.water',
|
||||
image: 'logo_agua.svg'
|
||||
},
|
||||
air: {
|
||||
name: 'air',
|
||||
localized: 'common.air',
|
||||
image: 'logo_aire2.svg'
|
||||
},
|
||||
fire: {
|
||||
name: 'fire',
|
||||
localized: 'common.fire',
|
||||
image: 'logo_fuego.svg'
|
||||
},
|
||||
};
|
||||
|
||||
export const products = [
|
||||
{
|
||||
kind: kinds.earth,
|
||||
kind: 'earth',
|
||||
kind_localized: 'common.earth',
|
||||
name: 'products.brasil_de_andrade.name',
|
||||
images: ['product-brasil-single11.png', 'product-brasil-double1.png',],
|
||||
image: 'logo_tierra.svg',
|
||||
image_product_single: 'product-brasil-single11.png',
|
||||
image_product_double: 'product-brasil-double1.png',
|
||||
slogan: 'products.brasil_de_andrade.slogan',
|
||||
description: 'products.brasil_de_andrade.description',
|
||||
farm: 'products.brasil_de_andrade.farm',
|
||||
@ -39,9 +19,12 @@ export const products = [
|
||||
texture: 'products.brasil_de_andrade.texture'
|
||||
},
|
||||
{
|
||||
kind: kinds.water,
|
||||
kind: 'water',
|
||||
kind_localized: 'common.water',
|
||||
name: 'products.colombia_el_paseito.name',
|
||||
images: ['product-colombia-single11.png', 'product-colombia-double1.png',],
|
||||
image: 'logo_agua.svg',
|
||||
image_product_single: 'product-colombia-single11.png',
|
||||
image_product_double: 'product-colombia-double1.png',
|
||||
slogan: 'products.colombia_el_paseito.slogan',
|
||||
description: 'products.colombia_el_paseito.description',
|
||||
farm: 'products.colombia_el_paseito.farm',
|
||||
@ -55,9 +38,12 @@ export const products = [
|
||||
texture: 'products.colombia_el_paseito.texture'
|
||||
},
|
||||
{
|
||||
kind: kinds.air,
|
||||
kind: 'air',
|
||||
kind_localized: 'common.air',
|
||||
name: 'products.peru_grad_1.name',
|
||||
images: ['product-peru-single11.png', 'product-peru-double1.png',],
|
||||
image: 'logo_aire2.svg',
|
||||
image_product_single: 'product-peru-single11.png',
|
||||
image_product_double: 'product-peru-double1.png',
|
||||
slogan: 'products.peru_grad_1.slogan',
|
||||
description: 'products.peru_grad_1.description',
|
||||
farm: 'products.peru_grad_1.farm',
|
||||
@ -71,9 +57,12 @@ export const products = [
|
||||
texture: 'products.peru_grad_1.texture'
|
||||
},
|
||||
{
|
||||
kind: kinds.fire,
|
||||
kind: 'fire',
|
||||
kind_localized: 'common.fire',
|
||||
name: 'products.uganda_gnoma.name',
|
||||
images: ['product-uganda-single11.png', 'product-uganda-double1.png',],
|
||||
image: 'logo_fuego.svg',
|
||||
image_product_single: 'product-uganda-single11.png',
|
||||
image_product_double: 'product-uganda-double1.png',
|
||||
slogan: 'products.uganda_gnoma.slogan',
|
||||
description: 'products.uganda_gnoma.description',
|
||||
farm: 'products.uganda_gnoma.farm',
|
||||
@ -87,34 +76,3 @@ export const products = [
|
||||
texture: 'products.uganda_gnoma.texture',
|
||||
},
|
||||
];
|
||||
|
||||
export const slides = {
|
||||
home: [
|
||||
'mountains.jpg',
|
||||
'coffee1.jpg',
|
||||
'products.jpg',
|
||||
'proysoc.01.jpg',
|
||||
'kids.jpg',
|
||||
],
|
||||
about: [
|
||||
'coffee1.jpg',
|
||||
'mountains.jpg',
|
||||
'products.jpg',
|
||||
'proysoc.01.jpg',
|
||||
'kids.jpg',
|
||||
],
|
||||
social: [
|
||||
'proysoc.01.jpg',
|
||||
'kids.jpg',
|
||||
'mountains.jpg',
|
||||
'coffee1.jpg',
|
||||
'products.jpg',
|
||||
],
|
||||
products: [
|
||||
'products.jpg',
|
||||
'coffee1.jpg',
|
||||
'mountains.jpg',
|
||||
'proysoc.01.jpg',
|
||||
'kids.jpg',
|
||||
],
|
||||
};
|
||||
@ -10,7 +10,6 @@ export default {
|
||||
home: 'Home',
|
||||
about: 'Über uns',
|
||||
products: 'Produkt',
|
||||
shopping: 'Shopping',
|
||||
social: 'Soziales Projekt',
|
||||
contact: 'Kontakt'
|
||||
},
|
||||
@ -62,7 +61,7 @@ export default {
|
||||
title2:'Unsere Partner'
|
||||
},
|
||||
products_page: {
|
||||
title: 'Disfruta del sabor auténtico de un café recién tostado',
|
||||
title: 'Origen',
|
||||
subtitle1: 'Die Indianer haben seit jeher eine enge Beziehung zu ihrer na-türlichen Umgebung. Im Einklang mit den vier Elementen - Feuer,Wasser, Luft und Erde - gestalten sie ihr Leben. Dies beschreibt wunderbar unsere Kaffeereihe.',
|
||||
|
||||
},
|
||||
@ -76,32 +75,32 @@ export default {
|
||||
strain: '100% Arábica',
|
||||
country: 'Brasil/ Cerrado, Carmo do paranaiba',
|
||||
height: '1.100 m',
|
||||
revision: 'sonnengetrocknet',
|
||||
harvest: 'handgepflückt',
|
||||
revision: 'Secado al sol',
|
||||
harvest: 'Seleccionado cuidadósamente',
|
||||
profile: '1/4',
|
||||
taste: 'Schokolade,leichte Fruchtsäure.',
|
||||
texture: 'mild würzig'
|
||||
taste: 'Chocolate, ligero ácido de frutas.',
|
||||
texture: 'Ligeramente picante'
|
||||
},
|
||||
colombia_el_paseito: {
|
||||
title:'Water',
|
||||
slogan: 'Born to feel',
|
||||
title:'Agua',
|
||||
slogan: 'Nacido para sentir',
|
||||
description: `El agua, juega un papel decisivo en la preparación del café.
|
||||
Por lo tanto, solo utilizamos agua de primera clase que se adapta perfectamente a los requisitos individuales de cada café.
|
||||
La cantidad y calidad correcta del agua despliega los aromas y sabores en cada taza.`,
|
||||
name: 'Colombia El Pastelito',
|
||||
farm: 'La Mejorana',
|
||||
strain: '100% Arábica',
|
||||
country: 'Kolumbien /Quimbaya, Quindío',
|
||||
country: 'Colombia /Quimbaya, Quindío',
|
||||
height: '1.470 m',
|
||||
revision: 'Sonnengetrocknet',
|
||||
harvest: 'handgepflückt',
|
||||
revision: 'Secado al sol',
|
||||
harvest: 'Seleccionado cuidadósamente',
|
||||
profile: '3/4',
|
||||
taste: 'leichte Karamellnote.',
|
||||
texture: 'voll'
|
||||
taste: 'Leche acaramelada.',
|
||||
texture: 'Lleno'
|
||||
},
|
||||
peru_grad_1: {
|
||||
title:'Air',
|
||||
slogan: 'Born to inspire',
|
||||
title:'Aire',
|
||||
slogan: 'Nacido para inspirar',
|
||||
description: `El aire, es otra parte esencial de nuestra pasión por el café, damos gran importancia a los granos de café recién tostados que conservan su aroma y sabor inconfundibles.
|
||||
Es por eso que tostamos en pequeños lotes para asegurarnos de que cada taza que disfrutes esté llena de frescura y aroma.`,
|
||||
name: 'Perú Grad 1',
|
||||
@ -109,15 +108,15 @@ export default {
|
||||
strain: '100% Arábica',
|
||||
country: 'Perú / Puno, Sandia',
|
||||
height: '1.800 m',
|
||||
revision: 'Sonnengetrocknet',
|
||||
harvest: 'handgepflückt',
|
||||
revision: 'Secado al sol',
|
||||
harvest: 'Seleccionado cuidadósamente',
|
||||
profile: '3/4',
|
||||
taste: 'blumig-fruchtig,Schokolade',
|
||||
texture: 'würzig'
|
||||
taste: '-',
|
||||
texture: '-'
|
||||
},
|
||||
uganda_gnoma: {
|
||||
title:'Fire',
|
||||
slogan: 'Born to succeed',
|
||||
title:'Fuego',
|
||||
slogan: 'Nacido para triunfar',
|
||||
description: `El fuego, la pasión que resuena en cada paso de nuestro trabajo.
|
||||
Desde la selección de variedades de café verde hasta el cuidadoso tostado y la preparación amorosa, estamos allí con alma y corazón para ofrecerte una experiencia de café extraordinaria.`,
|
||||
name: 'Uganda Ngoma',
|
||||
@ -125,21 +124,21 @@ export default {
|
||||
strain: '100% Robusta',
|
||||
country: 'Uganda / Wakiso District',
|
||||
height: '1.250 m',
|
||||
revision: 'Sonnengetrocknet',
|
||||
harvest: 'handgepflückt',
|
||||
revision: 'Secado al sol',
|
||||
harvest: 'Seleccionado cuidadósamente',
|
||||
profile: '4/4',
|
||||
taste: 'Zartbitterschokolade',
|
||||
texture: 'sanft'
|
||||
taste: '-.',
|
||||
texture: '-'
|
||||
},
|
||||
},
|
||||
labels: {
|
||||
country: 'Land / Region',
|
||||
height: 'Anbauhöhe',
|
||||
revision: 'Verarbeitung',
|
||||
harvest: 'Ernte',
|
||||
profile: 'Profil',
|
||||
taste: 'Geschmack',
|
||||
texture: 'Mundgefühl'
|
||||
country: 'País / Región',
|
||||
height: 'Altura',
|
||||
revision: 'Revisión',
|
||||
harvest: 'Cosecha',
|
||||
profile: 'Perfil',
|
||||
taste: 'Gusto',
|
||||
texture: 'Textura'
|
||||
},
|
||||
|
||||
social: {
|
||||
@ -150,13 +149,13 @@ export default {
|
||||
paragraph4:'Sumérgete en el mundo de Tayrona Foods, donde el café no solo es una pasión, sino también una fuente de cambio y apoyo para quienes más lo necesitan.'
|
||||
},
|
||||
common: {
|
||||
earth: 'Eart',
|
||||
water: 'Water',
|
||||
air: 'Air',
|
||||
fire: 'Fire',
|
||||
earth: 'Tierra',
|
||||
water: 'Agua',
|
||||
air: 'Aire',
|
||||
fire: 'Fuego',
|
||||
company_name: 'Tayrona Foods',
|
||||
rol_managing_partner: 'Managing Partner',
|
||||
download: 'Download'
|
||||
download: 'Descargar'
|
||||
},
|
||||
|
||||
contact:{
|
||||
|
||||
@ -10,7 +10,6 @@ export default {
|
||||
home: 'Home',
|
||||
about: 'About',
|
||||
products: 'Products',
|
||||
shopping: 'Shopping',
|
||||
social: 'Social',
|
||||
contact: 'Contact'
|
||||
},
|
||||
@ -63,9 +62,8 @@ export default {
|
||||
title2:'Partners Certifications'
|
||||
},
|
||||
products_page: {
|
||||
title: 'Disfruta del sabor auténtico de un café recién tostado',
|
||||
title: 'Origin',
|
||||
subtitle1: 'Indigenous cultures have always had a close relationship with their natural environment, finding harmony with the four elements: fire, water, air, and earth, the meaning of their lives, and it is this close relationship that beautifully describes our series of coffees.',
|
||||
download: 'Download here our portfolio',
|
||||
|
||||
},
|
||||
products: {
|
||||
@ -164,9 +162,9 @@ export default {
|
||||
title: 'Contact',
|
||||
paragraph1:'If you are interested or have any questions, please contact us!',
|
||||
paragraph2: 'Email',
|
||||
paragraph3: 'info{\'@\'}tayronafoods.com',
|
||||
paragraph4: 'alejandro{\'@\'}tayronafoods.com',
|
||||
paragraph5: 'jose{\'@\'}tayronafoods.com',
|
||||
paragraph3: 'info@tayronafoods.com',
|
||||
paragraph4: 'alejandro@tayronafoods.com',
|
||||
paragraph5: 'jose@tayronafoods.com',
|
||||
paragraph6: 'Phones',
|
||||
paragraph7: '+49(0)176 321 368 59',
|
||||
paragraph8: '+49(0)152 549 389 62',
|
||||
|
||||
@ -62,9 +62,9 @@ export default {
|
||||
title2:'Nuestros Aliados'
|
||||
},
|
||||
products_page: {
|
||||
title: 'Disfruta del sabor auténtico de un café recién tostado',
|
||||
title: 'Origen',
|
||||
subtitle1: 'Las culturas indígenas siempre han tenido una estrecha relación con su entorno natural, encontrando en la armonía con los cuatro elementos: fuego, agua, aire y tierra, el sentido de sus vidas, y es esta misma relación la que describe maravillosamente nuestra serie de cafés.',
|
||||
download: 'Descarga aquí nuestro portafolio',
|
||||
|
||||
},
|
||||
products: {
|
||||
brasil_de_andrade: {
|
||||
@ -163,9 +163,9 @@ export default {
|
||||
title: 'Contacto',
|
||||
paragraph1: 'Si está interesado o tiene alguna pregunta, ¡contáctenos!',
|
||||
paragraph2: 'Correo Electrónico',
|
||||
paragraph3: 'info{\'@\'}tayronafoods.com',
|
||||
paragraph4: 'alejandro{\'@\'}tayronafoods.com',
|
||||
paragraph5: 'jose{\'@\'}tayronafoods.com',
|
||||
paragraph3: 'info@tayronafoods.com',
|
||||
paragraph4: 'alejandro@tayronafoods.com',
|
||||
paragraph5: 'jose@tayronafoods.com',
|
||||
paragraph6: 'Teléfonos',
|
||||
paragraph7: '+49(0)176 321 368 59',
|
||||
paragraph8: '+49(0)152 549 389 62',
|
||||
|
||||
@ -8,7 +8,6 @@ import ContactView from '../views/contact/Contact.vue';
|
||||
import ImpressumView from '../views/impressum/Impressum.vue';
|
||||
import DataProtectionView from '../views/dataprotection/DataProtection.vue';
|
||||
import AgbView from '../views/agb/Agb.vue';
|
||||
import StoreView from '../views/store/StoreView.vue';
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHashHistory(),
|
||||
@ -53,11 +52,6 @@ const router = createRouter({
|
||||
name: 'agb',
|
||||
component: AgbView,
|
||||
},
|
||||
{
|
||||
path: '/store',
|
||||
name: 'store',
|
||||
component: StoreView,
|
||||
},
|
||||
]
|
||||
});
|
||||
|
||||
|
||||
@ -1,12 +1,10 @@
|
||||
<script setup>
|
||||
import BigCarousel from '../../components/BigCarousel.vue';
|
||||
import MenuVue from "../../components/Menu.vue";
|
||||
import Employee from "../../components/Employee.vue";
|
||||
|
||||
import { slides } from '../../data';
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<big-carousel :images="slides.about"></big-carousel>
|
||||
<MenuVue type="about" :title="$t('about.title')"></MenuVue>
|
||||
<section class="about-section content">
|
||||
<h2>{{ $t('about.subtitle1') }}</h2>
|
||||
<p>{{ $t('about.paragraph1') }}</p>
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
<template>
|
||||
<MenuVue type="contact" />
|
||||
<div class="contact-section">
|
||||
<div class="left">
|
||||
<h1>Allgemeine Geschäftsbedingungen (AGB)</h1>
|
||||
@ -56,8 +57,10 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MenuVue from "../../components/Menu.vue";
|
||||
|
||||
export default {
|
||||
components: { MenuVue },
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
<template>
|
||||
|
||||
<MenuVue type="contact" />
|
||||
<div class="contact-section">
|
||||
<div class="left">
|
||||
<h1>{{ $t('contact.title') }}</h1>
|
||||
@ -19,7 +20,10 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MenuVue from '../../components/Menu.vue';
|
||||
|
||||
export default {
|
||||
components: { MenuVue }
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@ -1,16 +1,15 @@
|
||||
<script>
|
||||
import BigCarousel from '../../components/BigCarousel.vue';
|
||||
import Certifications from "../../components/Certifications.vue";
|
||||
import CoffeeFarmer from "../../components/CoffeeFarmer.vue";
|
||||
import Different from "../../components/Different.vue";
|
||||
import Menu from "../../components/Menu.vue";
|
||||
import ProductCarousel from "../../components/ProductCarousel.vue";
|
||||
import { products, slides } from "../../data.js";
|
||||
|
||||
import Certifications from '../../components/Certifications.vue';
|
||||
import CoffeeFarmer from '../../components/CoffeeFarmer.vue';
|
||||
import Different from '../../components/Different.vue';
|
||||
import Menu from '../../components/Menu.vue';
|
||||
import ProductCarousel from '../../components/ProductCarousel.vue';
|
||||
import { products } from '../../data.js';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
slides: slides.home,
|
||||
products,
|
||||
};
|
||||
},
|
||||
@ -20,23 +19,29 @@ export default {
|
||||
ProductCarousel,
|
||||
CoffeeFarmer,
|
||||
Certifications,
|
||||
Different,
|
||||
BigCarousel,
|
||||
Different
|
||||
},
|
||||
};
|
||||
computed: {
|
||||
productsCarousel() {
|
||||
return this.products.map(p => ({
|
||||
image: p.image_product_single,
|
||||
name: p.name,
|
||||
farm: p.farm,
|
||||
strain: p.strain,
|
||||
}));
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<big-carousel :images="slides"></big-carousel>
|
||||
<Menu type="home" />
|
||||
<section class="home-section content">
|
||||
<h2>{{ $t("origins.header") }}</h2>
|
||||
<ProductCarousel :products="products" />
|
||||
<h2>{{ $t('origins.header') }}</h2>
|
||||
<ProductCarousel :products="productsCarousel" />
|
||||
<Different />
|
||||
<CoffeeFarmer class="mt-5" />
|
||||
<Certifications />
|
||||
</section>
|
||||
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
@ -1,5 +1,6 @@
|
||||
<template>
|
||||
|
||||
<MenuVue type="contact" />
|
||||
<div class="contact-section">
|
||||
<div class="left">
|
||||
<h1>Impressum</h1>
|
||||
@ -18,7 +19,10 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MenuVue from '../../components/Menu.vue';
|
||||
|
||||
export default {
|
||||
components: { MenuVue }
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@ -1,22 +1,31 @@
|
||||
<script>
|
||||
import MenuVue from "../../components/Menu.vue";
|
||||
import 'vue3-carousel/dist/carousel.css'
|
||||
import ProductFlipCard from "../../components/ProductFlipCard.vue";
|
||||
import Certifications from "../../components/Certifications.vue";
|
||||
import ProductCarouselVue from "../../components/ProductCarousel.vue";
|
||||
import BigCarousel from '../../components/BigCarousel.vue';
|
||||
import { products, slides } from '../../data.js';
|
||||
import { products } from '../../data.js';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
products,
|
||||
slides: slides.products
|
||||
};
|
||||
},
|
||||
components: {
|
||||
MenuVue,
|
||||
ProductFlipCard,
|
||||
Certifications,
|
||||
ProductCarouselVue,
|
||||
BigCarousel
|
||||
ProductCarouselVue
|
||||
},
|
||||
computed: {
|
||||
productsCarousel() {
|
||||
return this.products.map(p => ({
|
||||
image: p.image_product_double,
|
||||
name: p.name,
|
||||
farm: p.farm,
|
||||
strain: p.strain,
|
||||
}));
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
download() {
|
||||
@ -28,15 +37,18 @@
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<big-carousel :images="slides"></big-carousel>
|
||||
<MenuVue type="products"></MenuVue>
|
||||
<section class="product-section content">
|
||||
<h2>{{ $t('products_page.title') }}</h2>
|
||||
<p hidden>{{ $t('products_page.subtitle1') }}</p>
|
||||
<p hidden class="centered"><img src="@images/v-elemento.png" /></p>
|
||||
<ProductCarouselVue :products="products" />
|
||||
<p>{{ $t('products_page.subtitle1') }}</p>
|
||||
<p class="centered"><img src="@images/v-elemento.png" /></p>
|
||||
<div class="cards">
|
||||
<ProductFlipCard class="card" v-for="(product, index) in products" :key="index" :product="product"></ProductFlipCard>
|
||||
</div>
|
||||
<ProductCarouselVue :products="productsCarousel" />
|
||||
<Certifications />
|
||||
|
||||
<h6 class="text-centered">{{ $t('products_page.download')}}</h6>
|
||||
<h6 class="text-centered">Descarga aquí nuestro porfolio</h6>
|
||||
<div class="buttons text-centered">
|
||||
<button class="mt-5" @click.prevent.stop="download">{{ $t('common.download') }}</button>
|
||||
</div>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<big-carousel :images="slides.social"></big-carousel>
|
||||
<MenuVue type="social" />
|
||||
<section class="social-section content">
|
||||
<h2>{{ $t('social.title') }}</h2>
|
||||
<p>{{ $t('social.paragraph1') }}</p>
|
||||
@ -11,20 +11,23 @@
|
||||
<p>{{ $t('social.paragraph4') }}</p>
|
||||
</div>
|
||||
<div class="right">
|
||||
<img src="@images/kid-coffee.jpg">
|
||||
<img src="@images/kid-coffee.png">
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import BigCarousel from '../../components/BigCarousel.vue';
|
||||
import { slides } from '../../data';
|
||||
<script>
|
||||
import MenuVue from '../../components/Menu.vue';
|
||||
|
||||
export default {
|
||||
components: { MenuVue }
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.social-bottom {
|
||||
padding: 40px 98px;
|
||||
background-image: url('@images/bg_1.jpg');
|
||||
background-image: url('@images/bg_1.png');
|
||||
background-position: top left;
|
||||
background-size: contain;
|
||||
height: 600px;
|
||||
|
||||
@ -1,16 +0,0 @@
|
||||
<template>
|
||||
<MenuVue type="contact" />
|
||||
<div><iframe src="http://tayronafoods.myshopify.com"></iframe></div>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MenuVue from '../../components/Menu.vue';
|
||||
export default {
|
||||
components: { MenuVue }
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user