Browse Source

adjust style after morning calls

master
JoBCB 4 years ago
parent
commit
3cbf7a4930
  1. 47
      static/css/style.css
  2. 9
      templates/home.html

47
static/css/style.css

@ -23,6 +23,13 @@ font-weight: normal;
font-style: normal; font-style: normal;
} }
@font-face {
font-family: 'Roboto Regular Italic';
src: url('webfonts/Roboto_Regular/Roboto-Italic.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
/***************** EMERGENCY BUTTON AND MOCKUPS****************/ /***************** EMERGENCY BUTTON AND MOCKUPS****************/
div#backend-data-button{ div#backend-data-button{
background-color: #1B42D8; background-color: #1B42D8;
@ -92,7 +99,11 @@ body {
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
body i {
font-family: 'Roboto Regular';
font-weight: normal;
font-style: italic;
}
/*Header*/ /*Header*/
div#header{ div#header{
@ -833,7 +844,14 @@ div.home-show-wrapper{
justify-content: center; justify-content: center;
} }
div.home-show-wrapper:hover { div.home-show-wrapper a{
display: flex;
align-items: center;
justify-content: center;
width: 100%;
}
div.home-show-wrapper a:hover {
color: white; color: white;
background-color: black; background-color: black;
} }
@ -886,7 +904,7 @@ div.home-show-wrapper:hover {
} }
.mw-parser-output blockquote p { .mw-parser-output blockquote p {
font-family: Roboto Condensed; font-family: Roboto Condensed;
font-size: 32px; font-size: calc(20px + (30 - 20) * ((100vw - 768px) / (1400 - 768)));
font-weight: normal; font-weight: normal;
font-stretch: condensed; font-stretch: condensed;
font-style: normal; font-style: normal;
@ -895,7 +913,7 @@ div.home-show-wrapper:hover {
color: var(--blue-blue); color: var(--blue-blue);
} }
.mw-parser-output blockquote + p { .mw-parser-output blockquote + p {
grid-column-start: 8; grid-column-start: 9;
grid-column-end: 18; grid-column-end: 18;
grid-row-start: 2; grid-row-start: 2;
grid-row-end: 2; grid-row-end: 2;
@ -903,7 +921,7 @@ div.home-show-wrapper:hover {
.mw-parser-output p { .mw-parser-output p {
margin: 0px 0px 30px 0px; margin: 0px 0px 30px 0px;
} }
.mw-parser-output h2 { /*.mw-parser-output h2 {
font-family: Roboto Condensed; font-family: Roboto Condensed;
font-size: calc(16px + (20 - 16) * ((100vw - 768px) / (1400 - 768))); font-size: calc(16px + (20 - 16) * ((100vw - 768px) / (1400 - 768)));
font-weight: normal; font-weight: normal;
@ -912,8 +930,8 @@ div.home-show-wrapper:hover {
letter-spacing: 1.13px; letter-spacing: 1.13px;
color: var(--black); color: var(--black);
margin: 0px 0px 30px 0px; margin: 0px 0px 30px 0px;
} }*/
h2:nth-of-type(1), .Heading_C { h2:nth-of-type(1), .Heading_C, .mw-parser-output h2, h2 {
font-family: Roboto Condensed; font-family: Roboto Condensed;
font-size: calc(20px + (30 - 20) * ((100vw - 768px) / (1400 - 768))); font-size: calc(20px + (30 - 20) * ((100vw - 768px) / (1400 - 768)));
font-weight: normal; font-weight: normal;
@ -922,8 +940,10 @@ h2:nth-of-type(1), .Heading_C {
line-height: 40px; line-height: 40px;
letter-spacing: 1.13px; letter-spacing: 1.13px;
color: var(--black); color: var(--black);
margin: 0px 0px 30px 0px;
} }
h2:nth-of-type(2), .Heading_D { h2:nth-of-type(2), .Heading_D,.mw-parser-output h3, h3 {
font-family: Roboto Condensed; font-family: Roboto Condensed;
font-size: calc(22px + (25 - 22) * ((100vw - 768px) / (1400 - 768))); font-size: calc(22px + (25 - 22) * ((100vw - 768px) / (1400 - 768)));
font-weight: normal; font-weight: normal;
@ -933,7 +953,7 @@ h2:nth-of-type(2), .Heading_D {
letter-spacing: 1.13px; letter-spacing: 1.13px;
color: var(--black); color: var(--black);
} }
h2:nth-of-type(3), .Heading_E, .mw-parser-output h3 { .Heading_E {
font-family: Roboto Condensed; font-family: Roboto Condensed;
font-size: calc(16px + (20 - 16) * ((100vw - 768px) / (1400 - 768))); font-size: calc(16px + (20 - 16) * ((100vw - 768px) / (1400 - 768)));
font-weight: normal; font-weight: normal;
@ -962,11 +982,11 @@ h2:nth-of-type(3), .Heading_E, .mw-parser-output h3 {
list-style-type: circle; list-style-type: circle;
margin: 0px 0px 30px 56px; margin: 0px 0px 30px 56px;
} }
.mw-parser-output p a img { .mw-parser-output p img {
width: 100%; width: 100%;
height: auto; height: auto;
} }
a img, a img::before { .mw-parser-output img {
font-family: Roboto Regular; font-family: Roboto Regular;
font-size: calc(12px + (20 - 12) * ((100vw - 768px) / (1400 - 768))); font-size: calc(12px + (20 - 12) * ((100vw - 768px) / (1400 - 768)));
text-decoration: none; text-decoration: none;
@ -1069,6 +1089,11 @@ div.browsebycategory-categories a {
} }
div.browsebycategory-categories:hover {
color: white;
background-color: black;
}
/************ SEARCH TOOLS ************/ /************ SEARCH TOOLS ************/

9
templates/home.html

@ -33,7 +33,8 @@
</div> </div>
<div id="wrapper-vid"> <div id="wrapper-vid">
<video preload="meta" autoplay="" loop=""> <video preload="meta" autoplay="" loop="">
<source src="vid/archive-links-video-temp.mp4" type="video/mp4">
<source src="{{ url_for('static', filename='/vid/archive-links-video-temp.mp4') }}" type="video/mp4">
</video> </video>
</div> </div>
</div> </div>
@ -82,7 +83,7 @@
</div> </div>
<div class="home-show-wrapper primary-button"><span class="home-show">BROWSE THE FULL ARCHIVE</span></div> <div class="home-show-wrapper"><a href="{{ url_for('browsethearchive') }}" class="home-show primary-button">BROWSE THE FULL ARCHIVE</a></div>
</div> </div>
@ -101,8 +102,8 @@ home-recent-items
$ShowHideMore = $('#home-recent-grid'); $ShowHideMore = $('#home-recent-grid');
$ShowHideMore.each(function() { $ShowHideMore.each(function() {
var $times = $(this).children('.home-recent-items'); var $times = $(this).children('.home-recent-items');
if ($times.length > 9) { if ($times.length > 13) {
$ShowHideMore.children(':nth-of-type(n+9)').addClass('moreShown').hide(); $ShowHideMore.children(':nth-of-type(n+13)').addClass('moreShown').hide();
$(this).find('span.home-show').addClass('more-times').html('SHOW MORE'); $(this).find('span.home-show').addClass('more-times').html('SHOW MORE');
} }
}); });

Loading…
Cancel
Save