Consolidate Button Styles in index.html and favs.html (#87)

* Fixed the remove from favourites issue * Updated CSS for login and upload buttons
lcrojano · Oct 25, 2024 · 4106d6a · 4106d6a
1 parent 4ef603e
commit 4106d6a
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 3 deletions.
diff --git a/favs.html b/favs.html
@@ -76,7 +76,7 @@ <h1 class="grow-2" id="logo">Giphy Search</h1>
           <!-- Add this button to trigger the modal for uploading GIFs -->
           <button
             id="upload-button"
-            class="secondary-btn"
+            class="secondary-btn upload-btn"
             style="margin-left: 15px"
           >
             Upload GIF

diff --git a/index.html b/index.html
@@ -73,12 +73,12 @@ <h1 class="grow-2" id="logo">Giphy Search</h1>
         </div>
         <div style="display: flex">
           <button class="secondary-btn">
-            <a href="login.html" style="text-decoration: none; color: inherit; font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; font-weight: bolder;">Log In</a>
+            <a href="login.html" style="text-decoration: none; color: inherit;">Log In</a>
           </button> 
           <!-- Add this button to trigger the modal for uploading GIFs -->
           <button
             id="upload-button"
-            class="secondary-btn"
+            class="secondary-btn upload-btn"
             style="margin-left: 15px; font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; font-weight: bolder;"
           >
             Upload GIF

diff --git a/styles/styles.css b/styles/styles.css
@@ -295,6 +295,8 @@ figure img {
   border-radius: 4px;
   height: 50px;
   cursor: pointer;
+  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+  font-weight: bolder;
 }
 
 
@@ -304,6 +306,10 @@ figure img {
   transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
 }
 
+.upload-btn {
+  margin-left: 15px;
+}
+
 .tag-btn {
   background-color: var(--principal-color-v2);
   color: var(--principal-text-color);