Renaming

src/Models/data.js

@@ -2,47 +2,53 @@ export default [
     {
         name: 'Alert',
         components: [
-            { name: 'Success Alert' },
-            { name: 'Info Alert' },
-            { name: 'Warning Alert' },
-            { name: 'Error Alert' },
-            { name: 'Notification Pop' },
+            { name: 'Success alert' },
+            { name: 'Info alert' },
+            { name: 'Warning alert' },
+            { name: 'Error alert' },
+            { name: 'Notification pop' },
 
         ],
     },
     {
         name: 'Cards',
         components: [
-            { name: 'Article Card' },
-            { name: 'Article Card With Image' },
-            { name: 'Product Card' },
-            { name: 'Product Card With Evaluation' },
-            { name: 'Testimonial Card' },
-            { name: 'User Card' },
-            { name: 'User Card With Details' },
+            { name: 'Article card' },
+            { name: 'Article card with image' },
+            { name: 'Product card' },
+            { name: 'Product card with evaluation' },
+            { name: 'Testimonial card' },
+            { name: 'User card' },
+            { name: 'User card with details' },
         ],
     },
     {
         name: 'Forms',
         components: [
             {name: 'Inputs Form'},
-            {name: 'Newsletter Form'},
-            {name: 'Sign In Form'},
-            {name: 'Sign In Form With Image'},
-        ],
-    },
-    {
-        name: 'Heroes',
-        components: [
-            { name: 'Hero With Image' },
-            { name: 'Hero With Pattern' },
+            {name: 'Newsletter form'},
+            {name: 'Sign in form'},
+            {name: 'Sign in form with image'},
         ],
     },
     {
         name: 'Navbars',
         components: [
             { name: 'Navbar' },
-            { name: 'Navbar With Search' },
+            { name: 'Navbar with search' },
+        ]
+    },
+    {
+        name: 'Headers',
+        components: [
+            { name: 'Header with image' },
+            { name: 'Header with pattern' },
+        ],
+    },
+    {
+        name: 'Sections',
+        components: [
+            { name: 'Paragraph with image' },
         ]
     },
     {
@@ -51,4 +57,10 @@ export default [
             { name: 'Pagination' },
         ]
     },
+    {
+        name: 'Footers',
+        components: [
+            { name: 'Footer with subscribe form' },
+        ]
+    },
 ];

src/components/Master.vue

@@ -23,7 +23,7 @@
                     </div>
                 </div>
             </div>
-            <p class="mt-8 text-gray-700">Heroes components require simple(Don't panic please😘) <a class="text-blue-600 hover:underline" href="https://gist.github.com/Miaababikir/052e31b345781c0f73180b80a285781b" target="_blank">configuration</a></p>
+            <p class="mt-8 text-gray-700">Header components require simple(Don't panic please😘) <a class="text-blue-600 hover:underline" href="https://gist.github.com/Miaababikir/052e31b345781c0f73180b80a285781b" target="_blank">configuration</a></p>
         </div>
 
         <div class="w-full max-w-5xl mx-auto">
@@ -61,14 +61,19 @@
     import NewsletterForm from "./UI/Forms/NewsletterForm";
     import SignInForm from "./UI/Forms/SignInForm";
     import SignInFormWithImage from "./UI/Forms/SignInFormWithImage";
-    // Heroes
-    import HeroWithImage from "./UI/Heroes/HeroWithImage";
-    import HeroWithPattern from "./UI/Heroes/HeroWithPattern";
+    // Header
+    import HeaderWithImage from "./UI/Header/HeaderWithImage";
+    import HeaderWithPattern from "./UI/Header/HeaderWithPattern";
     // Navbars
     import Navbar from "./UI/Navbars/Navbar";
     import NavbarWithSearch from "./UI/Navbars/NavbarWithSearch";
-    // Paginations
+    // Sections
+    import ParagraphWithImage from "./UI/Sections/ParagraphWithImage";
+    // Pagination
     import Pagination from "./UI/Paginations/Pagination";
+    // Footers
+    import FooterWithSubscribeForm from "./UI/Footers/FooterWithSubscribeForm";
+
 
 
     import Component from "../Models/Component";
@@ -95,14 +100,18 @@
             SignInForm,
             SignInFormWithImage,
 
-            HeroWithImage,
-            HeroWithPattern,
+            HeaderWithImage,
+            HeaderWithPattern,
 
             Navbar,
             NavbarWithSearch,
 
+            ParagraphWithImage,
+
             Pagination,
 
+            FooterWithSubscribeForm,
+
             ViewComponent,
         },
         data() {

src/components/UI/Header/HeaderWithImage.vue

@@ -74,7 +74,7 @@
     export default {
         data() {
             return {
-                name: 'Hero With Image',
+                name: 'Header With Image',
                 isOpen: false,
             }
         }

src/components/UI/Header/HeaderWithPattern.vue

@@ -52,7 +52,7 @@
     export default {
         data() {
             return {
-                name: 'Hero With Pattern'
+                name: 'Header With Pattern'
             }
         }
     }