From c862a6bf04c35d17018d122a4976b52b228e9bfc Mon Sep 17 00:00:00 2001
From: Daria Golova <danalis969@gmail.com>
Date: Mon, 3 Oct 2022 17:55:04 +0300
Subject: [PATCH] =?UTF-8?q?=D0=98=D1=81=D0=BF=D1=80=D0=B0=D0=B2=D0=B8?=
 =?UTF-8?q?=D0=BB=D0=B0=20=D0=BE=D1=82=D1=81=D1=82=D1=83=D0=BF=D1=8B=20?=
 =?UTF-8?q?=D0=B2=20=D1=81=D1=82=D0=B8=D0=BB=D1=8F=D1=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../homePageComponents/HeaderComponent.vue    | 53 +++++++++----------
 1 file changed, 26 insertions(+), 27 deletions(-)

diff --git a/src/components/homePageComponents/HeaderComponent.vue b/src/components/homePageComponents/HeaderComponent.vue
index 754fb16..607fb86 100644
--- a/src/components/homePageComponents/HeaderComponent.vue
+++ b/src/components/homePageComponents/HeaderComponent.vue
@@ -6,7 +6,7 @@
       div.inputs-wrapper
         img.search-icon(src="../../assets/icons/search.svg" alt="Search")
         select.inputs.select(v-model="selectedFilter")
-          option(v-for="filter in filters" :value="filter") {{ filter }}
+          option(v-for="filter in filters" :key="filter" :value="filter") {{ filter }}
         span.separator  
         input.inputs.search-input(placeholder="Искать ...")
       button.flex.center.btn-notification
@@ -31,8 +31,20 @@ export default {
 }
 </script>
 
-<style lang="sass">
-@import "../../assets/sass/variables.sass"
+<style lang='sass'>
+@import '../../assets/sass/variables.sass'
+
+input
+  padding: 0 
+
+button
+  outline: none
+  border: none
+  background-color: transparent
+  cursor: pointer
+  padding: 0
+  color: $font-dark-blue-color 
+
 .header-wrapper
   width: 100%
   padding: 8px 24px
@@ -70,22 +82,11 @@ export default {
   margin-right: 46px
 
 .search-icon
-    position: absolute
-    height: 24px
-    width: 24px
-    color: $btn-blue-color
-    opacity: .7 
-
-input
-  padding: 0 
-
-button
-  outline: none
-  border: none
-  background-color: transparent
-  cursor: pointer
-  padding: 0
-  color: $font-dark-blue-color
+  position: absolute
+  height: 24px
+  width: 24px
+  color: $btn-blue-color
+  opacity: 0.7 
 
 .btn-notification
   margin-right: 32px
@@ -112,18 +113,18 @@ button
   font-size: 16px
   line-height: 19px
   font-feature-settings: 'pnum' on, 'lnum' on
+  display: inline-block
+  vertical-align: middle
   &::placeholder
     color: $btn-blue-color
-    opacity: .5
+    opacity: 0.5
 
 .select
   -webkit-appearance: none
   -moz-appearance: none
   -ms-appearance: none
   appearance: none
-  display: inline-block
-  vertical-align: middle
-  background: url( "../../assets/icons/down-arrow-1.svg") no-repeat right top 4px
+  background: url(../../assets/icons/down-arrow-1.svg) no-repeat right top 4px
   overflow: hidden
   margin-right: 16px
   padding: 2px 20px 2px 30px
@@ -137,15 +138,13 @@ button
   vertical-align: middle
   height: 254px
   border-left: 1px solid $btn-blue-color
-  opacity: .5
+  opacity: 0.5
   border-radius: 4px
   height: 100%
 
-.avatar-wrapper
-  
-
 .avatar-img
   width: 32px
   height: 32px
   margin-right: 8px
+
 </style>