Retheme site

This commit is contained in:
2020-12-25 17:52:57 +00:00
parent f79d4a9b8a
commit b9b768bcaf
150 changed files with 17829 additions and 9778 deletions

View File

@@ -1,28 +0,0 @@
<!DOCTYPE html>
<html>
{% include head.html %}
<body>
<!-- cookie notice is included automatically -->
{% include cookie-notice.html %}
<!-- content of navbar is included via jQuery -->
{% include navbar.html %}
<div class="mdc-drawer-app-content">
{% include top-app-bar.html %}
<main class="main-content" id="main-content">
<div class="mdc-top-app-bar--short-fixed-adjust">
<h2 class="mdc-typography--headline2">{{ page.title }}</h2>
{{ content }}
</div>
</main>
{% include footer.html %}
</div>
</body>
<style>
.mdc-top-app-bar--short-fixed-adjust {
text-align: center;
}
</style>
</html>

54
_layouts/article.html Normal file
View File

@@ -0,0 +1,54 @@
<!DOCTYPE HTML>
<html>
{% include head.html %}
<body class="is-preload">
{% include header.html %}
{% include cookie-notice.html %}
{% assign image-counter = 0 %}
<!-- Heading -->
<div id="heading">
<h1>{{ page_title }}</h1>
<p class="inner">{{ page_description }}</p>
</div>
<section class="heading-image-caption">
<div class="inner">
<p class="image-caption">{{ page.image-caption }} &bull; &copy; {{ page.copyright }}</p>
</div>
</section>
<!-- Main -->
<section id="main" class="wrapper">
<div class="inner">
<div class="content">
<b><p><time class="timeago" datetime="{{ page.date | date: '%Y-%m-%d' }}T{{ page.date | date: '%H:%M:%S' }}">{{ page.date | date: '%d/%m/%Y' }}</time> &bull; by {{ page.authors }}</p></b>
<p class="article-description-mobile"><b>{{ page.description }}</b></p>
<p>{{ content }}</p>
</div>
</div>
</section>
<!-- Footer -->
<footer id="footer">
<div class="inner">
{% include footer.html %}
</div>
</footer>
{% include scripts.html %}
</body>
<style>
#heading {
background-image: linear-gradient(rgba(17, 17, 17, 0.25), rgba(17, 17, 17, 0.25)), url("/images{{ page.url | remove: '.html' | remove: '/articles' }}.jpg");
}
</style>
</html>

View File

@@ -1,24 +1,80 @@
<!DOCTYPE html>
<!DOCTYPE HTML>
<html>
{% include head.html %}
<link href="/css/article-list.css" rel="stylesheet">
<link href="/css/home.css" rel="stylesheet">
<body>
<!-- cookie notice is included automatically -->
{% include cookie-notice.html %}
<!-- content of navbar is included via jQuery -->
{% include navbar.html %}
{% include head.html %}
<body class="is-preload">
<div class="mdc-drawer-app-content">
{% include top-app-bar.html %}
{% include header.html %}
<main class="main-content" id="main-content">
<div class="mdc-top-app-bar--short-fixed-adjust">
{{ content }}
</div>
</main>
{% include footer.html %}
</div>
</body>
</html>
{% include cookie-notice.html %}
<!-- Banner -->
<section id="banner">
<div class="inner">
<img src="/images/logo-white.png" class="banner-logo" />
<h1>{{ page_title }}</h1>
<p>{{ page_description }}</p>
</div>
</section>
{% if page.url contains "/years" %}
<section class="wrapper">
<div class="inner">
<div class="highlights">
{% if site.articles %}
{% assign articles = site.articles | sort: date | reverse %}
{% for article in articles %}
{% assign articleyear = article.date | date: "%Y" %}
{% if page_title == articleyear %}
<section>
<div class="content">
<header>
{% assign article_url = article.url | relative_url %}
<a href="{{ article_url }}" class="image fit"><img
src="/images{{ article_url | remove: '.html' | remove: '/articles' }}.jpg"></a>
<h3>{{ article.title }}</h3>
</header>
<p><time class="timeago" datetime="{{ article.date | date: '%Y-%m-%d' }}T{{ article.date | date: '%H:%M:%S' }}">{{ article.date | date: '%d/%m/%Y' }}</time> &bull; by {{ article.authors }}</p>
<p style="text-align: left;">{{ article.description }}</p>
<a href="{{ article_url }}" class="button small">Read more</a>
</div>
</section>
{% endif %}
{% endfor %}
{% endif %}
</div>
</section>
{% else %}
{{ content }}
{% endif %}
<!-- Footer -->
<footer id="footer">
<div class="inner">
{% include footer.html %}
</div>
</footer>
{% include scripts.html %}
</body>
{% if page.url contains "/years/" %}
{% assign banner-image = page.url | remove: '.html' | remove: '/years' | remove: '/' %}
{% else %}
{% assign most_recent_article = site.articles | sort: date | reversed | last %}
{% assign banner-image = most_recent_article.date | date: "%Y" %}
{% endif %}
<style>
#banner {
background-image: url("/images/backgrounds/{{ banner-image }}.jpg");
}
</style>
</html>

