refactor: changed style of langBtn

Byte-Boost · Aug 29, 2023 · 21af883 · 21af883
1 parent 09daae3
commit 21af883
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 6 deletions.
diff --git a/src/static/css/style.css b/src/static/css/style.css
@@ -215,11 +215,17 @@ ul li a {
   transform-origin: left;
 }
 #langBtn{
-  width: 38px;
-  height: 38px;
+  filter: grayscale(100%);
+  width: 30px;
+  height: 20px;
   margin-right: 20px;
+  transition: 1s all cubic-bezier(0.075, 0.82, 0.165, 1);
   cursor: pointer;
 }
+#langBtn:hover{
+  filter: grayscale(0%);
+  transform: scale(1.5);
+}
 #themeSwitch, 
 #themeSwitchLabel{
   cursor: pointer;

diff --git a/src/static/images/Flag-Brazil.png b/src/static/images/Flag-Brazil.png
diff --git a/src/static/images/Flag-United-States-of-America.png b/src/static/images/Flag-United-States-of-America.png
diff --git a/src/templates/template.html b/src/templates/template.html
@@ -31,7 +31,7 @@
                 <img src="../static/images/home.png" alt="navbarlogo" width="50px" height="50px" class="d-inline-block align-text-top">
             </a>
             <div class="collapse navbar-collapse" id="navcontent">
-                <ul class="navbar-nav p-2">
+                <ul class="navbar-nav p-0">
                     <li class="nav-item dropdown">
                         <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                             Metodologia</a>
@@ -76,7 +76,7 @@
                     </li>
                 </ul>
             </div>  
-            <img src="../static/images/globe.png" id="langBtn" data-current-lang="br"></img>
+            <img src="../static/images/Flag-Brazil.png" id="langBtn" data-current-lang="br"></img>
             <div class="form-check form-switch">
                 <input class="form-check-input" type="checkbox" role="switch" id="themeSwitch">
                 <label class="form-check-label" for="themeSwitch" id="themeSwitchLabel">Light/Dark mode</label>

diff --git a/src/templates/template_en.html b/src/templates/template_en.html
@@ -31,7 +31,7 @@
                 <img src="../../static/images/home.png" alt="navbarlogo" width="50px" height="50px" class="d-inline-block align-text-top">
             </a>
             <div class="collapse navbar-collapse" id="navcontent">
-                <ul class="navbar-nav p-2">
+                <ul class="navbar-nav p-0">
                     <li class="nav-item dropdown">
                         <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                             Methodology</a>
@@ -76,7 +76,7 @@
                     </li>
                 </ul>
             </div>  
-            <img src="../../static/images/globe.png" id="langBtn" data-current-lang="en"></img>
+            <img src="../../static/images/Flag-United-States-of-America.png" id="langBtn" data-current-lang="en"></img>
             <div class="form-check form-switch">
                 <input class="form-check-input" type="checkbox" role="switch" id="themeSwitch">
                 <label class="form-check-label" for="themeSwitch" id="themeSwitchLabel">Light/Dark mode</label>