Login done

moevm · Nov 15, 2024 · 4b97ea8 · 4b97ea8
1 parent f8c77ed
commit 4b97ea8
Show file tree

Hide file tree

Showing 29 changed files with 419 additions and 39 deletions.
diff --git a/frontend/index.html b/frontend/index.html
@@ -4,6 +4,9 @@
     <meta charset="UTF-8">
     <link rel="icon" href="/favicon.ico">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
     <title>Vite App</title>
   </head>
   <body>

diff --git a/frontend/src/assets/css/fonts.css b/frontend/src/assets/css/fonts.css
diff --git a/frontend/src/assets/css/main.css b/frontend/src/assets/css/main.css
@@ -9,6 +9,7 @@
 }
 
 body {
+  font-family: 'Montserrat', 'sans-serif';
   background-color: #D9D9D9;
 }
 

diff --git a/frontend/src/assets/fonts/Poppins/Poppins-Black.ttf b/frontend/src/assets/fonts/Poppins/Poppins-Black.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-BlackItalic.ttf b/frontend/src/assets/fonts/Poppins/Poppins-BlackItalic.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-Bold.ttf b/frontend/src/assets/fonts/Poppins/Poppins-Bold.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-BoldItalic.ttf b/frontend/src/assets/fonts/Poppins/Poppins-BoldItalic.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-ExtraBold.ttf b/frontend/src/assets/fonts/Poppins/Poppins-ExtraBold.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-ExtraBoldItalic.ttf b/frontend/src/assets/fonts/Poppins/Poppins-ExtraBoldItalic.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-ExtraLight.ttf b/frontend/src/assets/fonts/Poppins/Poppins-ExtraLight.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-ExtraLightItalic.ttf b/frontend/src/assets/fonts/Poppins/Poppins-ExtraLightItalic.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-Italic.ttf b/frontend/src/assets/fonts/Poppins/Poppins-Italic.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-Light.ttf b/frontend/src/assets/fonts/Poppins/Poppins-Light.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-LightItalic.ttf b/frontend/src/assets/fonts/Poppins/Poppins-LightItalic.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-Medium.ttf b/frontend/src/assets/fonts/Poppins/Poppins-Medium.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-MediumItalic.ttf b/frontend/src/assets/fonts/Poppins/Poppins-MediumItalic.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-Regular.ttf b/frontend/src/assets/fonts/Poppins/Poppins-Regular.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-SemiBold.ttf b/frontend/src/assets/fonts/Poppins/Poppins-SemiBold.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-SemiBoldItalic.ttf b/frontend/src/assets/fonts/Poppins/Poppins-SemiBoldItalic.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-Thin.ttf b/frontend/src/assets/fonts/Poppins/Poppins-Thin.ttf
diff --git a/frontend/src/assets/fonts/Poppins/Poppins-ThinItalic.ttf b/frontend/src/assets/fonts/Poppins/Poppins-ThinItalic.ttf
diff --git a/frontend/src/assets/svg/close.svg b/frontend/src/assets/svg/close.svg
diff --git a/frontend/src/assets/svg/eye/closedEye.svg b/frontend/src/assets/svg/eye/closedEye.svg
diff --git a/frontend/src/assets/svg/eye/openedEye.svg b/frontend/src/assets/svg/eye/openedEye.svg
diff --git a/frontend/src/components/TheHeader.vue b/frontend/src/components/TheHeader.vue
@@ -1,9 +1,17 @@
 <script>
+import LoginModal from "@/components/modals/LoginModal.vue";
+
 export default {
-    name: 'HeaderComp',
+    components: {LoginModal},
+    data() {
+        return {
+            showLoginModal: false,
+        }
+    },
+
     methods: {
-        openRegistrationModal() {
-            return 0
+        openProfile() {
+            this.showLoginModal = true
         }
     }
 }
@@ -20,15 +28,15 @@ export default {
             </div>
             <div class="profile-basket">
                 <button>
-                    <img src="../assets/svg/profile.svg" alt="profile"/>
+                    <img src="../assets/svg/profile.svg" alt="profile" @click="openProfile"/>
                 </button>
                 <button>
-                    <img src="../assets/svg/basket.svg" alt="basket" @click="openRegistrationModal"/>
+                    <img src="../assets/svg/basket.svg" alt="basket"/>
                 </button>
-
             </div>
         </div>
     </div>
+    <LoginModal :isVisible="showLoginModal" @update:isVisible="showLoginModal = $event"></LoginModal>
 </template>
 
 <style scoped>

diff --git a/frontend/src/components/modals/ErrorModal.vue b/frontend/src/components/modals/ErrorModal.vue
@@ -0,0 +1,76 @@
+<template>
+    <div v-if="show" class="modal">
+        <div class="modal-content">
+            <button @click="closeModal" class="close">
+                <img src="../../assets/svg/close.svg" alt="close"/>
+            </button>
+            <p v-for="error in errors">{{ error }}</p>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    name: 'ErrorModal',
+    props: {
+        show: {
+            type: Boolean,
+            required: true
+        },
+        errors: {
+            type: Array,
+            required: true
+        }
+    },
+    methods: {
+        closeModal() {
+            this.$emit('close')
+        }
+    },
+};
+</script>
+
+<style scoped>
+/* Стили для модального окна */
+.modal {
+    display: block;
+    position: fixed;
+    z-index: 1;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    background-color: rgba(0, 0, 0, 0.4);
+}
+
+.modal-content {
+    background-color: #DA686A;
+    margin: 15% auto;
+    padding: 32px 64px;
+    border: 3px solid #760A0C;
+    width: 50%;
+    border-radius: 10px;
+}
+
+.close {
+    display: inline;
+    left: 70%;
+    position: absolute;
+}
+
+.close:hover,
+.close:focus {
+    color: #000;
+    text-decoration: none;
+    cursor: pointer;
+}
+
+p:has(+ p) {
+    margin-bottom: 16px;
+}
+
+p {
+    font-size: 24px;
+}
+</style>
-Original file line number
+Diff line change
@@ Expand Up / @@ -9,6 +9,7 @@ @@
     }
     body {
+      font-family: 'Montserrat', 'sans-serif';
       background-color: #D9D9D9;
     }
@@ Expand Down @@