accessibility improvements

This commit is contained in:
Mark Eaton
2021-02-13 00:19:04 -05:00
parent 710047cddc
commit 4151c02dd1
2 changed files with 44 additions and 17 deletions
+29 -7
View File
@@ -10,7 +10,7 @@ body {
background-color: #bbb; background-color: #bbb;
border: none; border: none;
font-size: 1.4em; font-size: 1.4em;
color: black; color: #111;
margin-top: -15px; margin-top: -15px;
margin-bottom: 28px; margin-bottom: 28px;
border-radius: 0px; border-radius: 0px;
@@ -18,7 +18,7 @@ body {
.navbar-default .navbar-nav>li>a { .navbar-default .navbar-nav>li>a {
color: black; color: #111;
} }
.faux-card { .faux-card {
@@ -40,15 +40,24 @@ body {
/* style for nav by the jumbotron */ /* style for nav by the jumbotron */
.nav-by-jumbotron { .nav-by-jumbotron {
margin-top: -4px; margin-top: -6px;
} }
.nav-divs-by-jumbotron { .nav-divs-by-jumbotron {
background-color: #bbb; background-color: #bbb;
margin: 4px 0px;
padding: 8px;
font-size: 1.5em;
text-align: center; text-align: center;
padding: 8px;
margin: 6px 0px;
}
.nav-divs-by-jumbotron>h2 {
font-size: 1.5em;
margin-bottom: 4px;
margin-top: 4px;
}
.nav-divs-by-jumbotron:hover {
background-color: #ddd;
} }
/* style the panels with the text content */ /* style the panels with the text content */
@@ -71,6 +80,11 @@ body {
font-size: 2em; font-size: 2em;
} }
.content-panel-title>h2 {
margin: 7px 0px;
font-size: 1em;
}
.panel-heading { .panel-heading {
padding: 2px; padding: 2px;
} }
@@ -142,6 +156,10 @@ img {
margin-right: 50px; margin-right: 50px;
} }
.yamm-item {
min-height: 100px;
}
/*! /*!
* Yamm!3 - Yet another megamenu for Bootstrap 3 * Yamm!3 - Yet another megamenu for Bootstrap 3
* http://geedmo.github.com/yamm3 * http://geedmo.github.com/yamm3
@@ -185,7 +203,7 @@ window.onload = function () {
if (targetDate.getFullYear() === today.getFullYear() && if (targetDate.getFullYear() === today.getFullYear() &&
targetDate.getMonth() === today.getMonth() && targetDate.getMonth() === today.getMonth() &&
targetDate.getDate() === today.getDate()) { targetDate.getDate() === today.getDate()) {
document.getElementById('hours0').innerHTML = "<p><span style='color:red;'>Today</span><br />" + targetDate.toLocaleDateString("en-US", options_date) + "</p><p>" + h[i]["Hours"] + "</p>" document.getElementById('hours0').innerHTML = "<p><strong>Today</strong><br />" + targetDate.toLocaleDateString("en-US", options_date) + "</p><p>" + h[i]["Hours"] + "</p>"
var start = true; var start = true;
var count = 1; var count = 1;
} else if (start === true && count < 5 && h[i]["Hours"] === "Closed" ) { } else if (start === true && count < 5 && h[i]["Hours"] === "Closed" ) {
@@ -198,3 +216,7 @@ window.onload = function () {
}; };
}; };
</script> </script>
<!-- Load bootstrap accessibility libraries (https://github.com/paypal/bootstrap-accessibility-plugin) -->
<link rel="stylesheet" type="text/css" href="//libapps.s3.amazonaws.com/sites/2365/include/bootstrap-accessibility.min.css">
<script type="text/javascript" src="//libapps.s3.amazonaws.com/sites/2365/include/bootstrap-accessibility.min.js"></script>
+13 -8
View File
@@ -158,6 +158,11 @@
<strong>Campus Map</strong> <strong>Campus Map</strong>
<p class="faux-card">How to find us</p> <p class="faux-card">How to find us</p>
</div> </div>
<div class="col-xs-12">
<span class="glyphicon glyphicon-time"></span>
<strong>Hours</strong>
<p class="faux-card">See the library's opening hours</p>
</div>
</div> </div>
</div> </div>
</li> </li>
@@ -179,10 +184,10 @@
</div> </div>
<div class="col-sm-4"> <div class="col-sm-4">
<div class="nav-by-jumbotron"> <div class="nav-by-jumbotron">
<div class="nav-divs-by-jumbotron">Databases</div> <div class="nav-divs-by-jumbotron"><h2>Databases</h2></div>
<div class="nav-divs-by-jumbotron">Ask a Librarian</div> <div class="nav-divs-by-jumbotron"><h2>Ask a Librarian</h2></div>
<div class="nav-divs-by-jumbotron">Research Consultations</div> <div class="nav-divs-by-jumbotron"><h2>Research Consultations</h2></div>
<div class="nav-divs-by-jumbotron">Research Guides</div> <div class="nav-divs-by-jumbotron"><h2>Research Guides</h2></div>
</ul> </ul>
</div> </div>
</div> </div>
@@ -191,7 +196,7 @@
<div class="col-md-7 col-lg-6"> <div class="col-md-7 col-lg-6">
<div class="panel panel-default hide-body-border"> <div class="panel panel-default hide-body-border">
<div class="panel-heading show-panel"> <div class="panel-heading show-panel">
<span class="panel-title content-panel-title">A list of links</span> <span class="panel-title content-panel-title"><h2>A list of links</h2></span>
</div> </div>
<div class="panel-body"> <div class="panel-body">
<div class="row"> <div class="row">
@@ -216,7 +221,7 @@
</div> </div>
<div class="panel panel-default hide-body-border"> <div class="panel panel-default hide-body-border">
<div class="panel-heading show-panel"> <div class="panel-heading show-panel">
<span class="panel-title content-panel-title">Upcoming Library Hours</span> <span class="panel-title content-panel-title"><h2>Upcoming Library Hours</h2></span>
</div> </div>
<div class="panel-body"> <div class="panel-body">
<div class="row equal"> <div class="row equal">
@@ -258,7 +263,7 @@
<div class="col-xs-3 col-sm-2 padding-0"> <div class="col-xs-3 col-sm-2 padding-0">
<div class="panel panel-default panel-outline-color"> <div class="panel panel-default panel-outline-color">
<div class="panel-body hours-panel-body vertical-align"> <div class="panel-body hours-panel-body vertical-align">
<div class="more-link"><a href="https://kbcc.cuny.libguides.com/calendar">More...</a>.</div> <div class="more-link"><a href="https://kbcc.cuny.libguides.com/calendar">More hours</a></div>
</div> </div>
</div> </div>
</div> </div>
@@ -269,7 +274,7 @@
<div class="col-md-5 col-lg-6"> <div class="col-md-5 col-lg-6">
<div class="panel panel-default hide-body-border"> <div class="panel panel-default hide-body-border">
<div class="panel-heading show-panel"> <div class="panel-heading show-panel">
<span class="panel-title content-panel-title">What's new in the library</span> <span class="panel-title content-panel-title"><h2>What's new in the library</h2></span>
</div> </div>
<div class="panel-body"> <div class="panel-body">
{{content_boxes}} {{content_boxes}}