+
WMi-{{icon}}
-
{{label}}
{{value}}
+
@@ -20,7 +23,7 @@ export default {
/*---------------------------------------------------------------*/
/* Qunatity :: Begin*/
/*---------------------------------------------------------------*/
- .we-quantity {
+ .we-icon {
transition: 0.2s;
border: 1px solid transparent;
border-radius: 5px;
@@ -31,43 +34,40 @@ export default {
text-align: center;
}
- .we-quantity .number {
+ .we-icon .number {
font-size: 60px;
line-height: 45px;
}
- .we-quantity .icon .v-icon {
+ .we-icon .icon .v-icon {
font-size: 40px;
margin-left: -5px;
line-height: 45px;
}
- .we-quantity .label {
+ .we-icon .label {
font-size: 14px;
- opacity: 0.7;
text-align: right;
line-height: 16px;
margin-right: 3px;
}
- .we-quantity.sm .number {
+ .we-icon.sm .number {
font-size: 50px;
line-height: 40px;
}
- .we-quantity.sm .label {
+ .we-icon.sm .label {
font-size: 12px;
- opacity: 0.7;
text-align: right;
line-height: 14px;
margin-right: 3px;
}
- .we-quantity.xl .number {
- font-size: 70px;
- line-height: 60px;
+ .we-icon.xl .v-icon {
+ font-size: 60px;
+ line-height: 50px;
}
- .we-quantity.xl .label {
+ .we-icon.xl .label {
font-size: 15px;
- opacity: 0.7;
text-align: right;
line-height: 18px;
margin-right: 3px;
@@ -75,7 +75,7 @@ export default {
}
- .we-quantity.variation {
+ .we-icon.variation {
padding: 5px 10px;
background-color: #eeeeee;
border-radius: 3px;
@@ -86,4 +86,15 @@ export default {
/*---------------------------------------------------------------*/
/* Qunatity :: End*/
/*---------------------------------------------------------------*/
+
+ @import "resources/js/Global/scss/_vars.scss";
+ @each $color,
+ $value in $colors {
+ .we-icon.theme-#{$color} .v-icon {
+ color: $value;
+ }
+ .we-icon.theme-#{$color} .value {
+ color: $value;
+ }
+ }
diff --git a/resources/js/Global/components/Blocks/Name.vue b/resources/js/Global/components/Blocks/Name.vue
index 5ab62af..4ee7fa9 100644
--- a/resources/js/Global/components/Blocks/Name.vue
+++ b/resources/js/Global/components/Blocks/Name.vue
@@ -35,13 +35,15 @@
text-align: right;
}
.name-block .text .Fa {
- font-size: 22px;
+ font-size: 20px;
}
.name-block .text .En {
font-size: 12px;
letter-spacing: 5px;
text-transform: uppercase;
margin-right: -5px;
+ margin-top: -2px;
+ color: #b1b1b1;
}
.name-block .text .date {
font-size: 12px;
@@ -65,6 +67,25 @@
margin-right: -3px;
}
+ /*----------------------------------------------------*/
+ /* Size MD */
+ /*----------------------------------------------------*/
+ .name-block.xl {
+ text-align:right;
+ padding: 0px 2px;
+ }
+ .name-block.xl .Fa {
+ font-size: 28px;
+ }
+ .name-block.xl .En {
+ font-size: 16px;
+ letter-spacing: 5px;
+ text-transform: uppercase;
+ color: #9a9a9a;
+ margin-right: -3px;
+ }
+
+
/*----------------------------------------------------*/
/* number-absolute */
/*----------------------------------------------------*/
@@ -77,6 +98,10 @@
line-height: 80px;
}
+ .name-block.number-light-gray .number {
+ color: var(--color-light-gray);
+ }
+
/*----------------------------------------------------*/
diff --git a/resources/js/Global/components/Blocks/Number.vue b/resources/js/Global/components/Blocks/Number.vue
index dccc7e6..b805d67 100644
--- a/resources/js/Global/components/Blocks/Number.vue
+++ b/resources/js/Global/components/Blocks/Number.vue
@@ -71,4 +71,10 @@
background-color: $value;
}
}
+ @each $color,
+ $value in $colors {
+ .we-number.theme-#{$color} {
+ color: $value;
+ }
+ }
diff --git a/resources/js/Global/components/Drawer/SideBar.vue b/resources/js/Global/components/Drawer/SideBar.vue
index f7fc842..6c5c24f 100644
--- a/resources/js/Global/components/Drawer/SideBar.vue
+++ b/resources/js/Global/components/Drawer/SideBar.vue
@@ -7,8 +7,8 @@
{{ getAuthUser.name }}
-
{{ getCurrentTime }}
-
{{ new Date() | moment("dddd jDD jMMMM jYYYY") }}
+
{{ getCurrentTime }}
+
{{ new Date() | moment("dddd jDD jMMMM jYYYY") }}