Skip to content

Commit

Permalink
Detailed Homepage Creation
Browse files Browse the repository at this point in the history
Quick Links section added to homPage.
  • Loading branch information
vishnurchityala committed May 17, 2024
1 parent 71b2f34 commit e220c01
Show file tree
Hide file tree
Showing 3 changed files with 109 additions and 20 deletions.
45 changes: 40 additions & 5 deletions css/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -7,24 +7,59 @@ html,body{
height: 100%;
font-family: 'Ubuntu', sans-serif;
}
.bg-color-slate
a{
text-decoration: none;
color:#494953 ;
}
h5
{
color:#494953;
}
.bg-red
{
background-color: #FF5656 !important;
}
.bg-slate
{
background-color: #EDF2F6 !important;
}
.bg-blue
{
background-color: #EDF2F6;
background-color: #6A7EFC !important;
}
.bg-green

{

background-color: #77D970 !important;
}
.mynav li a {
color: #fff;
color:#494953;
text-decoration: none;
width: 100%;
display: block;
border-radius: 5px;
padding: 8px 5px;
}

.mynav li a.active{
color: rgb(38, 38, 38);
color: rgb(0, 0, 0) !important;
font-weight: bold;
font-size: larger ;
}

.mynav li a i{
width: 25px;
text-align: center;
}

.link-card
{
width:23%;
}

@media (max-width: 500px) {
.link-card {
width: 100% !important;
margin-bottom: 1rem;
}
}
Binary file added images/buLogo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
84 changes: 69 additions & 15 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,39 +4,58 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bootstrap Sidebar 1</title>
<title>BU Notes</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KK94CHFLLe+nY2dmCWGMq91rCGa5gtU4mk92HdvYe+M/SXH301p5ILy+dN9+nJOZ" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500&display=swap" rel="stylesheet">
<link rel="stylesheet" href="./css/style.css">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ENjdO4Dr2bkBIFxQpeoTz1HIcje39Wm4jDKdf19U8gI4ddQ3GYNS7NTKfAdVQSZe" crossorigin="anonymous"></script>
<link rel="shortcut icon" href="/images/buLogo.png" type="image/x-icon">
</head>
<body>

<div class="container-fluid p-0 d-flex h-100">
<div id="bdSidebar" class=" d-flex flex-column p-3 text-dark offcanvas-md bg-warning offcanvas-start " style="width: 280px;">
<div id="bdSidebar" class="d-flex flex-column flex-shrink-0 p-3 text-dark bg-slate offcanvas-md offcanvas-start" style="width: 280px;">
<a href="#" class="navbar-brand">
<h4>BU Notes</h4>
<h4> <i class="fa-solid fa-book me-2"></i> BU Notes</h4>
</a>
<hr>
<ul class="mynav nav nav-pills flex-column mb-auto">
<li class="nav-item mb-1">
<a href="#" class="active">
<a href="" class="active">
<i class="fa-solid fa-house"></i>
Home
</a>
</li>
<li class="nav-item mb-1">
<a href="#" class="active">
<i class="fa-solid fa-info"></i>
<a href="">
<i class="fa-solid fa-graduation-cap" style="color: black;"></i>
1st Year
</a>
</li>
<li class="nav-item mb-1">
<a href="">
<i class="fa-brands fa-youtube" style="color: red;" ></i>
Videos
</a>
</li>
<li class="nav-item mb-1">
<a href="">
<i class="fa-solid fa-fire" style="color: rgb(255, 132, 0);"></i>
Miscellaneous
</a>
</li>
<li class="nav-item mb-1">
<a href="">
<i class="fa-solid fa-info" style="color: rgb(0, 0, 0);"></i>
About
</a>
</li>
<li class="nav-item mb-1">
<a href="#" class="active">
<i class="fa-regular fa-paper-plane"></i>
<a href="">
<i class="fa-regular fa-paper-plane" style="color: rgb(85, 159, 255);"></i>
Grievances
</a>
</li>
Expand All @@ -47,12 +66,19 @@ <h6 class="mt-1 mb-0">Arihant Gupta</h6>
<small>arihant@bennett.edu.in</small>
</span>
</div>
<hr>
<div class="d-flex">
<span>
<h6 class="mt-1 mb-0">Vishnu Chityala</h6>
<small>vishnu@bennett.edu.in</small>
</span>
</div>
</div>

<div class=" flex-fill">
<div class="p-2 d-md-none d-flex text-white bg-dark">
<a href="#" class="text-white" data-bs-toggle="offcanvas" data-bs-target="#bdSidebar">
<i class="fa-solid fa-bars"></i>
<div class="p-3 py-3 d-md-none d-flex text-white bg-dark">
<a href="" class="text-white" data-bs-toggle="offcanvas" data-bs-target="#bdSidebar">
<i class="fa-solid fa-bars" style="font-size: 25px;"></i>
</a>
<span class="ms-3">BU Notes</span>
</div>
Expand All @@ -61,10 +87,38 @@ <h6 class="mt-1 mb-0">Arihant Gupta</h6>
<h5><span><i class="fa-solid fa-house me-3"></i></span>Home page</h5>
</div>
<hr>
<div class="row">
<div class="col">
<p>Page content goes here</p>
</div>
<div class="pt-3">
<h5>Quick Links</h5>
<div class="d-md-flex px-10 py-3" style="justify-content: space-between;">
<a href="" class="px-3 py-4 bg-slate link-card rounded d-flex">
<i class="fa-solid fa-book p-3 bg-green rounded" style="font-size: 32px; color: #ffff;"></i>
<div class="ms-3">
<p style="font-size: 20px; line-height: 20px; font-weight: bold;">1st Year PYQ's</p>
<p style="font-size: 14px; line-height: 10px;">159 items</p>
</div>
</a>
<a href="" class="px-3 py-4 bg-slate link-card rounded d-flex">
<i class="fa-solid fa-brain p-3 bg-blue rounded" style="font-size: 32px; color: #ffff;"></i>
<div class="ms-3">
<p style="font-size: 20px; line-height: 20px; font-weight: bold;">Topper's Notes</p>
<p style="font-size: 14px; line-height: 10px;">159 items</p>
</div>
</a>
<a href="" class="px-3 py-4 bg-slate link-card rounded d-flex">
<i class="fa-brands fa-youtube p-3 bg-red rounded" style="font-size: 32px; color: #ffff;"></i>
<div class="ms-3">
<p style="font-size: 20px; line-height: 20px; font-weight: bold;">Video Lectures</p>
<p style="font-size: 14px; line-height: 10px;">159 items</p>
</div>
</a>
<a href="" class="px-3 py-4 bg-slate link-card rounded d-flex">
<i class="fa-solid fa-note-sticky p-3 bg-warning rounded" style="font-size: 32px; color: #ffff;"></i>
<div class="ms-3">
<p style="font-size: 20px; line-height: 20px; font-weight: bold;">Formula Sheets</p>
<p style="font-size: 14px; line-height: 10px;">159 items</p>
</div>
</a>
</div>
</div>
</div>

Expand Down

0 comments on commit e220c01

Please sign in to comment.