A simple bootstrap template for an academic website with IIT-Dharwad color and typography.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

129 lines
6.6 KiB

<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<!-- meta http-equiv="refresh" content="10" -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Homepage of Jane Doe</title>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<link rel="stylesheet" href="iitdh_bootstrapColour.css">
<link href="https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Lato:wght@700&family=Open+Sans+Condensed:wght@700&display=swap" rel="stylesheet">
<style>
body
{ position: relative;}
</style>
</head>
<body data-spy="scroll" data-target=".navbar" data-offset="50">
<!-- Navigation -->
<!-- nav class="navbar fixed-top" -->
<nav class="navbar navbar-expand-sm navbar-custom fixed-top">
<a class="navbar-brand" href="./">
<span style="font-family: 'Open Sans Condensed', sans-serif;">
<!-- Optional Text field: You can add a name here-->
</span>
<img src="WebIcon.plain.svg" width="35" height="35" alt="">
</a>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="./">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./#">Link 1</a>
</li>
<li class="nav-item">
<a class="nav-link" href="./#">Link 2</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
More
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="#">
Action</a>
<a class="dropdown-item" href="#">
Another action</a>
<div class="dropdown-divider">
</div>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</li>
</ul>
</div>
</nav>
<div id="section1" class="container bs-docs-grid" style="padding-top:70px">
<!-- Control the column width, and how they should appear on different devices -->
<div class="row">
<div class="col-md-3">
<!-- Sidebar-->
<div class="row">
<div class="col-12">
<div class="text-justify" style="font-family: 'Open Sans Condensed', sans-serif;">
<h2>Dr. Jane Doe</h2>
</div>
<div class="text-center">
<img src="ProfileImage_600px.jpg" width="100%" class="rounded" alt="Abhijit Kshirsagar Photograph" longdesc="A photograph of Prof. Abhijit Kshirsagar">
</div>
<div class="text-left">
<div class="text-justify" style="font-family: 'Open Sans Condensed', sans-serif;">
<p> </p>
<h6>jane.doe at univ.ac.in</h6>
<p>
Professor of Quantum Computing<br>
Dept. of Quantum Engineering <br>
Fantastic University<br>
India
</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-9">
<!-- Main Content-->
<div class="row">
<div class="col-12">
<h3><a id="research"></a>About</h3>
<p class="text-justify">
Here is some sample text generated by a <a href="https://www.lipsum.com/feed/html">Lipsum generator</a>. It makes the text body seem more natural. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ut odio sed sapien congue maximus ac et elit. Nunc nibh orci, dictum in dolor nec, elementum varius tellus. Nulla facilisi. Donec cursus fermentum pulvinar. Praesent faucibus sem et neque ullamcorper vestibulum. Vivamus vitae leo vel leo pretium consequat vitae vel nisi.
</p>
<p class="text-justify">
Vivamus quis massa aliquam, accumsan urna sed, hendrerit dolor. Integer consequat tortor nec turpis elementum tincidunt. Vestibulum suscipit ultricies arcu, ac pharetra odio dictum at. Pellentesque et odio lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis ultrices blandit felis.
</p>
<h3><a id="research"></a>Research</h3>
<p class="text-justify">
Quisque a elit interdum, gravida erat a, maximus nisl. Nulla facilisi. Cras diam mauris, molestie id vulputate vitae, accumsan et lorem. Praesent aliquam ipsum orci, eget sodales mauris facilisis ac.Maecenas bibendum eleifend elit, ac commodo arcu elementum vel. Nullam vel sagittis justo, nec pretium urna. Nullam arcu orci, bibendum non aliquet sed, hendrerit at tellus. Vivamus dolor.
</p>
<h3><a id="teaching">Teaching</a></h3>
<p class="text-justify">
</p>
<h6>Spring 2020</h6>
<ul>
<li>EE101: Electrical Energy</li>
</ul>
<h6>Fall 2020</h6>
<ul>
<li>EE102: Magnetic Energy</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Other people may like it too! -->
<a style="color:#b5bec9;font-size:0.8em; float:right;" href="https://gitea.iitdh.ac.in/kabhijit/BootstrapHomepageTemplate" target="_blank">
kabhijit's BootstrapHomepageTemplate</a>
</body>
</html>