Base template with one page

This commit is contained in:
Abhijit Kshirsagar 2020-06-12 16:20:43 +05:30
parent 47c94d0474
commit 4bdcfc43e0
6 changed files with 233 additions and 2 deletions

2
README
View File

@ -1,2 +0,0 @@
A simple Bootstrap theme template for an academic webpage, themed with IIT
Dharwad colours and typography.

8
README.md Normal file
View File

@ -0,0 +1,8 @@
# BootstrapHomepageTemplate
A simple Bootstrap theme template for an academic webpage, themed with IIT
Dharwad colours and typography.
Bootstrap is a simple Javascript Library that enables lightweight yet responsive pages that look and feel great on all devices, from small mobile phones to tablets to large desktop displays.
To edit, I recomment the open-source editor "Brackets" which has a "live-preview" mode, showing the changes as the HTML code is modified.

BIN
site/ProfileImage_600px.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

75
site/WebIcon.plain.svg Normal file
View File

@ -0,0 +1,75 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="svg1709"
version="1.1"
viewBox="0 0 10 10"
height="10mm"
width="10mm">
<defs
id="defs1703" />
<metadata
id="metadata1706">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
transform="translate(-329.69791,-200.71875)"
id="layer1">
<path
d="m 334.63035,208.70974 c 0,0 -2.50979,-1.73328 -4.72168,-0.76849 0,0 2.37782,-0.6532 4.72168,1.49853 2.34375,-2.15173 4.85677,-1.49853 4.85677,-1.49853 -2.47761,-1.03639 -4.85677,0.76849 -4.85677,0.76849"
style="display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#000000;stroke-width:0.03699802;stroke-opacity:1"
id="path3733-5-7-7-7" />
<path
d="m 334.35432,208.29394 c 0,0 -1.72481,-1.28083 -3.96205,-0.78557 l -0.63185,-0.7514 c 0,0 2.80071,-0.25617 4.5939,1.53697"
style="display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#000000;stroke-width:0.03699802;stroke-opacity:1"
id="path3737-4-5-1-5" />
<path
d="m 334.39124,208.18736 c 0,0 -1.23618,-1.62059 -3.52758,-1.616 l -0.63052,-0.86934 c 0,0 2.79062,0.34967 4.1581,2.48534"
style="display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#000000;stroke-width:0.03699802;stroke-opacity:1"
id="path3741-1-6-5-3" />
<path
d="m 335.04145,208.29394 c 0,0 1.72488,-1.28083 3.96204,-0.78557 l 0.63193,-0.7514 c 0,0 -2.80079,-0.25617 -4.59397,1.53697"
style="display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#000000;stroke-width:0.03699802;stroke-opacity:1"
id="path3745-5-54-8-5" />
<path
d="m 335.00453,208.18736 c 0,0 1.23625,-1.62059 3.52761,-1.616 l 0.63056,-0.86934 c 0,0 -2.79069,0.34967 -4.15817,2.48534"
style="display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#000000;stroke-width:0.03699802;stroke-opacity:1"
id="path3749-5-2-8-6" />
<path
d="m 336.88228,204.10817 c 0.11055,-0.44013 0.14663,-0.91792 0.10304,-1.41115 -0.49325,0.14726 -0.93912,0.36828 -1.31676,0.64862 0.10312,0.3362 0.15769,0.67728 0.16002,1.01437 0.32828,-0.13523 0.68328,-0.21921 1.0537,-0.25184"
style="display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#000000;stroke-width:0.03699802;stroke-opacity:1"
id="path3753-4-21-4-2" />
<path
d="m 335.31334,206.17102 c -0.12328,0.025 -0.23716,0.0363 -0.33594,0.0402 0.0704,0.0385 0.15195,0.0773 0.24344,0.1114 0.44664,0.16664 0.90616,0.14903 1.36597,-0.0522 0.74529,-0.32636 1.38683,-0.96309 1.81557,-1.7994 -0.45834,-0.12775 -0.91615,-0.18059 -1.35317,-0.15935 -0.1063,0.36177 -0.26187,0.69771 -0.46429,0.99584 -0.39388,0.58043 -0.90889,0.78991 -1.27158,0.86346"
style="display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#000000;stroke-width:0.03699802;stroke-opacity:1"
id="path3757-9-72-5-9" />
<path
d="m 333.7209,203.34089 c -0.37627,-0.27808 -0.81987,-0.49744 -1.31032,-0.64384 -0.0436,0.49322 -0.007,0.97098 0.10304,1.41114 0.36746,0.0323 0.7198,0.11518 1.04586,0.24852 0.003,-0.33761 0.0577,-0.67921 0.16142,-1.01582"
style="display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#000000;stroke-width:0.03699802;stroke-opacity:1"
id="path3761-8-41-6-1" />
<path
d="m 332.81091,205.30757 c -0.20242,-0.29817 -0.35792,-0.63404 -0.46421,-0.9958 -0.43702,-0.0212 -0.8948,0.0316 -1.35321,0.15931 0.42877,0.8363 1.07036,1.47311 1.81561,1.79936 0.45973,0.20127 0.91932,0.21884 1.36596,0.0522 0.0915,-0.0341 0.17301,-0.0729 0.24345,-0.11141 -0.0989,-0.004 -0.21266,-0.0152 -0.33598,-0.0402 -0.36265,-0.0736 -0.87767,-0.28304 -1.27162,-0.86346"
style="display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#000000;stroke-width:0.03699802;stroke-opacity:1"
id="path3765-3-65-5-2" />
<path
d="m 334.68892,204.0329 c 0.003,0.005 0.006,0.009 0.009,0.0137 0.003,-0.005 0.006,-0.009 0.009,-0.0137 0.19235,-0.2834 0.4321,-0.54002 0.71036,-0.76426 -0.15505,-0.4422 -0.39924,-0.87367 -0.72334,-1.27096 -0.32296,0.39577 -0.56652,0.82554 -0.72173,1.26604 0.28097,0.22546 0.52282,0.48367 0.71662,0.76918"
style="display:inline;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#000000;stroke-width:0.03699802;stroke-opacity:1"
id="path3769-8-7-6-7" />
<path
d="m 335.43163,205.42098 c 0.004,0.4052 -0.32218,0.73652 -0.72738,0.73996 -0.40524,0.003 -0.73649,-0.32218 -0.74004,-0.72742 -0.003,-0.40516 0.32225,-0.73648 0.72742,-0.73996 0.4052,-0.003 0.73652,0.32218 0.74,0.72742"
style="display:inline;fill:#ffad4a;fill-opacity:1;fill-rule:nonzero;stroke:#000000;stroke-width:0.03699802;stroke-opacity:1"
id="path3773-5-85-8-0" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 5.1 KiB

View File

@ -0,0 +1,21 @@
.navbar-custom {
/* Jamun*/
background-color: #6c1b85;
}
/* change the brand and text color */
.navbar-custom .navbar-brand,
.navbar-custom .navbar-text {
color: rgba(255,255,255,1);
}
/* change the link color */
.navbar-custom .navbar-nav .nav-link {
color: rgba(255,255,255,1);
}
/* change the color of active or hovered links */
.navbar-custom .nav-item.active .nav-link,
.navbar-custom .nav-item:hover .nav-link {
/*Marigold*/
color: #ffad4a;
}

129
site/index.html Normal file
View File

@ -0,0 +1,129 @@
<!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>