From bb6aec44e53fafef4ea7d8b3a18c70f95c2b906f Mon Sep 17 00:00:00 2001
From: khatabwedaa <khatabwedaa@gmail.com>
Date: Sun, 10 May 2020 13:11:00 +0200
Subject: [PATCH] Rename @harsh07bharvada CARD and edit some classes

---
 src/Models/data.js                            |  2 +-
 src/components/Master.vue                     |  4 +--
 .../UI/Cards/ProductCardWithPrice.vue         | 29 -------------------
 src/components/UI/Cards/SimpleProductCard.vue | 26 +++++++++++++++++
 4 files changed, 29 insertions(+), 32 deletions(-)
 delete mode 100644 src/components/UI/Cards/ProductCardWithPrice.vue
 create mode 100644 src/components/UI/Cards/SimpleProductCard.vue

diff --git a/src/Models/data.js b/src/Models/data.js
index cc3f051..dba0f03 100644
--- a/src/Models/data.js
+++ b/src/Models/data.js
@@ -15,8 +15,8 @@ export default [
         components: [
             { name: 'Article card' },
             { name: 'Article card with image' },
+            { name: 'Simple product card' },
             { name: 'Product card' },
-            { name: 'Product card with price' },
             { name: 'Product card with evaluation' },
             { name: 'Testimonial card' },
             { name: 'User card' },
diff --git a/src/components/Master.vue b/src/components/Master.vue
index c83917e..06c7bf9 100644
--- a/src/components/Master.vue
+++ b/src/components/Master.vue
@@ -51,8 +51,8 @@
     // Cards
     import ArticleCard from "./UI/Cards/ArticleCard";
     import ArticleCardWithImage from "./UI/Cards/ArticleCardWithImage";
+    import SimpleProductCard from "./UI/Cards/SimpleProductCard";
     import ProductCard from "./UI/Cards/ProductCard";
-    import ProductCardWithPrice from "./UI/Cards/ProductCardWithPrice";
     import ProductCardWithEvaluation from "./UI/Cards/ProductCardWithEvaluation";
     import TestimonialCard from "./UI/Cards/TestimonialCard";
     import UserCard from "./UI/Cards/UserCard";
@@ -90,8 +90,8 @@
 
             ArticleCard,
             ArticleCardWithImage,
+            SimpleProductCard,
             ProductCard,
-            ProductCardWithPrice,
             ProductCardWithEvaluation,
             TestimonialCard,
             UserCard,
diff --git a/src/components/UI/Cards/ProductCardWithPrice.vue b/src/components/UI/Cards/ProductCardWithPrice.vue
deleted file mode 100644
index bb08867..0000000
--- a/src/components/UI/Cards/ProductCardWithPrice.vue
+++ /dev/null
@@ -1,29 +0,0 @@
-<template>
-    <div :id="name | toId">
-        <div class="flex flex-col max-w-sm mx-auto h-full justify-center items-center">
-           
-                <div style="background-image: url(https://images.unsplash.com/photo-1539185441755-769473a23570?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1951&q=80"
-                     class="flex bg-gray-300 h-64 w-full rounded-lg shadow-md bg-cover bg-top">
-                </div>
-                <div class="flex flex-col h-20 w-48 md:w-64 bg-white -mt-10 text-sm shadow-lg rounded-lg justify-center items-center">
-                    <div class="flex w-full h-10 justify-center items-center font-bold uppercase tracking-wide">Nike Revolt</div>
-                    <div class="flex items-center justify-between w-full h-10 px-3 bg-gray-200 rounded-b-lg">
-                        <h1 class="text-gray-800 font-bold ">$129</h1>
-                        <button class=" bg-gray-700 text-xs text-white px-2 py-1 font-semibold rounded ">Add to cart</button>
-                    </div>
-                </div>
-            
-        </div>
-        
-    </div>
-</template>
-
-<script>
-    export default {
-        data() {
-            return {
-                name: 'Product Card with Price',
-            }
-        }
-    }
-</script>
diff --git a/src/components/UI/Cards/SimpleProductCard.vue b/src/components/UI/Cards/SimpleProductCard.vue
new file mode 100644
index 0000000..f6a822a
--- /dev/null
+++ b/src/components/UI/Cards/SimpleProductCard.vue
@@ -0,0 +1,26 @@
+<template>
+    <div :id="name | toId">
+        <div class="flex flex-col justify-center items-center max-w-sm mx-auto">
+            <div style="background-image: url(https://images.unsplash.com/photo-1539185441755-769473a23570?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1951&q=80"
+                    class="bg-gray-300 h-64 w-full rounded-lg shadow-md bg-cover bg-center">
+            </div>
+            <div class="w-56 md:w-64 bg-white -mt-10 shadow-lg rounded-lg overflow-hidden">
+                <div class="py-2 text-center font-bold uppercase tracking-wide text-gray-800">Nike Revolt</div>
+                <div class="flex items-center justify-between py-2 px-3 bg-gray-200">
+                    <h1 class="text-gray-800 font-bold ">$129</h1>
+                    <button class=" bg-gray-800 text-xs text-white px-2 py-1 font-semibold rounded uppercase hover:bg-gray-700">Add to cart</button>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        data() {
+            return {
+                name: 'Simple Product Card',
+            }
+        }
+    }
+</script>