Update componen template

2026-03-13 03:56:11 +00:00
parent 6bb6a1d430
commit f2ed1b2556
33 changed files with 1899 additions and 0 deletions
@@ -0,0 +1,18 @@
+<template>
+    <v-card elevation="0" rounded="md" class="bg-lightinfo mt-6">
+        <v-card-item class="py-0">
+            <v-row class="d-flex align-center">
+                <v-col cols="12" sm="7">
+                    <h5 class="text-h5 pt-3 mb-4">Track your every Transaction Easily</h5>
+                    <p class="topacity-80 mb-1 textSecondary text-body-1 lh-md">Track and record your every income and expence easily to control your balance</p>
+                    <v-btn flat color="info" class="mt-4" size="large">Download</v-btn>
+                </v-col>
+                <v-col cols="12" sm="5">
+                    <div class="px-11 pt-5 pb-0">
+                     <img src="@/assets/images/backgrounds/track-bg.png" height="215"  class="mb-n10 ml-sm-5" alt="image"/>
+                    </div>
+                </v-col>
+            </v-row>
+        </v-card-item>
+    </v-card>
+</template> 
@@ -0,0 +1,12 @@
+<template>
+    <v-card elevation="10" class=" mt-6">
+        <v-card-item class="text-center">
+            <img src="@/assets/images/backgrounds/maintenance.svg" width="200" alt="image" />
+            <h5 class="text-h5 pt-3 mb-0">Oops something went wrong!</h5>
+            <p class="text-body-1  mt-3 textSecondary">
+               Trying again to bypasses these<br> temporary error.
+            </p>
+            <v-btn flat class="mt-4" size="large" color="error">Retry</v-btn>
+        </v-card-item>
+    </v-card>
+</template>
@@ -0,0 +1,12 @@
+<template>
+    <v-card elevation="10" class=" mt-6">
+        <v-card-item class="text-center">
+            <img src="@/assets/images/products/empty-shopping-cart.svg" alt="image" width="200" />
+            <h5 class="text-h5 pt-3 mb-0">Oop, Your cart is empty!</h5>
+            <p class="text-body-1 mt-3 textSecondary">
+               Get back to shopping and get  rewards from it.
+            </p>
+            <v-btn flat class="mt-4" size="large" color="primary">Go for shopping</v-btn>
+        </v-card-item>
+    </v-card>
+</template>
@@ -0,0 +1,13 @@
+<template>
+    <v-card elevation="10" class=" mt-sm-0 mt-6">
+        <v-card-item class="text-center">
+            <p class="text-body-1 mb-4 textSecondary">LEVEL UP</p>
+            <img src="@/assets/images/backgrounds/gold.png" alt="image" width="150" />
+            <h5 class="text-h5 pt-3 mb-0">You reach all Notifications</h5>
+            <p class="text-body-1 mt-3 textSecondary">
+              Congratulations,<br> Tap to continue next task.
+            </p>
+            <v-btn flat color="primary" class="mt-4"  size="large">Yes, Got it!</v-btn>
+        </v-card-item>
+    </v-card>
+</template>
@@ -0,0 +1,25 @@
+<template>
+    <v-card elevation="10" class=" mt-6">
+        <v-card-item class="text-center">
+            <h5 class="text-h5 mb-6">Mutual Friend Revealed</h5>
+                <v-badge content="1" color="error"  
+                    offset-x="18"
+                    offset-y="18"
+                >
+                    <v-avatar size="140">
+                        <img src="@/assets/images/profile/user-3.jpg" height="140" alt="image" />    
+                    </v-avatar>
+                </v-badge>
+            
+                <h5 class="text-h5 pt-3 mt-3 mb-0">Tommoie Henderson</h5>
+            <p class="text-body-1 mt-3 textSecondary">
+              Accept the request and<br> type a message
+            </p>
+            <div class="d-flex justify-center gap-3 mt-4">
+                <v-btn flat color="primary" size="large">accept</v-btn>
+            <v-btn flat variant="tonal"  size="large"  color="error">remove</v-btn>
+            </div>
+          
+        </v-card-item>
+    </v-card>
+</template>
@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import { Icon } from '@iconify/vue';
+</script>
+<template>
+    <v-card elevation="10" class="bg-primary-gt position-relative profit-card overflow-hidden">
+        <v-card-item>
+            <v-row>
+                <v-col cols="12" md="6">
+                    <h5 class="text-h5 text-white mb-4">Welcome back David!</h5>
+                    <p class="opacity-80 mb-1 text-white text-body-1 lh-md">You have earned 54% more than last month which is great thing.</p>
+                    <v-btn flat color="error" size="large" class="mt-4">check</v-btn>    
+                </v-col>
+            </v-row>
+        </v-card-item>
+        <img src="@/assets/images/backgrounds/welcome-bg2.png" alt="matdash-img" class="position-absolute" />
+    </v-card>
+</template>