From 695c26774f1540b9cb6a51d6c068aa727a3168c4 Mon Sep 17 00:00:00 2001
From: valitovgaziz <a-c-v-a-l@mail.ru>
Date: Sat, 23 Nov 2024 01:29:29 +0500
Subject: [PATCH] Add Footer component

---
 spa/src/components/Footer.vue | 53 +++++++++++++++++++++++++++++++++++
 spa/src/views/HomeView.vue    |  9 +++---
 2 files changed, 57 insertions(+), 5 deletions(-)
 create mode 100644 spa/src/components/Footer.vue

diff --git a/spa/src/components/Footer.vue b/spa/src/components/Footer.vue
new file mode 100644
index 0000000..dbb2374
--- /dev/null
+++ b/spa/src/components/Footer.vue
@@ -0,0 +1,53 @@
+<template>
+    <footer class="footer">
+      <nav class="footer-nav">
+        <ul>
+          <li><a href="#about">О нас</a></li>
+          <li><a href="#requisites">Реквизиты</a></li>
+          <li><a href="#vacancies">Вакансии</a></li>
+          <li><a href="#donates">Донаты</a></li>
+        </ul>
+      </nav>
+      <p class="copyright">© Все права защищены, 2023</p>
+    </footer>
+  </template>
+  
+  <script>
+  export default {
+    name: 'AppFooter'
+  };
+  </script>
+  
+  <style scoped>
+  .footer {
+    background-color: #f9f9f9;
+    padding: 20px;
+    text-align: center;
+  }
+  
+  .footer-nav ul {
+    list-style-type: none;
+    padding: 0;
+    margin: 0;
+    display: flex;
+    justify-content: center;
+  }
+  
+  .footer-nav li {
+    margin-right: 20px;
+  }
+  
+  .footer-nav li:last-child {
+    margin-right: 0;
+  }
+  
+  .footer-nav a {
+    text-decoration: none;
+    color: #333;
+  }
+  
+  .copyright {
+    font-size: 14px;
+    margin-top: 10px;
+  }
+  </style>
\ No newline at end of file
diff --git a/spa/src/views/HomeView.vue b/spa/src/views/HomeView.vue
index f0b2daa..df59a77 100644
--- a/spa/src/views/HomeView.vue
+++ b/spa/src/views/HomeView.vue
@@ -1,11 +1,10 @@
 <script setup>
 import Header from '../components/Header.vue'
+import Footer from '../components/Footer.vue'
 </script>
 
 <template>
-  <header>
-    <Header />
-  </header>
-  <main>
-  </main>
+  <Header />
+  
+  <Footer />
 </template>