improve contrast, stacking on mobile

This commit is contained in:
Mark Eaton
2021-02-05 03:11:58 -05:00
parent c8350ef0e8
commit c0fb7c5a58
2 changed files with 36 additions and 21 deletions
+23 -8
View File
@@ -1,4 +1,9 @@
<style> <style>
body {
color: #111;
}
/* style navbar */ /* style navbar */
.navbar-default { .navbar-default {
@@ -28,6 +33,7 @@
border-radius: 0px !important; border-radius: 0px !important;
} }
/* style link list */
.link-list { .link-list {
font-size: 2em; font-size: 2em;
} }
@@ -90,22 +96,26 @@ img {
} }
.padding-0 { .padding-0 {
padding-left: 5px; padding-left: 4px;
padding-right: 5px; padding-right: 4px;
flex:1 1 auto; flex:1 1 auto;
display: flex; display: flex;
} }
.equal { .equal {
display: -webkit-box; display: -webkit-box;
display: -moz-box; display: -moz-box;
display: -ms-flexbox; display: -ms-flexbox;
display: -webkit-flex; display: -webkit-flex;
display: flex; display: flex;
} }
.panel { .panel {
flex:1 0 100%; flex:1 0 100%;
}
.panel-outline-color {
border: solid #555 1px;
} }
.vertical-align { .vertical-align {
@@ -114,6 +124,11 @@ img {
height: 100%; height: 100%;
} }
.more-link {
text-align: center;
width: 100%;
}
/* style the yamm menu */ /* style the yamm menu */
.dropdown-margin { .dropdown-margin {
margin-right: 50px; margin-right: 50px;
+13 -13
View File
@@ -138,45 +138,45 @@
</div> </div>
<div class="panel-body"> <div class="panel-body">
<div class="row equal"> <div class="row equal">
<div class="col-md-2 padding-0"> <div class="col-xs-3 col-sm-2 padding-0">
<div class="panel panel-default"> <div class="panel panel-default panel-outline-color">
<div class="panel-body hours-panel-body"> <div class="panel-body hours-panel-body">
<span id="hours0" class="hours"></span> <span id="hours0" class="hours"></span>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-2 padding-0"> <div class="col-xs-3 col-sm-2 padding-0">
<div class="panel panel-default"> <div class="panel panel-default panel-outline-color">
<div class="panel-body hours-panel-body"> <div class="panel-body hours-panel-body">
<span id="hours1" class="hours"></span> <span id="hours1" class="hours"></span>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-2 padding-0"> <div class="col-xs-3 col-sm-2 padding-0">
<div class="panel panel-default"> <div class="panel panel-default panel-outline-color">
<div class="panel-body hours-panel-body"> <div class="panel-body hours-panel-body">
<span id="hours2" class="hours"></span> <span id="hours2" class="hours"></span>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-2 padding-0"> <div class="col-sm-2 col hidden-xs padding-0">
<div class="panel panel-default"> <div class="panel panel-default panel-outline-color">
<div class="panel-body hours-panel-body"> <div class="panel-body hours-panel-body">
<span id="hours3" class="hours"></span> <span id="hours3" class="hours"></span>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-2 padding-0"> <div class="col-sm-2 hidden-xs padding-0">
<div class="panel panel-default"> <div class="panel panel-default panel-outline-color">
<div class="panel-body hours-panel-body"> <div class="panel-body hours-panel-body">
<span id="hours4" class="hours"></span> <span id="hours4" class="hours"></span>
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-2 padding-0"> <div class="col-xs-3 col-sm-2 padding-0">
<div class="panel panel-default"> <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><a href="https://kbcc.cuny.libguides.com/calendar">More...</a>.</div> <div class="more-link"><a href="https://kbcc.cuny.libguides.com/calendar">More...</a>.</div>
</div> </div>
</div> </div>
</div> </div>