From c14d0a9d21ca37e3ec409f4ee06dd70f4bef12af Mon Sep 17 00:00:00 2001
From: Wawilski <Karpinskiwal@gmail.com>
Date: Sat, 9 Mar 2024 11:07:13 +0100
Subject: [PATCH] option language settings start

---
 frontend/src/App.vue | 39 +++++++++++++++++++++++++++++++++++----
 1 file changed, 35 insertions(+), 4 deletions(-)

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 51f8882..2ee53b0 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -26,8 +26,10 @@
   const notifications=ref(i18n("app.notifications"))
   const settings=ref(i18n("app.settings"))
   const login=ref(i18n("app.login"))
-  
-
+  const active=ref(false)
+  function toggle() {
+    active = !active;
+  }
 
 </script>
 
@@ -52,9 +54,17 @@
             <a href="#Notifications">
                 <div class="fa-solid fa-bell"  style="margin-top: 7px; margin-bottom: 3px;"></div>
             </a></li>
-        <li style="float: right;" title=settings>
+        <li @click="active=true"  class="option"style="float: right;" title=settings>
             <a href="#Options">
                 <div  class="fa-solid fa-gear"  style="margin-top: 7px; margin-bottom: 3px;"></div>
+                <div v-if="active"class="dropdown">
+                  <div class="content">Langage</div>
+                  <ul style="list-style-type:none;margin:0;padding:0;">
+                    <li style="float:left; font-size:10px; color:black;"><button @:click="setLang('en')" href="#home">EN</button></li>
+                    <li style="float:left;font-size:10px; color:black;"><button @:click="setLang('fr')" href="#home">FR</button></li>
+                  </ul>
+
+                </div>
             </a></li>
 
         <li style="float:right; margin-top:7.5px;" title="Language">
@@ -122,8 +132,30 @@
   .leftBar{
     grid-area:leftBar;
   }
+.option {
+  position: relative;
+  display: block;
+}
 
 
+.dropdown {
+  margin-top:55px;
+  display: block;
+  height:150px;
+  font-size: 13px;
+  position: absolute;
+  z-index: 1;
+  background-color:white;
+}
+
+.dropdown .content {
+  color: #4CAF50;
+  padding: 8px 10px;
+  text-decoration: none;
+  display: block;
+  transition: 0.1s;
+}
+
 	ul.vertical{
 		list-style-type: none;
 		margin-top: 61px;
@@ -176,7 +208,6 @@
 		position: fixed;
 		height:61px;
 		width: 100%;
-		overflow: hidden;
 		background-color: rgb(24, 24, 24);
 	}