navbar issues fixed

met18001 · May 6, 2020 · 44b673b · 44b673b
1 parent 48a5149
commit 44b673b
Show file tree

Hide file tree

Showing 3 changed files with 40 additions and 48 deletions.
diff --git a/css/main.css b/css/main.css
@@ -11,12 +11,9 @@ h1{
     text-align: center;
     color: black;
     font-size: 15px;
-    display: -webkit-box;
     display: flex;
-    -webkit-box-align: center;
-            align-items: center;
-    -webkit-box-pack: center;
-            justify-content: space-between;
+    align-items: center;
+    justify-content: space-between;
             font-family: 'Raleway', sans-serif;
     font-weight: 300; 
 }
@@ -38,10 +35,8 @@ h1{
     bottom: 0px;
     width: 100%;
     background-color: #E9E4E4;
-    display: -webkit-box;
     display: flex;
-    -webkit-box-pack: justify;
-            justify-content: space-between;
+    justify-content: space-between;
     height: 70px;  
     padding: .5em;
 
@@ -84,28 +79,18 @@ margin: 1.5vw !important;
     max-height: 60px;
 }
 .wrapper{
-    display: -webkit-box;
     display: flex;
-    -webkit-box-orient: horizontal;
-    -webkit-box-direction: normal;
-            flex-direction: column;
-    -webkit-box-align: center;
-            align-items: center;
-    -webkit-box-pack: center;
-            justify-content: center;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
 
 }
 
 .user{
-display: -webkit-box;
 display: flex;
--webkit-box-align: center;
 align-items: center;
--webkit-box-pack: center;
 justify-content: center;
--webkit-box-orient: vertical;
--webkit-box-direction: normal;
-        flex-direction: column;
+flex-direction: column;
 }
 h2{
     text-align: center;
@@ -146,12 +131,9 @@ a:link {
 
   }
   .box{
-      display: -webkit-box;
       display: flex;
-      -webkit-box-pack: center;
-        justify-content: center;
-        -webkit-box-align: center;
-                align-items: center;
+      justify-content: center;
+        align-items: center;
   }
   .smallImage {
     max-width: 300px;
@@ -163,16 +145,11 @@ span{
     padding-right: 3px;
 }
 .flex{
-    display: -webkit-box;
     display: flex;
-    -webkit-box-pack: center;
-            justify-content: center;
+    justify-content: center;
     align-content: center;
-    -webkit-box-orient: vertical;
-    -webkit-box-direction: normal;
-            flex-direction: column;
-    -webkit-box-align:center;
-            align-items:center;
+    flex-direction: column;
+    align-items:center;
 }
 #usernameInput{
     color: #C8AECA;
@@ -211,7 +188,6 @@ max-height: 150px;
 }
 div.float {
 float: right;
-display: -webkit-box;
 display: flex;
 text-align: end;
 
@@ -221,13 +197,9 @@ text-align: end;
     float: right;
 }
 .profile{
-    display: -webkit-box;
     display: flex;
-    -webkit-box-orient: vertical;
-    -webkit-box-direction: normal;
-            flex-direction: column;
-    -webkit-box-pack: center;
-            justify-content: center;
+    flex-direction: column;
+    justify-content: center;
     margin: 10px auto;
 }
 h1.button a{
@@ -251,9 +223,6 @@ h1.button a{
     margin-left: 0% !important;
     padding: 0% !important;
     width: 100% !important;
-    display: -webkit-box;
-    display: flex;
-    -webkit-box-pack: end;
     justify-content: flex-start;
     position: fixed;
     margin-top: 10px;
@@ -278,7 +247,6 @@ h1.button a{
 .navbar-light .navbar-nav li a:hover {
     height: 100%;
     background-color:#DEBDCE;
-    -webkit-transition: ease-in .75s;
     transition: ease-in .75s;
     color: white;
 }
@@ -297,4 +265,20 @@ background-color: black;
     max-height: 100px;
 }
 
+@media (max-width:765px){
+    .navbar-brand {
+        display: none;
+}
+
+
+
+}
 
+@media (min-width:780px){
+    .container {
+        display: flex;
+}
+
+
+
+}
diff --git a/js/profile.js b/js/profile.js
@@ -28,8 +28,14 @@ profileSaveInput.addEventListener( 'click', function(e) {
     saveProfileImageLocally();
 });
 
+function mew(){
+  let src = 'img/meow.mp3';
+  let audio = new Audio(src);
+  audio.play();
+}
+
 function savedProfile() {
-  alert("You have saved your profile Congrats!")
+  alert("You have saved your profile, Congrats!")
 
     var text = document.getElementById("showText");
     if (text.style.display === "none") {
@@ -39,3 +45,5 @@ function savedProfile() {
     }
 
   }
+
+
diff --git a/profile.html b/profile.html
@@ -14,7 +14,7 @@
         <p><input type="text" placeholder="Display Name" name="Username" id="usernameInput"></p>
         <p><input type="text" placeholder="Status Message" name="StatusMessage" id="statusInput"></p>
         <p><input type="file" id="profilePicInput" name="profilePicInput"></p>
-        <button a href="index.html" class="button" id="profileSaveInput" onclick="savedProfile()">Save Changes</a></button>
+        <button a href="index.html" class="button" id="profileSaveInput" onclick="savedProfile()" onclick="mew()">Save Changes</a></button>
         <h1 class="button"> <a href="index.html">Go Back to Chat App</a></h1>
     </div>
 </div>