Skip to content

Commit

Permalink
402 - Update footer to match library footer (#403)
Browse files Browse the repository at this point in the history
* Update footer to match library footer

* Modify when links are underlined
  • Loading branch information
Janell-Huyck authored Apr 2, 2024
1 parent dfdd0e8 commit 3914169
Show file tree
Hide file tree
Showing 2 changed files with 138 additions and 103 deletions.
70 changes: 66 additions & 4 deletions app/assets/stylesheets/application.scss
Original file line number Diff line number Diff line change
Expand Up @@ -64,23 +64,81 @@
color: red;
}

footer {
display: flex;
justify-content: center;
width: 100%;
}

.footer-top {
background-color: #e00122;
color: #fff;
font-size: 18px;
display: flex;
flex-direction: row;
justify-content: center;

@media (max-width: 768px) {
flex-direction: column;
}
}

.footer-top a,
.footer-top a:hover,
.footer-top a:active,
.footer-top a:visited {
color: white;
text-decoration: none;
}

.footer-top a:hover,
.footer-top a:active,{
color: white;
text-decoration: underline;
}

.contact {
flex-grow: 0;
min-width: 350px;
display: block;
font-size: 18px;
font-stretch: 100%;
padding: 40px;
background-color: #000;
}

.footer-links-container {
display: flex;
flex-direction: row;
flex-grow: 0;
padding: 40px;
@media (max-width: 995px) {
flex-direction: column;
}
}

.footer-links-group {
display: flex;
flex-direction: column;
flex-grow: 1;
padding: 0 40px;
}

.footer-column-group {
display: flex;
flex-direction: row;
@media (max-width: 995px) {
flex-direction: column;
}
}

.footer-links-column {
display: flex;
flex-direction: column;
flex-grow: 1;
margin-right: 40px;
min-width: 200px;
align-items: flex-start;
}

.footer-title {
font-size: 1.25rem;
margin: 0;
Expand All @@ -105,9 +163,13 @@
}

.footer-bottom a,
.footer-bottom a:hover,
.footer-bottom a:active,
.footer-bottom a:visited {
color: #000;
text-decoration: underline;
}

.footer-bottom a:hover,
.footer-bottom a:active,{
color: #000;
text-decoration: none;
}
Expand Down
171 changes: 72 additions & 99 deletions app/views/layouts/_footer.html.erb
Original file line number Diff line number Diff line change
@@ -1,106 +1,79 @@
<div class="container-fluid footer-top">
<div class="container">
<div class="row">
<div class="col contact footer-padding">
<p class="social-icons d-flex justify-content-around">

<a href="https://www.facebook.com/uclibraries/" target="_blank" aria-label="Facebook"><i
class="fab fa-facebook fa-2x" aria-hidden="true"></i></a>


<a href="http://twitter.com/uclibraries" target="_blank" aria-label="Twitter"><i
class="fab fa-twitter fa-2x" aria-hidden="true"></i></a>


<a href="https://www.instagram.com/uc_libraries" target="_blank" aria-label="Instagram"><i
class="fab fa-instagram fa-2x" aria-hidden="true"></i></a>


<a href="https://www.youtube.com/user/STRC1" target="_blank" aria-label="Youtube"><i
class="fab fa-youtube fa-2x" aria-hidden="true"></i></a>
</p>
<p>
University of Cincinnati Libraries
<br>PO Box 210033
<br>Cincinnati, Ohio
<br>45221-0033
<br> <a href="https://libraries.uc.edu/about/contact.html">Contact Us</a> | <a
href="https://libapps.libraries.uc.edu/main/contact/staff_directory.php">Staff
Directory</a>
</p>

</div>
<div class="col footer-padding">
<p class="footer-title"><strong>UC Tools</strong></p>
<ul class="list-unstyled">
<div class="row">
<div class="col thin-text">
<li><a href="https://canopy.uc.edu">Canopy &amp; Canvas</a></li>


<li><a href="https://onestop.uc.edu/">Enrollment Services</a></li>


<li><a href="https://mail.uc.edu">Email</a></li>


<li><a href="https://catalyst.uc.edu/">Catalyst</a></li>
</div>

<div class="col thin-text">

<li><a href="http://uc.transloc.com/routes">Shuttle Tracker</a></li>

<li><a href="https://www.uc.edu/about/ucit/help.html">IT Help</a></li>

<li><a href="https://vpn.uc.edu">UC VPN</a></li>

<li><a href="https://mailuc.sharepoint.com/sites/Intranet">Bearcats Landing</a></li>
</div>
</div>

</ul>

</div>
<div class="col footer-padding">
<p class="footer-title"><strong>About Us</strong></p>
<ul class="list-unstyled thin-text">
<li><a href="https://www.uc.edu/visitors.html">Maps &amp; Directions</a></li>

<li><a href="https://www.uc.edu/careers.html">Jobs</a></li>

<li><a href="https://uc.edu/news">News</a></li>

<li><a href="https://www.uc.edu/inclusion.html">Diversity</a></li>

<li><a href="http://www.uc.edu/about/policies.html">Governance &amp; Policies</a></li>

