handle logo at different screen sizes
This commit is contained in:
@@ -1,3 +1,8 @@
|
||||
<script
|
||||
type="text/javascript"
|
||||
src="https://use.fontawesome.com/releases/v5.15.3/js/conflict-detection.js">
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
body {
|
||||
@@ -9,7 +14,6 @@ body {
|
||||
#corona-alert {
|
||||
text-align: center;
|
||||
background-color: #faf870;
|
||||
margin: -50px 6px 0px 12px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
@@ -266,16 +270,20 @@ a.no-underline {
|
||||
@media only screen and (min-width: 992px) {
|
||||
#kb-cuny-logo {
|
||||
max-width: 30%;
|
||||
margin-top: 30px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
#library-logo {
|
||||
float: right;
|
||||
max-width: 60%;
|
||||
margin-top: -50px;
|
||||
margin-top: -70px;
|
||||
margin-right: -80px;
|
||||
}
|
||||
|
||||
#corona-alert {
|
||||
margin: -50px 6px 0px 12px;
|
||||
}
|
||||
|
||||
.form-width {
|
||||
width: 350px;
|
||||
}
|
||||
@@ -303,13 +311,17 @@ a.no-underline {
|
||||
|
||||
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
||||
#library-logo {
|
||||
text-align: center;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
#kb-cuny-logo {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
|
||||
#corona-alert {
|
||||
margin: -25px 6px 0px 12px;
|
||||
}
|
||||
|
||||
.form-width {
|
||||
width: 220px;
|
||||
}
|
||||
@@ -337,12 +349,16 @@ a.no-underline {
|
||||
|
||||
@media only screen and (max-width: 767px) {
|
||||
#library-logo {
|
||||
text-align: center;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
#kb-cuny-logo {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
#corona-alert {
|
||||
margin: -25px 6px 0px 12px;
|
||||
}
|
||||
|
||||
.form-width {
|
||||
width: 300px;
|
||||
@@ -379,7 +395,7 @@ a.no-underline {
|
||||
@media only screen and (min-width: 1200px) {
|
||||
#kb-cuny-logo {
|
||||
max-width: 30%;
|
||||
margin-top: 45px;
|
||||
margin-top: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user