front-end almost done | started back-end

This commit is contained in:
Amir Mohamadi
2020-11-23 19:39:26 +03:30
parent 95149f0e72
commit 80a7abafb7
191 changed files with 60163 additions and 950 deletions
+146 -1
View File
@@ -1,3 +1,148 @@
<template>
<div class="page projects--page"></div>
<div class="page projects--page">
<Hero :title="staticData.hero"/>
<section class="s1">
<div class="container">
<div class="panel">
<h2 class="title">{{staticData.t1}}</h2>
<p>{{staticData.t2}}</p>
<p>{{staticData.t3}}</p>
<div class="projects">
<div class="project">
<div id="project1">
<div class="imgBox">
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
</div>
<div class="imgBox">
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
</div>
<div class="imgBox">
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
</div>
<div class="imgBox">
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
</div>
<div class="imgBox">
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
</div>
</div>
<div class="caption">
<h4>پروژه ی فلان جا</h4>
<p>1399/07/04</p>
</div>
</div>
<div class="project">
<div id="project2">
<div class="imgBox">
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
</div>
<div class="imgBox">
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
</div>
<div class="imgBox">
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
</div>
<div class="imgBox">
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
</div>
<div class="imgBox">
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
</div>
</div>
<div class="caption">
<h4>پروژه ی فلان جا</h4>
<p>1399/07/04</p>
</div>
</div>
<div class="project">
<div id="project3">
<div class="imgBox">
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
</div>
<div class="imgBox">
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
</div>
<div class="imgBox">
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
</div>
<div class="imgBox">
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
</div>
<div class="imgBox">
<img class="bg" src="~/assets/img/products/product-01.jpg" alt="">
<img class="img" src="~/assets/img/products/product-01.jpg" alt="">
</div>
</div>
<div class="caption">
<h4>پروژه ی فلان جا</h4>
<p>1399/07/04</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="s2">
<div class="container">
<div class="row">
<div class="col-12">
<h2 class="title">{{staticData.t4}}</h2>
<nuxt-link :to="{name: 'lang-contact',params:{lang: $route.params.lang}}" class="btn btn-reverse-fill">{{staticData.t5}}</nuxt-link>
</div>
</div>
</div>
</section>
</div>
</template>
<script>
if (process.client) require('slick-carousel')
export default {
computed: {
staticData() {
return this.$store.state.staticData.projects[this.$route.params.lang]
}
},
mounted() {
$('#project1').slick({
slidesToShow: 1,
centerMode: true,
centerPadding: '150px',
infinite: true,
arrows: true
})
$('#project2').slick({
slidesToShow: 1,
centerMode: true,
centerPadding: '150px',
infinite: true,
arrows: true
})
$('#project3').slick({
slidesToShow: 1,
centerMode: true,
centerPadding: '150px',
infinite: true,
arrows: true
})
}
}
</script>