<li><a href="https://ucdirectory.uc.edu">Directory</a></li>

<li><a href="https://uc.edu/calendar">Events Calendar</a></li>
</ul>

</div>
<div class="col contact thin-text">
<p class="social-icons d-flex justify-content-around">

<a href="https://www.facebook.com/uclibraries/" target="_blank" aria-label="Facebook"><i
class="fab fa-facebook fa-2x" aria-hidden="true"></i></a>

<a href="http://twitter.com/uclibraries" target="_blank" aria-label="Twitter"><i
class="fab fa-twitter fa-2x" aria-hidden="true" style="color: white;"></i></a>

<a href="https://www.instagram.com/uc_libraries" target="_blank" aria-label="Instagram"><i
class="fab fa-instagram fa-2x" aria-hidden="true"></i></a>

<a href="https://www.youtube.com/user/STRC1" target="_blank" aria-label="Youtube"><i
class="fab fa-youtube fa-2x" aria-hidden="true"></i></a>
</p>
<p>
University of Cincinnati Libraries
<br>PO Box 210033
<br>Cincinnati, Ohio
<br>45221-0033
<br> <a href="https://libraries.uc.edu/about/contact.html">Contact Us</a> | <a
href="https://libapps.libraries.uc.edu/main/contact/staff_directory.php">Staff
Directory</a>
</p>
</div>
<div class="footer-links-container">
<div class="col footer-links-group footer-padding">
<p class="footer-title"><strong>UC Tools</strong></p>
<div class="footer-column-group">
<div class="footer-links-column thin-text">
<a href="https://canopy.uc.edu">Canopy &amp; Canvas</a>
<a href="https://onestop.uc.edu/">Enrollment Services</a>
<a href="https://mail.uc.edu">Email</a>
<a href="https://catalyst.uc.edu/">Catalyst</a>
<a href="https://bearcatportal.uc.edu/">Bearcat Portal</a>
</div>
<div class="footer-links-column thin-text">
<a href="http://uc.transloc.com/routes">Shuttle Tracker</a>
<a href="https://www.uc.edu/about/ucit/help.html">IT Help</a>
<a href="https://vpn.uc.edu">UC VPN</a>
<a href="https://mailuc.sharepoint.com/sites/Intranet">Bearcats Landing</a>
</div>
</div>
</div>
<div class="col footer-links-group thin-text footer-padding">
<p class="footer-title"><strong>About Us</strong></p>
<div class="footer-links-column">
<a href="https://www.uc.edu/visitors.html">Maps &amp; Directions</a>
<a href="https://www.uc.edu/careers.html">Jobs</a>
<a href="https://uc.edu/news">News</a>
<a href="https://www.uc.edu/inclusion.html">Diversity</a>
<a href="http://www.uc.edu/about/policies.html">Governance &amp; Policies</a>
<a href="https://ucdirectory.uc.edu">Directory</a>
<a href="https://uc.edu/calendar">Events Calendar</a>
</div>
</div>
</div>
</div>
<div class="footer-bottom">
<div class="container">
<div class="row">
<div class="col-lg-12">
<p><strong>University of Cincinnati</strong> | 2600 Clifton Ave. | Cincinnati, OH 45221 | ph:
513-556-6000</p>
<p>
<a href="https://www.uc.edu/alert.html">Alerts</a> |
<a href="https://www.uc.edu/about/publicsafety/clery/annual-security-report.html">Clery and HEOA Notice</a> |
<a href="https://www.uc.edu/about/non-discrimination.html">Notice of Non-Discrimination</a> |
<a href="https://www.uc.edu/about/ucit/about/accessibility/eaccessibility-form.html">eAccessibility Concern</a> |
<a href="https://www.uc.edu/about/privacy.html">Privacy Statement</a> |
<a href="https://www.uc.edu/freespeech.html">Free Speech</a> |
<a href="https://www.uc.edu/about/ucit/about/copyright.html">Copyright Information</a>
</p>
<p>&copy; 2023 University of Cincinnati</p>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-lg-12">
<p><strong>University of Cincinnati</strong> | 2600 Clifton Ave. | Cincinnati, OH 45221 | ph:
513-556-6000</p>
<p>
<a href="https://www.uc.edu/alert.html">Alerts</a> |
<a href="https://www.uc.edu/about/publicsafety/clery/annual-security-report.html">Clery and HEOA Notice</a> |
<a href="https://www.uc.edu/about/non-discrimination.html">Notice of Non-Discrimination</a> |
<a href="https://www.uc.edu/about/ucit/about/accessibility/eaccessibility-form.html">eAccessibility Concern</a> |
<a href="https://www.uc.edu/about/privacy.html">Privacy Statement</a> |
<a href="https://www.uc.edu/freespeech.html">Free Speech</a> |
<a href="https://www.uc.edu/about/ucit/about/copyright.html">Copyright Information</a>
</p>
<p>&copy; 2024 University of Cincinnati</p>
</div>
</div>
</div>
</div>

0 comments on commit 3914169

Please sign in to comment.