add provisional header image and library name

This commit is contained in:
Mark Eaton
2021-03-30 15:44:04 -04:00
parent 22608c7aaf
commit 47688eaa49
2 changed files with 53 additions and 8 deletions
+47 -3
View File
@@ -9,7 +9,7 @@ body {
#corona-alert { #corona-alert {
text-align: center; text-align: center;
background-color: #faf870; background-color: #faf870;
margin-bottom: -10px; margin: 0px 5px 0px 10px;
padding: 5px; padding: 5px;
} }
@@ -18,13 +18,19 @@ body {
font-size: 1.5em; font-size: 1.5em;
} }
#library-name-header {
font-size: 4em;
color: #003466;
margin-top: 20px;
}
/* style background image */ /* style background image */
.kbcc-background-image { .kbcc-background-image {
background: linear-gradient(to bottom, rgba(255,255,255,0.4) 0%,rgba(255,255,255,0.4) 100%), url("https://www1.kingsborough.edu/photo_album/kcc_campus_06/images/KG_Kibbee_3_jpg.jpg"); background: linear-gradient(to bottom, rgba(255,255,255,0.4) 0%,rgba(255,255,255,0.4) 100%), url("https://www1.kingsborough.edu/photo_album/kcc_campus_06/images/KG_Kibbee_3_jpg.jpg");
padding: 20px 0px; padding: 20px 0px;
border-radius: 5px; border-radius: 5px;
background-size: cover; background-size: cover;
margin: 0px 0px 30px 0px; margin: -30px 0px 30px 0px;
} }
/* style navbar */ /* style navbar */
@@ -34,7 +40,7 @@ body {
border: none; border: none;
font-size: 1.4em; font-size: 1.4em;
color: #111; color: #111;
margin-top: -15px; margin-top: 20px;
border-radius: 0px; border-radius: 0px;
} }
@@ -257,21 +263,33 @@ a.no-underline {
/* media queries */ /* media queries */
@media only screen and (min-width: 992px) { @media only screen and (min-width: 992px) {
#kb-cuny-logo {
max-width: 40%;
}
#library-name-header {
float: right;
}
.form-width { .form-width {
width: 350px; width: 350px;
} }
#lighthouse-logo { #lighthouse-logo {
display: inline-block; display: inline-block;
} }
.library-address { .library-address {
display: inline-block; display: inline-block;
margin: 0px 30px; margin: 0px 30px;
font-size: 1.1em; font-size: 1.1em;
vertical-align: -50px; vertical-align: -50px;
} }
#cuny-logo { #cuny-logo {
float: right; float: right;
} }
.libapps { .libapps {
float: right; float: right;
clear: right; clear: right;
@@ -279,21 +297,33 @@ a.no-underline {
} }
@media only screen and (min-width: 768px) and (max-width: 991px) { @media only screen and (min-width: 768px) and (max-width: 991px) {
#kb-cuny-logo {
max-width: 100%;
}
#library-name-header {
float: left;
}
.form-width { .form-width {
width: 220px; width: 220px;
} }
#lighthouse-logo { #lighthouse-logo {
display: inline-block; display: inline-block;
} }
.library-address { .library-address {
display: inline-block; display: inline-block;
margin: 0px 30px; margin: 0px 30px;
font-size: 1.1em; font-size: 1.1em;
vertical-align: -50px; vertical-align: -50px;
} }
#cuny-logo { #cuny-logo {
float: right; float: right;
} }
.libapps { .libapps {
float: right; float: right;
clear: right; clear: right;
@@ -301,26 +331,40 @@ a.no-underline {
} }
@media only screen and (max-width: 767px) { @media only screen and (max-width: 767px) {
#kb-cuny-logo {
max-width: 100%;
}
#library-name-header {
float: left;
}
.form-width { .form-width {
width: 300px; width: 300px;
} }
.zero-margin { .zero-margin {
margin: 7px auto; margin: 7px auto;
} }
.nav-by-jumbotron { .nav-by-jumbotron {
margin-top: 40px !important; margin-top: 40px !important;
} }
#main-blue-footer { #main-blue-footer {
min-height: 450px; min-height: 450px;
} }
.library-address { .library-address {
float: left; float: left;
} }
#cuny-logo { #cuny-logo {
float: left; float: left;
clear: both; clear: both;
margin-top: 10px; margin-top: 10px;
} }
.libapps { .libapps {
float: left; float: left;
clear: left; clear: left;
@@ -1,7 +1,7 @@
<body class="s-lib-public-body"> <body class="s-lib-public-body">
<!-- BEGIN: content --> <!-- BEGIN: content -->
<div id="s-lib-public-main" class="s-lib-main container-fluid s-lib-side-borders"> <div id="s-lib-public-main" class="s-lib-main container s-lib-side-borders">
<div id="s-lg-index-cols" class="row container-fluid"> <div id="s-lg-index-cols" class="row container>
<div class="row"> <div class="row">
<div class="col-xs-12"> <div class="col-xs-12">
<div id="corona-alert"> <div id="corona-alert">
@@ -10,8 +10,9 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-xs-12"> <div class="col-xs-12" style="padding: 30px 30px;">
{{public_header}} <img id="kb-cuny-logo" src="https://libapps.s3.amazonaws.com/accounts/16298/images/kbcc-logo-CUNY.png">
<div id="library-name-header">Robert J. Kibbee Library</div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">