not working

Parv-gugnani · Parv-gugnani · commit 9cfab528cf0f · 2024-01-15T18:29:04.000+05:30
diff --git a/Youtube Clone/script.js b/Youtube Clone/script.js
@@ -4,6 +4,6 @@ document.addEventListener("DOMContentLoaded", function () {
 
   toggleButton.addEventListener("click", function () {
     linksContainer.style.maxHeight =
-      linksContainer.style.maxHeight === "0px" ? "200px" : "0px";
+      linksContainer.style.maxHeight === "px" ? "200px" : "0px";
   });
 });
diff --git a/Youtube Clone/style.css b/Youtube Clone/style.css
@@ -6,7 +6,6 @@ body {
     background-color: #0f0f0f;
 }
 
-
 .main {
     width: 100%;
     height: 100%;
@@ -37,13 +36,25 @@ body {
     color: white;
 }
 
+.links-container {
+    display: flex;
+    flex-direction: column;
+    max-height: 0;
+    overflow: hidden;
+    transition: max-height 0.3s ease-out;
+}
+
 .links {
     display: flex;
+    flex-direction: column;
     color: white;
+    margin-top: 10px;
+    /* Adjust the margin as needed */
 }
 
 .links a {
-    margin-right: 20px;
+    margin-bottom: 10px;
+    /* Adjust the margin as needed */
     text-decoration: none;
     color: white;
 }
@@ -53,15 +64,12 @@ body {
     align-items: center;
 }
 
-
 .search-bar input {
     padding: 8px;
     border: none;
     border-radius: 4px 0 0 4px;
     font-size: 14px;
-    outline: white;
-
-
+    flex-grow: 1;
 }
 
 .search-bar button {
@@ -71,21 +79,31 @@ body {
     border: none;
     border-radius: 4px 10px 10px 4px;
     cursor: pointer;
-    outline: white;
     font-size: 14px;
+    outline: blue;
 }
 
 input {
     background-color: #0f0f0f;
-    opacity: 80%;
+    opacity: 0.8;
+    outline: none;
 }
 
 #icon {
     width: 7px;
     height: 7px;
 }
 
-
 input[type="text"] {
     color: #ffffff;
+}
+
+/* Toggle button styles */
+.toggle-button {
+    cursor: pointer;
+    background: none;
+    border: none;
+    color: white;
+    font-size: 20px;
+    margin-right: 20px;
 }