View File

@@ -1,28 +0,0 @@
<!DOCTYPE html>
<html>
{% include head.html %}
{% include article-page-head.html %}
<body>
<!-- cookie notice is included automatically -->
{% include cookie-notice.html %}
<!-- content of navbar is included via jQuery -->
{% include navbar.html %}
<div class="mdc-drawer-app-content">
{% include top-app-bar.html %}
<main class="main-content" id="main-content">
<div class="mdc-top-app-bar--short-fixed-adjust">
{% include article-heading.html %}
<div class="article-content">
{{ content }}
</div>
<div class="splitter"></div>
</div>
</main>
{% include footer.html %}
{% include top-scroll-button.html %}
</div>
</body>
</html>

View File

@@ -1,34 +0,0 @@
<!DOCTYPE html>
<html>
{% include head.html %}
{% include article-page-head.html %}
<body>
<!-- cookie notice is included automatically -->
{% include cookie-notice.html %}
<!-- content of navbar is included via jQuery -->
{% include navbar.html %}
<div class="mdc-drawer-app-content">
{% include top-app-bar.html %}
<main class="main-content" id="main-content">
<div class="mdc-top-app-bar--short-fixed-adjust">
{% include article-heading.html %}
<div class="article-content">
<audio controls>
<source src="{{ page.url | relative_url | remove: '.html' | replace: '/', '-' | remove: '-articles-' }}.ogg" type="audio/ogg">
<source src="{{ page.url | relative_url | remove: '.html' | replace: '/', '-' | remove: '-articles-' }}.mp3" type="audio/mpeg">
Sorry, but audio can't be played on your device.
</audio>
<figcaption class="mdc-typography--caption-text">{{ page.audio-caption }}</figcaption>
{{ content }}
</div>
<div class="splitter"></div>
</div>
</main>
{% include footer.html %}
{% include top-scroll-button.html %}
</div>
</body>
</html>

View File

@@ -1,30 +0,0 @@
<!DOCTYPE html>
<html>
{% include head.html %}
{% include article-page-head.html %}
<body>
<!-- cookie notice is included automatically -->
{% include cookie-notice.html %}
<!-- content of navbar is included via jQuery -->
{% include navbar.html %}
<div class="mdc-drawer-app-content">
{% include top-app-bar.html %}
<main class="main-content" id="main-content">
<div class="mdc-top-app-bar--short-fixed-adjust">
{% include article-heading.html %}
<div class="article-content">
<iframe class="video" src="https://www.youtube.com/embed/{{ page.video-id }}" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
<figcaption class="mdc-typography--caption-text">{{ page.video-caption }}</figcaption>
{{ content }}
</div>
<div class="splitter"></div>
</div>
</main>
{% include footer.html %}
{% include top-scroll-button.html %}
</div>
</body>
</html>

View File

@@ -1,44 +0,0 @@
<!DOCTYPE html>
<html>
{% assign pageyear = page.url | relative_url | remove: '.html' | remove: '/years/' %}
<!-- overwrite default title and description -->
<meta name="apple-mobile-web-app-title" content="{{ pageyear }} | BBC Young Reporter | Reading School">
<title>{{ pageyear }} | BBC Young Reporter | Reading School</title>
<meta name="description" content="News articles written by Reading School students in year 8, in {{ pageyear }}">
<link href="/css/article-list.css" rel="stylesheet">
<link href="/css/year.css" rel="stylesheet">
{% include head.html %}
<body>
<!-- cookie notice is included automatically -->
{% include cookie-notice.html %}
<!-- content of navbar is included via jQuery -->
{% include navbar.html %}
<div class="mdc-drawer-app-content">
{% include top-app-bar.html %}
<main class="main-content" id="main-content">
<div class="mdc-top-app-bar--short-fixed-adjust">
<div class="year-header parallax-section" data-jarallax data-speed="{{ site.parallax-speed }}" style="background-image: url('/images/backgrounds/{{ pageyear }}.jpg');">
<h1 class="mdc-typography--headline1">{{ pageyear }}</h1>
</div>
<div class="splitter"></div>
<div class="article-section">
<div class="articles">
{% assign articles = site.articles | sort: date | reverse %}
{% for article in articles %}
{% assign articleyear = article.date | date: "%Y" %}
{% if pageyear == articleyear %}
{% include mdc-card.html article=article %}
{% endif %}
{% endfor %}
</div>
</div>
<div class="splitter"></div>
</div>
</main>
{% include footer.html %}
</div>
</body>
</html>