pull/1/head
Alireza Hassani 4 years ago
parent 87af0e86b4
commit eefc30314f

@ -44,9 +44,11 @@
} }
.name-block .text .Fa { .name-block .text .Fa {
font-size: 20px; font-size: 20px;
line-height: 22px;
} }
.name-block .text .En { .name-block .text .En {
font-size: 12px; font-size: 12px;
line-height: 18px;
letter-spacing: 5px; letter-spacing: 5px;
text-transform: uppercase; text-transform: uppercase;
margin-right: -5px; margin-right: -5px;

@ -4,8 +4,8 @@
<div class="number-original En Bold" > {{ Intl.NumberFormat().format(original_price) }} </div> <div class="number-original En Bold" > {{ Intl.NumberFormat().format(original_price) }} </div>
<div class="percent En Bold"> 12 <v-icon color="white"> WMi-percentage</v-icon> </div> <div class="percent En Bold"> 12 <v-icon color="white"> WMi-percentage</v-icon> </div>
</div> </div>
<div v-if="price != 0" class="number En Bold"> {{ Intl.NumberFormat().format(price) }} </div> <div v-if="(price != 0 || !zeroLabel)" class="number En Bold"> {{ Intl.NumberFormat().format(price) }} </div>
<div v-else class="number Fa Bold"> رایگان </div> <div v-else class="number Fa Bold"> {{ zeroLabel }} </div>
<div class="label Fa" v-html="label"></div> <div class="label Fa" v-html="label"></div>
</div> </div>
</template> </template>
@ -17,6 +17,7 @@
original_price: String, original_price: String,
price: { default: 1000 }, price: { default: 1000 },
label: { default: 'تومان' }, label: { default: 'تومان' },
zeroLabel: String,
}, },
}; };
</script> </script>

