Mr Swift
102 lines
2.4 KiB
Vue
102 lines
2.4 KiB
Vue
<template>
|
|
<div class="bg-img-in">
|
|
<user-dashboard-container page-class="complaint" :panel-title="brand?.title" class="panelx">
|
|
|
|
<div class="row">
|
|
<div class="col-lg-4 col-sm-12 p-3" style="display: flex; justify-content: center;">
|
|
<img :src="'/uploads/images/brands/' + brand?.logo" width="250">
|
|
</div>
|
|
<div class="col-lg-8 col-sm-12 p-3" style="display: flex; justify-content: center;">
|
|
<p>{{ brand?.description }}</p>
|
|
</div>
|
|
|
|
<div class="col-lg-12 col-sm-12 p-3 resp-ali" >
|
|
<CButton size="sm" color="success" :href="brand.link" class="mr-auto" style="font-size: small;"
|
|
>مشاهده محصولات و توضیحات بیشتر ...</CButton>
|
|
</div>
|
|
|
|
</div>
|
|
</user-dashboard-container>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'PublicBrands',
|
|
|
|
data() {
|
|
return {
|
|
|
|
brand:{
|
|
title:'',
|
|
logo:'',
|
|
description:''
|
|
}
|
|
|
|
}
|
|
},
|
|
|
|
mounted() {
|
|
this.$axios.get('/api/public/brand/'+this.$route.params.item).then((res)=>{
|
|
this.brand = res.data
|
|
console.log(res)
|
|
})
|
|
},
|
|
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.err{
|
|
box-shadow: 0 0 5px rgba(255, 0, 0, 0.3);
|
|
-webkit-box-shadow: 0 0 5px rgba(255, 0, 0, 0.3);
|
|
-moz-box-shadow: 0 0 5px rgba(255, 0, 0, 0.3);
|
|
border: 2px solid rgba(255, 0, 0, 0.2);
|
|
border-radius: 8px;
|
|
}
|
|
.bg-img-in {
|
|
background: url(@/static/assets/img/home/bg4.jpg);
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
border-top: groove;
|
|
max-height: calc(100vh + 100px);
|
|
}
|
|
.panelx {
|
|
margin-top: 25%;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
width: 80% !important;
|
|
|
|
}
|
|
.btn-success{
|
|
border-color: #1063a7;
|
|
background-color: #065495;
|
|
color: aliceblue;
|
|
}
|
|
.el-switch__label--right {
|
|
margin-right: 10px !important;
|
|
}
|
|
|
|
.el-switch__label--left {
|
|
margin-left: 10px !important;
|
|
}
|
|
</style>
|
|
<style>
|
|
.resp-ali{
|
|
display: flex; justify-content: left;
|
|
}
|
|
@media(max-width: 977px){
|
|
.resp-ali{
|
|
display: flex; justify-content: center;
|
|
}
|
|
}
|
|
.panel-title p{
|
|
color: rgb(148, 148, 148) !important;
|
|
text-shadow: 0.5px 0.5px 1px #dadada;
|
|
padding-right: 2px;
|
|
|
|
}
|
|
.panel{
|
|
min-height: max-content !important;
|
|
border-radius : 8px !important;
|
|
}
|
|
</style> |