jules/DAAP_interface
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

adjusted style after feedback Lozana

Browse Source
This commit is contained in:
JoBCB 2020-11-12 11:48:37 +00:00
parent 9fe8159221
commit 9f4a9703ea
2 changed files with 42 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
static/css/style.css
View File

@ -123,9 +123,11 @@ div#animatedlogo img{
justify-self: center; justify-self: center;
} }
div#header-title{ div#header-title{
font-family: 'Roboto Condensed', sans-serif; font-family: 'Roboto Condensed Bold', sans-serif;
font-weight: bold; font-weight: bold;
font-size: 25px; font-size: 25px;
line-height: 35px;
letter-spacing: 1.88px;
} }
div#header-title a:link, div#header-title a:visited { div#header-title a:link, div#header-title a:visited {
text-decoration: none; text-decoration: none;
@ -194,9 +196,10 @@ div#navigation a{
text-decoration: none; text-decoration: none;
font-weight: normal; font-weight: normal;
color: var(--black); color: var(--black);
font-size: calc(16px + (20 - 16) * ((100vw - 768px) / (1400 - 768))); font-size: calc(14px + (18 - 14) * ((100vw - 768px) / (1400 - 768)));
line-height: calc(22px + (22 - 26) * ((100vw - 768px) / (1400 - 768))); line-height: 26px;
} /* line-height: calc(22px + (22 - 26) * ((100vw - 768px) / (1400 - 768)));
*/}
div#navigation a:hover { div#navigation a:hover {
text-decoration: underline; text-decoration: underline;
@ -250,7 +253,7 @@ div#footer{
div#footer-title-br p, div#footer-title-others p, div#footer-title-contact p, div#footer-title-socials p{ div#footer-title-br p, div#footer-title-others p, div#footer-title-contact p, div#footer-title-socials p{
text-transform: uppercase; text-transform: uppercase;
font-family: 'Roboto Condensed', sans-serif; font-family: 'Roboto Condensed', sans-serif;
font-size: calc(16px + (20 - 16) * ((100vw - 768px) / (1400 - 768))); font-size: calc(14px + (18 - 14) * ((100vw - 768px) / (1400 - 768)));
font-weight: normal; font-weight: normal;
font-stretch: condensed; font-stretch: condensed;
font-style: normal; font-style: normal;
@ -259,10 +262,21 @@ div#footer-title-br p, div#footer-title-others p, div#footer-title-contact p, di
color: var(--brown-grey); color: var(--brown-grey);
} }
div#footer-img-br img{ div#footer-img-br img{
width: 100%; width: 70px;
max-width: 90px;
height: auto; height: auto;
padding-top: 20px; padding-top: 20px;
margin-left: -8px;
}
div#footer-img-br figcaption{
font-family: 'Roboto', sans-serif;
font-size: 16px;
margin: 0;
padding: 0;
line-height: 26px;
font-style: normal;
font-weight: normal;
white-space: nowrap;
margin-top: -8px;
} }
div#footer-img-others{ div#footer-img-others{
display: flex; display: flex;
@ -274,20 +288,19 @@ div#footer-img-lottery{
padding-left: 60px; padding-left: 60px;
} }
div#footer-img-lottery img{ div#footer-img-lottery img{
width: 100%; width: 124px;
max-width: 124px;
height: auto; height: auto;
} }
div#footer-img-wiki img{ div#footer-img-wiki img{
width: 100%; width: 56px;
max-width: 56px;
height: auto; height: auto;
} }
div#footer-socials-links a{ div#footer-socials-links a{
text-decoration: none; text-decoration: none;
color:#FFFFFF; color:#FFFFFF;
font-family: 'Roboto Regular', sans-serif; font-family: 'Roboto Regular', sans-serif;
font-size: calc(16px + (20 - 16) * ((100vw - 768px) / (1400 - 768))); font-size: calc(14px + (18 - 14) * ((100vw - 768px) / (1400 - 768)));
line-height: 26px;
font-weight: normal; font-weight: normal;
font-stretch: normal; font-stretch: normal;
font-style: normal; font-style: normal;
@ -298,7 +311,7 @@ div#contactform{
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
#footer-contact a { #contactform span, a.footer-contact {
text-decoration: none; text-decoration: none;
color:#FFFFFF; color:#FFFFFF;
} }
@ -341,7 +354,7 @@ div#footer{ flex-wrap: wrap; }
div.pagetitle{ div.pagetitle{
margin: 60px 80px 30px 80px; margin: 60px 80px 30px 80px;
font-size: 25px; font-size: 25px;
font-family: 'Roboto Condensed', sans-serif; font-family: 'Roboto Condensed Bold', sans-serif;
font-weight: bold; font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 1.88px; letter-spacing: 1.88px;
@ -384,9 +397,9 @@ thead tr th{
} }
tbody tr th{ tbody tr th{
font-size: 18px; font-size: calc(14px + (18 - 14) * ((100vw - 768px) / (1400 - 768)));
line-height: 26px; line-height: 26px;
font-family: 'Roboto Condensed', sans-serif; font-family: 'Roboto', sans-serif;
font-weight: normal; font-weight: normal;
} }
@ -399,7 +412,9 @@ tbody tr th a{
min-width: 56px; min-width: 56px;
max-width: 128px; /*56px * 2 + 16*/ max-width: 128px; /*56px * 2 + 16*/
} }
.label { font-weight: bold; .label {
font-family: Roboto Condensed Bold, sans-serif;
font-weight: bold;
min-width: 128px; min-width: 128px;
max-width: 272px;/*56px * 4 + 16 * 3*/ max-width: 272px;/*56px * 4 + 16 * 3*/
} }
@ -511,8 +526,8 @@ a.paginate_button.next:after {
.primary-button { .primary-button {
max-width: 365px; max-width: 365px;
min-height: 48px; min-height: 48px;
font-family: 'Roboto Condensed Bold'; font-family: 'Roboto Condensed Bold', sans-serif;
font-size: 14px; font-size: calc(12px + (16 - 12) * ((100vw - 768px) / (1400 - 768)));
line-height: 16px; line-height: 16px;
font-weight: bold; font-weight: bold;
font-stretch: condensed; font-stretch: condensed;
@ -520,6 +535,7 @@ a.paginate_button.next:after {
line-height: normal; line-height: normal;
letter-spacing: 1.5px; letter-spacing: 1.5px;
text-align: center; text-align: center;
text-decoration: none;
color: #ffffff; color: #ffffff;
cursor: pointer; cursor: pointer;
background-color: var(--blue-blue); background-color: var(--blue-blue);
@ -731,7 +747,7 @@ div.browsebycategory-categories{
} }
div.browsebycategory-categories a { div.browsebycategory-categories a {
font-family: Roboto Condensed; font-family: 'Roboto Condensed Bold', sans-serif;
color: #ffffff; color: #ffffff;
text-decoration: none; text-decoration: none;
margin: auto; margin: auto;

8
templates/layout.html
View File

@ -49,7 +49,11 @@
<div class="footer-left"> <div class="footer-left">
<div id="footer-credit"> <div id="footer-credit">
<div id="footer-title-br"><p>A project by</p></div> <div id="footer-title-br"><p>A project by</p></div>
<div id="footer-img-br"><img src="{{ url_for('static', filename='/imgs/Logos/Banner-Repeater-logo.png') }}"></div> <div id="footer-img-br">
<img src="{{ url_for('static', filename='/imgs/Logos/Banner-Repeater-logo.png') }}">
<figcaption>Banner Repeater</figcaption>
</div>
</div> </div>
<div id="footer-funds"> <div id="footer-funds">
<div id="footer-title-others"><p>With support from</p></div> <div id="footer-title-others"><p>With support from</p></div>
@ -71,7 +75,7 @@
</div> </div>
<div id="footer-contact-form"> <div id="footer-contact-form">
<div id="footer-title-contact"><p>EXPRESSION OF INTEREST</p></div> <div id="footer-title-contact"><p>EXPRESSION OF INTEREST</p></div>
<div id="footer-contact primary-button"><a href=""><div class="primary-button bluebutton" id="contactform"><span>CONTACT FORM</span></div></a></div> <div id="primary-button"><a class="footer-contact" href=""><div class="primary-button bluebutton" id="contactform"><span>CONTACT FORM</span></div></a></div>
</div> </div>
</div> </div>
</div> </div>