Skip to content
This repository has been archived by the owner on Apr 15, 2022. It is now read-only.

Commit

Permalink
Update image banner and work on #1
Browse files Browse the repository at this point in the history
  • Loading branch information
@mikojimnz
mikojimnz committed Oct 30, 2021
1 parent 205326c commit 124a942
Show file tree
Hide file tree
Showing 6 changed files with 114 additions and 37 deletions.
62 changes: 46 additions & 16 deletions app/home.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,11 +19,11 @@
<header>
<div class="banner-top">
<nav class="row navbar navbar-toggleable-lg navbar-inverse bg-inverse bg-faded">
<div class="col col-3"></div>
<div class="col col-6 text-center">
<div class="col col-2"></div>
<div class="col col-8 text-center">
<a class="btn" href="home.html"><h6 class="text-uppercase banner-logo-text" role="button">UCF Downtown</h6></a>
</div>
<div class="col col-3">
<div class="col col-2">
<button class="navbar-toggler collapsed float-right" type="button" data-toggle="collapse" data-target="#settingsNav" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
Expand All @@ -32,15 +32,21 @@
<div class="collapse navbar-collapse" id="settingsNav">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="#">Profile</a>
<a class="nav-link" href="#"><i class="fas fa-user pr-2"></i></span>Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Favorites</a>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownFavorites" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fas fa-star pr-2"></i>Favorites</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdownFavorites">
<a class="dropdown-item" href="#">myUCF</a>
<a class="dropdown-item" href="#">Kinghts Email</a>
<a class="dropdown-item" href="#">Grades</a>
<a class="dropdown-item" href="#">Dining</a>
<a class="dropdown-item" href="#">Parking</a>
<a class="dropdown-item" href="#">News</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownSettings" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Settings
</a>
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownSettings" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fas fa-wrench pr-2"></i> Settings</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdownSettings">
<a class="dropdown-item" href="#">Edit Favorites</a>
<a class="dropdown-item" href="#">Change Campus</a>
Expand All @@ -56,20 +62,44 @@
<div class="media-background-container">
<img class="media-background object-fit-cover" src="../img/ucf-downtown.jpg" alt="">
<div class="row banner-bottom">
<div class="col col-3"><img src="../img/TheTab_sm.png" alt="" class="banner-logo"></div>
<div class="col col-9">
<div class="col col-4"><img src="../img/TheTab_sm.png" alt="" class="banner-logo"></div>
<div class="col col-8">
<h1 class="banner-title">Amanda</h1>
<h5 class="banner-subtitle">UCF Downtown</h5>
</div>
</div>
</div>
</header>

<div class="container content">
<div class="row pt-5">
<div class="col">
<h1 class="heading-underline">Home</h1>
<div class="container">

<div class="row">
<div class="alert alert-warning alert-dismissible fade show w-100" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
<h2>Traffic Reported</h2>
<h5>47 Minute Commute</h5>
<br>
<button class="btn btn-secondary btn-sm">Learn More</button>
</div>
<div class="alert alert-info alert-dismissible fade show w-100" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
<h2>Widthdraw Deadline Approaching</h2>
<h5>October 29</h5>
</div>
</div>

<div class="row">
<div class="col col-12 p-3"><h1 class="heading-underline">Favorites</h1></div>
<div class="col col-6 text-center"><span class="dot"><i class="fas fa-book fa-4x"></i></span><p>myUCF</p></div>
<div class="col col-6 text-center"><span class="dot"><i class="fas fa-mail-bulk fa-4x"></i></span><p>Knights Email</p></div>
<div class="col col-6 text-center"><span class="dot"><i class="fas fa-calculator fa-4x"></i></span><p>Grades</p></div>
<div class="col col-6 text-center"><span class="dot"><i class="fas fa-utensil-spoon fa-4x"></i></span><p>Dining</p></div>
<div class="col col-6 text-center"><span class="dot"><i class="fas fa-car fa-4x"></i></span><p>Parking</p></div>
<div class="col col-6 text-center"><span class="dot"><i class="fas fa-newspaper fa-4x"></i></span><p>News</p></div>
</div>
</div>

Expand All @@ -82,7 +112,7 @@ <h1 class="heading-underline">Home</h1>
<a class="nav-link" href="#"><i class="fas fa-bus fa-2x"></i></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><i class="fas fa-map fa-2x"></i></a>
<a class="nav-link" href="#"><i class="fas fa-map-marked fa-2x"></i></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><i class="fas fa-calendar-alt fa-2x"></i></a>
Expand Down
2 changes: 1 addition & 1 deletion app/login.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@
</div>
</header>

<div class="container content">
<div class="container">
<div class="row pt-5">
<div class="col">
<h1 class="heading-underline">Login</h1>
Expand Down
8 changes: 4 additions & 4 deletions app/reset.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,11 +18,11 @@
<header>
<div class="banner-top">
<nav class="row navbar navbar-toggleable-lg navbar-inverse bg-inverse bg-faded">
<div class="col col-3"><button onclick="window.history.go(-1); return false;" class="btn btn-link btn-sm back"><i class="fas fa-chevron-left fa-2x"></i></button></div>
<div class="col col-6 text-center">
<div class="col col-2"><button onclick="window.history.go(-1); return false;" class="btn btn-link btn-sm back"><i class="fas fa-chevron-left fa-2x"></i></button></div>
<div class="col col-8 text-center">
<a class="btn" href="login.html"><h6 class="text-uppercase banner-logo-text" role="button">UCF Downtown</h6></a>
</div>
<div class="col col-3"></div>
<div class="col col-2"></div>
</nav>
</div>

Expand All @@ -34,7 +34,7 @@
</div>
</header>

<div class="container content">
<div class="container">
<div class="row pt-5">
<div class="col">
<h1 class="heading-underline">Reset Password</h1>
Expand Down
37 changes: 29 additions & 8 deletions css/styles.css
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion css/styles.css.map
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

40 changes: 33 additions & 7 deletions css/styles.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,30 @@
color: #ffffff;
}

.content {
padding-top: 210px;
.container {
padding-bottom: 85px;
}

.dot {
height: 125px;
width: 125px;
border: 3px solid $brightGold;
border-radius: 50%;
display: inline-block;
}

.dot:hover {
background-color: $brightGold;
}

.dot > i {
color: black;
position: relative;
top: 32px;
}

.dot:hover > i {
color: white;
}

.notch-padding {
Expand All @@ -23,17 +45,17 @@
header {
background-color: black;
color: white;

position: fixed;
top: 0;
width: 100%;
z-index: 998;
}

.banner-top {
padding-top: 35px;
background-color: black;
min-height: 65px;

position: fixed;
top: 0;
width: 100%;
z-index: 998;
}

.banner-bottom {
Expand Down Expand Up @@ -63,6 +85,10 @@ header {
filter: brightness(50%);
}

.media-background-container {
padding-top: 90px;
}

.navbar-toggler {
margin-left: auto;
padding-top: 0;
Expand Down

0 comments on commit 124a942

Please sign in to comment.