Update index html and css

prertik · prertik · commit 102cebc6dc07 · 2021-11-18T13:36:13.000+05:45
* Fix for navbar while on small device
* Add version of git for windows available
* Other minor UI fixes

Signed-off-by: Pratik Karki &lt;pratik@prertik.com&gt;
diff --git a/css/custom.css b/css/custom.css
@@ -1,5 +1,5 @@
 body {
-  padding-top: 56px;
+  padding-top: 5%;
 }
 
 section {
@@ -44,6 +44,7 @@ h4 {
 
 h1 {
   font-size: 2.5em;
+  text-align: center;
 }
 
 h1 span {
@@ -74,28 +75,36 @@ li.borderless {
   border-left: 0 none;
 }
 
-.copyright {
+.img-git-logo {
+  width: 40%;
+}
+
+.img-other-logos {
+  width: 90%
+}
+
+.footer {
   padding: 28px 0;
   margin-top: 55px;
   background-color: #202020;
 }
-.copyright span,
-.copyright a {
+.footer span,
+.footer a {
   color: #878787;
   -webkit-transition: all 0.3s linear;
   -o-transition: all 0.3s linear;
   transition: all 0.3s linear;
 }
-.copyright a:hover {
+.footer a:hover {
   color: #007bff;
 }
 
-.copyright-menu ul {
+.footer-menu ul {
   text-align: right;
   margin: 0;
 }
 
-.copyright-menu li {
+.footer-menu li {
   display: inline-block;
   padding-left: 20px;
 }
diff --git a/index.html b/index.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
 
-<head>
+  <head>
 	<meta charset="utf-8">
 	<meta http-equiv="X-UA-Compatible" content="IE=edge">
 	<title>Git for Windows</title>
@@ -18,9 +18,9 @@
 		<script src="js/html5shiv.js"></script>
 		<script src="js/respond.js"></script>
 		<![endif]-->
-</head>
+  </head>
 
-<body>
+  <body>
 	<!-- navbar -->
 	<nav class="navbar navbar-light navbar-expand-lg fixed-top shadow-sm bg-white">
 		<a href="index.html" class="navbar-brand">
@@ -63,11 +63,14 @@ <h2>We bring the awesome <span class="gittext">Git</span> SCM to Windows</h2>
 								target="_blank">Download</a>
 							<a class="btn btn-outline-primary shadow mr-2" href="#contribute">Contribute</a>
 						</p>
+						<p class="h2" id="version">
+							<a href="https://github.com/git-for-windows/git/releases/tag/v2.33.1.windows.1" title="Version 2.33.1 was published on Wed, 13 Oct 2021 23:42:20 UTC">
+								Version 2.33.1
+							</a>
+						</p>
 					</div>
 				</div>
-
 			</div>
-
 		</div>
 	</section>
 	<section>
@@ -78,21 +81,21 @@ <h2>Tools &amp; Features</h2>
 				providing appropriate user interfaces for experienced Git users and novices alike.</p>
 			<div class="row">
 				<div class="col-sm-6 col-lg-4 mb-3">
-					<img src="img/gw1web_thumb.png" alt="Git BASH">
+					<img src="img/gw1web_thumb.png" alt="Git BASH" class="img-other-logos">
 					<h3>Git BASH</h3>
 					<p>Git for Windows provides a BASH emulation used to run Git from the command line. *NIX users
 						should feel right at home, as the BASH emulation behaves just like the "git" command in LINUX
 						and UNIX environments.</p>
 				</div>
 				<div class="col-sm-6 col-lg-4 mb-3">
-					<img src="img/gw2web_thumb.png" alt="Git GUI">
+					<img src="img/gw2web_thumb.png" alt="Git GUI" class="img-other-logos">
 					<h3>Git GUI</h3>
 					<p>As Windows users commonly expect graphical user interfaces, Git for Windows also provides the Git
 						GUI, a powerful alternative to Git BASH, offering a graphical version of just about every Git
 						command line function, as well as comprehensive visual diff tools.</p>
 				</div>
 				<div class="col-sm-6 col-lg-4 mb-3">
-					<img src="img/gw3web_thumb.png" alt="Gitk: Exploring Commits">
+					<img src="img/gw3web_thumb.png" alt="Gitk: Exploring Commits" class="img-other-logos">
 					<h3>Shell Integration</h3>
 					<p>Simply right-click on a folder in Windows Explorer to access the BASH or GUI.</p>
 				</div>
@@ -116,7 +119,7 @@ <h3><a name="issues"></a>Bug Reports &amp; Feature Requests</h3>
 			<a class="btn btn-primary shadow mr-2" href="https://github.com/git-for-windows/git/issues"
 				target="_blank">Issue Tracker</a>
 			<br>
-			<img src="img/details_contribute.png" class="rounded float-left" alt="Git for Windows Logo">
+			<img src="img/details_contribute.png" class="rounded float-left img-git-logo" alt="Git for Windows Logo">
 			<h3><span class="gittext">Git for Windows SDK</span> : Contributing Code</h3>
 			<p>The <i>Git for Windows SDK</i> is a build environment that includes all the tools necessary for
 				developers who want to contribute by writing code for Git for Windows.</p>
@@ -130,20 +133,16 @@ <h3><span class="gittext">Git for Windows SDK</span> : Contributing Code</h3>
 					href=" https://github.com/git-for-windows/git-for-windows.github.io">Repository</a>.</p>
 		</div>
 	</section>
-
-	</div>
-	</div>
-
 	<footer id="dk-footer" class="dk-footer">
-		<div class="copyright">
+		<div class="footer">
 			<div class="container">
 				<div class="row">
 					<div class="col-md-6">
 						<span>Copyright © 2020 Johannes Schindelin and contributors. All rights reserved.</span>
 					</div>
 					<!-- End Col -->
 					<div class="col-md-6">
-						<div class="copyright-menu">
+						<div class="footer-menu">
 							<ul>
 								<li>
 									<a href="https://github.com/git-for-windows/git/releases/">All Releases</a>
@@ -158,13 +157,14 @@ <h3><span class="gittext">Git for Windows SDK</span> : Contributing Code</h3>
 							</ul>
 						</div>
 					</div>
-					<!-- End col -->
 				</div>
-				<!-- End Row -->
 			</div>
-			<!-- End Copyright Container -->
 		</div>
 	</footer>
+	<!-- JavaScript files-->
+	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.slim.min.js"></script>
+	<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.3/js/bootstrap.bundle.min.js"></script>
+	<script src="https://cdn.linearicons.com/free/1.0.0/svgembedder.min.js"></script>
 </body>
 
 </html>