@ -11,7 +11,7 @@
<script> <script>
export default { export default {
name: "wm-section-title", name: "section-title",
props: { props: {
titleFa: { default: "عنوان بخش" }, titleFa: { default: "عنوان بخش" },
titleEn: { default: "Part Title" }, titleEn: { default: "Part Title" },
@ -87,6 +87,9 @@ export default {
.section-title.sm .Title .En { .section-title.sm .Title .En {
font-size: 10px; font-size: 10px;
} }
.section-title.sm .v-icon {
font-size: 40px;
}
</style> </style>

@ -1,5 +1,5 @@
<template> <template>
<router-link :to="{ name: URL }" :class="`back-button fade-in fast theme-${theme} `" style="animation-delay: 0.1s;"> <router-link :to="{ name: URL }" :class="`back-button fade-in fast ${theme} `" style="animation-delay: 0.1s;">
<div class="tile" :style="'background-image: linear-gradient(to right, #'+gradientBegin+' , #'+gradientEnd+'); '"> <div class="tile" :style="'background-image: linear-gradient(to right, #'+gradientBegin+' , #'+gradientEnd+'); '">
<v-icon> WMi-right-open</v-icon> <v-icon> WMi-right-open</v-icon>
</div> </div>
@ -50,6 +50,18 @@ export default {
.back-button.theme-dark .tile .v-icon { .back-button.theme-dark .tile .v-icon {
color: #fff; color: #fff;
} }
.back-button.theme-dark .tile .v-icon {
color: #fff;
}
@import "resources/js/Global/scss/_vars.scss";
@each $color,
$value in $colors {
.back-button.theme-#{$color} .tile .v-icon {
color: $value;
}
}
</style> </style>

@ -1,14 +1,14 @@
<template> <template>
<div :class="`we-icon-tile ${TileClass} theme-${theme}`"> <div :class="`we-icon-tile ${TileClass} theme-${theme}`">
<div class="static-content WM-Block WM-Align-C Relative" <div class="static-content WM-Block WM-Align-C Relative"
:style="'background-image: linear-gradient('+GradientDirection+', #'+GradientBegin+' , #'+GradientEnd+'); height: '+TileHeight+'px;'"> :style="'background-image: linear-gradient('+GradientDirection+', #'+GradientBegin+' , #'+GradientEnd+'); height: '+height+'px;'">
<div class="Content"> <div class="Content">
<v-icon>WMi-{{ icon }}</v-icon>
<div class="info"> <div class="info">
<div class="Fa"> {{ TitleFa }} </div> <div class="Fa"> {{ TitleFa }} </div>
<div class="En"> {{ TitleEn }} </div> <div class="En"> {{ TitleEn }} </div>
<div class="desc Fa Thin" v-if="Desc != ''" v-html="Desc"></div> <div class="desc Fa Thin" v-if="Desc != ''" v-html="Desc"></div>
</div> </div>
<v-icon>WMi-{{ icon }}</v-icon>
</div> </div>
</div> </div>
<div v-if="Quantity != ''" class="quantity" > <div v-if="Quantity != ''" class="quantity" >
@ -24,7 +24,7 @@ export default {
props: { props: {
// Tile:TileData, // Tile:TileData,
TileClass: { default: "lg6 xs12" }, TileClass: { default: "lg6 xs12" },
TileHeight: { default: "180px" }, height: { default: "180px" },
theme: { default: "black" }, theme: { default: "black" },
// -------------------------------------------- // --------------------------------------------
@ -78,6 +78,10 @@ export default {
border: 1px solid #6d6d6d; border: 1px solid #6d6d6d;
border-radius: 5px; border-radius: 5px;
} }
.we-icon-tile .static-content {
transition: 0.5s;
direction: rtl;
}
.we-icon-tile:hover .static-content { .we-icon-tile:hover .static-content {
-webkit-filter: grayscale(100%); -webkit-filter: grayscale(100%);
} }
@ -123,6 +127,7 @@ export default {
font-size:14px; font-size:14px;
letter-spacing:15px; letter-spacing:15px;
text-transform:uppercase; text-transform:uppercase;
opacity: 0.7;
} }
.we-icon-tile .info .desc { .we-icon-tile .info .desc {
display: block; display: block;
@ -141,12 +146,11 @@ export default {
.quantity { .quantity {
display: block; display: block;
position: absolute; position: absolute;
font-size: 100px; font-size: 80px;
line-height: 90px; line-height: 70px;
left:15px; left:25px;
bottom:calc(50% - 55px); bottom:calc(50% - 47px);
text-align: center; text-align: center;
} }
.quantity .label { .quantity .label {
display: block; display: block;
@ -190,4 +194,31 @@ export default {
} }
.we-icon-tile.sm .info .En {
font-size: 12px;
letter-spacing: 10px;
margin-right: -10px;
margin-top: -5px;
}
.we-icon-tile.sm .info .Fa {
font-size: 22px;
}
/*---------------------------------------------------------------*/
/* Qunatity :: End*/
/*---------------------------------------------------------------*/
@import "resources/js/Global/scss/_vars.scss";
@each $color,
$value in $colors {
.we-icon-tile.theme-#{$color} .v-icon {
color: $value;
}
.we-icon-tile.theme-#{$color} .info {
color: $value;
}
}
</style> </style>

@ -590,7 +590,9 @@ $value in $colors {
} }
/*---------------------------------------------------------------*/
/* End & Full Row :: Begin
/*---------------------------------------------------------------*/
.end-row { .end-row {
margin-left: -18px; margin-left: -18px;
margin-right: -18px; margin-right: -18px;
@ -630,3 +632,20 @@ $value in $colors {
border-right: 2px solid $value; border-right: 2px solid $value;
} }
} }
/*---------------------------------------------------------------*/
/* we form size :: Begin
/*---------------------------------------------------------------*/
.row.we-form-size {
margin: 0px;
}
.row.we-form-size .col {
padding: 0px 6px 0px 10px;
}
.row.we-form-size.md .col {
padding: 5px 6px 5px 10px;
}
.v-btn--fab.v-size--x-small .v-icon, .v-btn--icon.v-size--x-small .v-icon {
font-size: 16px;
}

@ -9,14 +9,14 @@
:style="`animation-delay: ${key * 0.1}s;`" :style="`animation-delay: ${key * 0.1}s;`"
> >
<wm-tile <icon-tile
:TileClass="module.title_class +' Shadowed'" :TileClass="module.title_class +' Shadowed'"
:TitleEn="$_name(`${module.slug}.tile.name_en`) != '' ? $_name(`${module.slug}.tile.name_en`) : module.title_en" :TitleEn="$_name(`${module.slug}.tile.name_en`) != '' ? $_name(`${module.slug}.tile.name_en`) : module.title_en"
:TitleFa="$_name(`${module.slug}.tile.name`) != '' ? $_name(`${module.slug}.tile.name`) : module.title_fa" :TitleFa="$_name(`${module.slug}.tile.name`) != '' ? $_name(`${module.slug}.tile.name`) : module.title_fa"
:GradientBegin="module.gradient_begin" :GradientBegin="module.gradient_begin"
:GradientEnd="module.gradient_end" :GradientEnd="module.gradient_end"
:ImageURL="module.img_url" :icon="module.img_url"
:ImageHeight="module.img_height" :height="module.img_height"
/> />
</a> </a>
</v-layout> </v-layout>
@ -32,15 +32,17 @@
<script> <script>
import Tile from "@Global/components/Tiles/Tile"; import Tile from "@Global/components/Tiles/Tile";
import IconTile from '@Global/components/Tiles/Icon-Tile';
import { mapGetters, mapActions } from "vuex"; import { mapGetters, mapActions } from "vuex";
import routes from '@Global/utils/common/routes'; import routes from '@Global/utils/common/routes';
export default { export default {
data: () => ({ data: () => ({
hostname : window.location.hostname, hostname : window.location.hostname,
originHostName : routes.originHostName() originHostName : routes.originHostName()
}), }),
components: { components: {
"wm-tile": Tile, IconTile
}, },
computed: { computed: {
...mapGetters("rolePermission", ["getModules"]), ...mapGetters("rolePermission", ["getModules"]),

Loading…
Cancel
Save