Template pages discount implementation

assets/styles/layout/templates/_templates.scss

@@ -1398,19 +1398,26 @@
             border-radius: 1rem;
             border: 1px solid var(--surface-200);
             background-color: var(--surface-card);
-            span {
+
+            &-title {
                 color: var(--surface-900);
                 font-weight: 600;
                 line-height: 1.5rem;
             }
 
-            h2 {
+            &-pricing {
                 color: var(--surface-900);
                 font-size: 2.5rem;
                 font-weight: 600;
                 line-height: 3rem;
                 letter-spacing: -0.025rem;
                 margin: 1rem 0 1.25rem;
+
+                &-discount-active {
+                    color: var(--surface-600);
+                    text-decoration: line-through;
+                    margin-right: 1rem;
+                }
             }
 
             button {

components/template/License.vue

@@ -4,8 +4,11 @@
             <div class="template-license-cards">
                 <template v-for="(detail, index) in license.licenseDetails" :key="index">
                     <div class="template-license-card">
-                        <span>{{ detail.title }}</span>
+                        <span class="template-license-card-title">{{ detail.title }}</span>
-                        <h2>{{ detail.price }}</h2>
+                        <div class="template-license-card-pricing">
+                            <span :class="{ 'template-license-card-pricing-discount-active': license.showDiscount }">{{ detail.price }}</span>
+                            <span v-if="license.showDiscount">{{ detail.discount }}</span>
+                        </div>
                         <div class="template-license-card-included">
                             <template v-for="(txt, i) in detail.included" :key="`text_${i}`">
                                 <p>{{ txt }}</p>

pages/templates/apollo/index.vue

@@ -220,15 +220,18 @@ export default {
             license: {
                 documentLink: 'https://apollo.primevue.org/documentation/',
                 description: 'The download package is a Vite-based project containing all application source codes deployed at the live demo. The project code is written in JavaScript.',
+                showDiscount: false,
                 licenseDetails: [
                     {
                         title: 'Basic License',
                         price: '$59',
+                        discount: '$39',
                         included: ['Non Commercial Usage', 'Single End Product, No Multi-Use', 'Lifetime Support', 'Unlimited Updates']
                     },
                     {
                         title: 'Extended License',
                         price: '$590',
+                        discount: '$390',
                         included: ['Commercial Usage', 'Multiple End Products', 'Lifetime Support', 'Unlimited Updates']
                     }
                 ]

pages/templates/atlantis/index.vue

@@ -208,15 +208,18 @@ export default {
             license: {
                 documentLink: 'https://atlantis.primevue.org/documentation',
                 description: 'The download package is a Vite-based project containing all application source codes deployed at the live demo. The project code is written in JavaScript.',
+                showDiscount: false,
                 licenseDetails: [
                     {
                         title: 'Basic License',
                         price: '$59',
+                        discount: '$39',
                         included: ['Non Commercial Usage', 'Single End Product, No Multi-Use', 'Lifetime Support', 'Unlimited Updates']
                     },
                     {
                         title: 'Extended License',
                         price: '$590',
+                        discount: '$390',
                         included: ['Commercial Usage', 'Multiple End Products', 'Lifetime Support', 'Unlimited Updates']
                     }
                 ]

pages/templates/avalon/index.vue

@@ -207,15 +207,18 @@ export default {
             license: {
                 documentLink: 'https://avalon.primevue.org/documentation',
                 description: 'The download package is a Vite-based project containing all application source codes deployed at the live demo. The project code is written in JavaScript.',
+                showDiscount: false,
                 licenseDetails: [
                     {
                         title: 'Basic License',
                         price: '$49',
+                        discount: '$29',
                         included: ['Non Commercial Usage', 'Single End Product, No Multi-Use', 'Lifetime Support', 'Unlimited Updates']
                     },
                     {
                         title: 'Extended License',
                         price: '$490',
+                        discount: '$290',
                         included: ['Commercial Usage', 'Multiple End Products', 'Lifetime Support', 'Unlimited Updates']
                     }
                 ]

pages/templates/diamond/index.vue

@@ -197,15 +197,18 @@ export default {
             license: {
                 documentLink: 'https://diamond.primevue.org/documentation/',
                 description: 'The download package is a Vite-based project containing all application source codes deployed at the live demo. The project code is written in JavaScript.',
+                showDiscount: false,
                 licenseDetails: [
                     {
                         title: 'Basic License',
                         price: '$59',
+                        discount: '$39',
                         included: ['Non Commercial Usage', 'Single End Product, No Multi-Use', 'Lifetime Support', 'Unlimited Updates']
                     },
                     {
                         title: 'Extended License',
                         price: '$590',
+                        discount: '$390',
                         included: ['Commercial Usage', 'Multiple End Products', 'Lifetime Support', 'Unlimited Updates']
                     }
                 ]

pages/templates/freya/index.vue

@@ -194,15 +194,18 @@ export default {
             license: {
                 documentLink: 'https://freya.primevue.org/documentation',
                 description: 'The download package is a Vite-based project containing all application source codes deployed at the live demo. The project code is written in JavaScript.',
+                showDiscount: false,
                 licenseDetails: [
                     {
                         title: 'Basic License',
                         price: '$59',
+                        discount: '$39',
                         included: ['Non Commercial Usage', 'Single End Product, No Multi-Use', 'Lifetime Support', 'Unlimited Updates']
                     },
                     {
                         title: 'Extended License',
                         price: '$590',
+                        discount: '$390',
                         included: ['Commercial Usage', 'Multiple End Products', 'Lifetime Support', 'Unlimited Updates']
                     }
                 ]

pages/templates/poseidon/index.vue

@@ -172,15 +172,18 @@ export default {
             license: {
                 documentLink: 'https://poseidon.primevue.org/documentation/',
                 description: 'The download package is a Vite-based project containing all application source codes deployed at the live demo. The project code is written in JavaScript.',
+                showDiscount: false,
                 licenseDetails: [
                     {
                         title: 'Basic License',
                         price: '$59',
+                        discount: '$39',
                         included: ['Non Commercial Usage', 'Single End Product, No Multi-Use', 'Lifetime Support', 'Unlimited Updates']
                     },
                     {
                         title: 'Extended License',
                         price: '$590',
+                        discount: '$390',
                         included: ['Commercial Usage', 'Multiple End Products', 'Lifetime Support', 'Unlimited Updates']
                     }
                 ]

pages/templates/ultima/index.vue

@@ -206,15 +206,18 @@ export default {
             license: {
                 documentLink: 'https://ultima.primevue.org/documentation/',
                 description: 'The download package is a Vite-based project containing all application source codes deployed at the live demo. The project code is written in JavaScript.',
+                showDiscount: false,
                 licenseDetails: [
                     {
                         title: 'Basic License',
                         price: '$59',
+                        discount: '$39',
                         included: ['Non Commercial Usage', 'Single End Product, No Multi-Use', 'Lifetime Support', 'Unlimited Updates']
                     },
                     {
                         title: 'Extended License',
                         price: '$590',
+                        discount: '$390',
                         included: ['Commercial Usage', 'Multiple End Products', 'Lifetime Support', 'Unlimited Updates']
                     }
                 ]

pages/templates/verona/index.vue

@@ -195,15 +195,18 @@ export default {
             license: {
                 documentLink: 'https://verona.primevue.org/documentation',
                 description: 'The download package is a Vite-based project containing all application source codes deployed at the live demo. The project code is written in JavaScript.',
+                showDiscount: false,
                 licenseDetails: [
                     {
                         title: 'Basic License',
                         price: '$49',
+                        discount: '$29',
                         included: ['Non Commercial Usage', 'Single End Product, No Multi-Use', 'Lifetime Support', 'Unlimited Updates']
                     },
                     {
                         title: 'Extended License',
                         price: '$490',
+                        discount: '$290',
                         included: ['Commercial Usage', 'Multiple End Products', 'Lifetime Support', 'Unlimited Updates']
                     }
                 ]