Merge pull request #163 from hamzashakeel1/master

Fixed UI Issues in Files

Author: pgleeson

contacts.html

@@ -31,7 +31,7 @@
 		    <div class="navbar-inner" id="head-nav">
 		    </div>
 		</div>
-		<script src="js/jquery-3.2.1.js"></script>
+		<script src="js/jquery-3.6.0.js"></script>
 		<script>
 		 // get head-nav and foot-nav with jquery (get is async)
 		 $.get('header-content.html', function(data) {

css/main.css

@@ -33,6 +33,17 @@
     color: inherit;
     text-decoration: none;
 }
+/****/
+.carousel-inner > .item > img{
+    object-fit: cover;
+}
+.donate_btn{
+    padding: 11px 19px;
+    font-size: 17.5px;
+    -webkit-border-radius: 6px;
+    -moz-border-radius: 6px;
+    border-radius: 6px;
+}
 @media
 (-webkit-min-device-pixel-ratio: 2),
 (min-resolution: 192dpi) {
@@ -875,3 +886,39 @@ dd {
 .clearer {
     clear: both;
 }
+@media (max-width: 979px){
+button.btn.btn-navbar {
+    display: flex;
+    flex-flow: column;
+}
+span.fa.fa-bar {
+    background: white !important;
+    height: 2px;
+    width: 18px;
+    margin-bottom: 1px;
+    margin-top: 2px;
+}
+.jumbotron{
+    margin-top: 0px !important;
+}
+.carousel-control {
+    z-index: 9999;
+}
+}
+@media (max-width: 767px){
+    .navbar-fixed-top, .navbar-fixed-bottom, .navbar-static-top {
+        margin-right: 0px;
+    }  
+    .subhead {
+        padding-left: 15px !important;
+        padding-right: 15px !important;
+    }
+    /* #myCarousel .carousel-caption {
+        margin: 0 auto;
+        text-align: center;
+    } */
+    /* #myCarousel .item{
+        display: flex;
+        align-items: center;
+    } */
+}

donate.html

@@ -31,7 +31,7 @@
 	    <div class="navbar-inner" id="head-nav">
 	    </div>
 	</div>
-	<script src="js/jquery-3.2.1.js"></script>
+	<script src="js/jquery-3.6.0.js"></script>
 	<script>
 	 // get head-nav and foot-nav with jquery (get is async)
 	 $.get('header-content.html', function(data) {
@@ -96,7 +96,7 @@ <h1>How can I contribute?</h1>
 			    <input type="hidden" name="cpp_header_image" value="http://www.openworm.org/img/OpenWormLogoS.png">
 			    <input type="hidden" name="cmd" value="_donations">
 			    <input id="amountSent" type="hidden" name="amount" value="50">
-			    <input type="submit" class="btn btn-danger btn-large" name="submit" value="Donate now">
+			    <input type="submit" class="btn btn-danger donate_btn" name="submit" value="Donate now">
 			    <input type="hidden" name="business" value="[email protected]">
 			    <input type="hidden" name="item_name" value="OpenWorm donation">
 			    <input type="hidden" name="currency_code" value="USD">

downloads.html

@@ -31,7 +31,7 @@
 	    <div class="navbar-inner" id="head-nav">
 	    </div>
 	</div>
-	<script src="js/jquery-3.2.1.js"></script>
+	<script src="js/jquery-3.6.0.js"></script>
 	<script>
 	 // get head-nav and foot-nav with jquery (get is async)
 	 $.get('header-content.html', function(data) {

educators.html

@@ -30,7 +30,7 @@
 	    <div class="navbar-inner" id="head-nav">
 	    </div>
 	</div>
-	<script src="js/jquery-3.2.1.js"></script>
+	<script src="js/jquery-3.6.0.js"></script>
 	<script>
 	 // get head-nav and foot-nav with jquery (get is async)
 	 $.get('header-content.html', function(data) {

events.html

@@ -32,7 +32,7 @@
 	    <div class="navbar-inner" id="head-nav">
 	    </div>
 	</div>
-	<script src="js/jquery-3.2.1.js"></script>
+	<script src="js/jquery-3.6.0.js"></script>
 	<script>
 	 // get head-nav and foot-nav with jquery (get is async)
 	 $.get('header-content.html', function(data) {

get_involved.html

@@ -30,7 +30,7 @@
 	    <div class="navbar-inner" id="head-nav">
 	    </div>
 	</div>
-	<script src="js/jquery-3.2.1.js"></script>
+	<script src="js/jquery-3.6.0.js"></script>
 	<script>
 	 // get head-nav and foot-nav with jquery (get is async)
 	 $.get('header-content.html', function(data) {

getting_started.html

@@ -31,7 +31,7 @@
 	    <div class="navbar-inner" id="head-nav">
 	    </div>
 	</div>
-	<script src="js/jquery-3.2.1.js"></script>
+	<script src="js/jquery-3.6.0.js"></script>
 	<script>
 	 // get head-nav and foot-nav with jquery (get is async)
 	 $.get('header-content.html', function(data) {

index.html

@@ -31,7 +31,7 @@
 	    <div class="navbar-inner" id="head-nav">
 	    </div>
 	</div>
-	<script src="js/jquery-3.2.1.js"></script>
+	<script src="js/jquery-3.6.0.js"></script>
 	<script>
 	 // get head-nav and foot-nav with jquery (get is async)
 	 $.get('header-content.html', function(data) {
@@ -46,14 +46,12 @@
     <body>
 	<div id="pjax-content">
 	    <!-- END REPEAT-->
-
 	    <!-- sb: this allows FB to reload when user returns to home page
 		 it is very slow though...i think there is a better way but requires app id -->
 	    <div id="fb-root"></div>
 		<div class="marketing-byline pagination-centered">
 			<br/>
 			<i class="fa fa-heart-o fa-l donate"></i>
-
 			<h3>
 				<a href="./donate.html">Contribute today</a> to OpenWorm. <strong class="donate">Thank you!</strong>
 			</h3>