Add new page for creating MD files for RS
This commit is contained in:
7
.vscode/launch.json
vendored
Normal file
7
.vscode/launch.json
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
{
|
||||
// Use IntelliSense to learn about possible attributes.
|
||||
// Hover to view descriptions of existing attributes.
|
||||
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
|
||||
"version": "0.2.0",
|
||||
"configurations": []
|
||||
}
|
||||
1
Gemfile
1
Gemfile
@@ -1,2 +1,3 @@
|
||||
source 'https://rubygems.org'
|
||||
gem 'github-pages'
|
||||
gem 'wdm', '>= 0.1.0' if Gem.win_platform?
|
||||
@@ -240,6 +240,7 @@ GEM
|
||||
tzinfo (1.2.7)
|
||||
thread_safe (~> 0.1)
|
||||
unicode-display_width (1.7.0)
|
||||
wdm (0.1.1)
|
||||
zeitwerk (2.3.0)
|
||||
|
||||
PLATFORMS
|
||||
@@ -248,6 +249,7 @@ PLATFORMS
|
||||
|
||||
DEPENDENCIES
|
||||
github-pages
|
||||
wdm (>= 0.1.0)
|
||||
|
||||
BUNDLED WITH
|
||||
2.1.4
|
||||
|
||||
@@ -91,9 +91,9 @@
|
||||
|
||||
|
||||
|
||||
<a class="mdc-list-item" href="/svalbard/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">ac_unit</i>
|
||||
<span class="mdc-list-item__text">Svalbard</span>
|
||||
<a class="mdc-list-item" href="/young-reporter/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">article</i>
|
||||
<span class="mdc-list-item__text">BBC Young Reporter Article Creator</span>
|
||||
</a>
|
||||
|
||||
|
||||
@@ -204,7 +204,7 @@
|
||||
</div>
|
||||
</main>
|
||||
<footer>
|
||||
© Matthew Grove 2019
|
||||
© Matthew Grove 2020
|
||||
</footer>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -91,9 +91,9 @@
|
||||
|
||||
|
||||
|
||||
<a class="mdc-list-item" href="/svalbard/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">ac_unit</i>
|
||||
<span class="mdc-list-item__text">Svalbard</span>
|
||||
<a class="mdc-list-item" href="/young-reporter/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">article</i>
|
||||
<span class="mdc-list-item__text">BBC Young Reporter Article Creator</span>
|
||||
</a>
|
||||
|
||||
|
||||
@@ -139,7 +139,7 @@
|
||||
</div>
|
||||
</main>
|
||||
<footer>
|
||||
© Matthew Grove 2019
|
||||
© Matthew Grove 2020
|
||||
</footer>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -91,9 +91,9 @@
|
||||
|
||||
|
||||
|
||||
<a class="mdc-list-item" href="/svalbard/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">ac_unit</i>
|
||||
<span class="mdc-list-item__text">Svalbard</span>
|
||||
<a class="mdc-list-item" href="/young-reporter/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">article</i>
|
||||
<span class="mdc-list-item__text">BBC Young Reporter Article Creator</span>
|
||||
</a>
|
||||
|
||||
|
||||
@@ -140,7 +140,7 @@
|
||||
</div>
|
||||
</main>
|
||||
<footer>
|
||||
© Matthew Grove 2019
|
||||
© Matthew Grove 2020
|
||||
</footer>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -91,9 +91,9 @@
|
||||
|
||||
|
||||
|
||||
<a class="mdc-list-item" href="/svalbard/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">ac_unit</i>
|
||||
<span class="mdc-list-item__text">Svalbard</span>
|
||||
<a class="mdc-list-item" href="/young-reporter/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">article</i>
|
||||
<span class="mdc-list-item__text">BBC Young Reporter Article Creator</span>
|
||||
</a>
|
||||
|
||||
|
||||
@@ -166,7 +166,7 @@
|
||||
</div>
|
||||
</main>
|
||||
<footer>
|
||||
© Matthew Grove 2019
|
||||
© Matthew Grove 2020
|
||||
</footer>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -3,42 +3,42 @@
|
||||
|
||||
<url>
|
||||
<loc>/comsci/</loc>
|
||||
<lastmod>2020-06-24</lastmod>
|
||||
<lastmod>2020-11-02</lastmod>
|
||||
<changefreq>daily</changefreq>
|
||||
<priority>0.5</priority>
|
||||
</url>
|
||||
|
||||
<url>
|
||||
<loc>/luhn-algorithm/</loc>
|
||||
<lastmod>2020-06-24</lastmod>
|
||||
<lastmod>2020-11-02</lastmod>
|
||||
<changefreq>daily</changefreq>
|
||||
<priority>0.5</priority>
|
||||
</url>
|
||||
|
||||
<url>
|
||||
<loc>/svalbard/</loc>
|
||||
<lastmod>2020-06-24</lastmod>
|
||||
<loc>/young-reporter/</loc>
|
||||
<lastmod>2020-11-02</lastmod>
|
||||
<changefreq>daily</changefreq>
|
||||
<priority>0.5</priority>
|
||||
</url>
|
||||
|
||||
<url>
|
||||
<loc>/</loc>
|
||||
<lastmod>2020-06-24</lastmod>
|
||||
<lastmod>2020-11-02</lastmod>
|
||||
<changefreq>daily</changefreq>
|
||||
<priority>0.5</priority>
|
||||
</url>
|
||||
|
||||
<url>
|
||||
<loc>/computer-science-blog/</loc>
|
||||
<lastmod>2020-06-24</lastmod>
|
||||
<lastmod>2020-11-02</lastmod>
|
||||
<changefreq>daily</changefreq>
|
||||
<priority>0.5</priority>
|
||||
</url>
|
||||
|
||||
<url>
|
||||
<loc>/sitemap.xml</loc>
|
||||
<lastmod>2020-06-24</lastmod>
|
||||
<lastmod>2020-11-02</lastmod>
|
||||
<changefreq>daily</changefreq>
|
||||
<priority>0.5</priority>
|
||||
</url>
|
||||
|
||||
@@ -1,220 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
|
||||
<meta name="HandheldFriendly" content="True">
|
||||
<link rel="icon" sizes="192x192" href="https://mgrove.uk/logo.png">
|
||||
|
||||
<!-- add to homescreen for Chrome on Android -->
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
<link rel="icon" sizes="192x192" href="https://mgrove.uk/logo.png">
|
||||
|
||||
<!-- add to homescreen for Safari on iOS -->
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black">
|
||||
<meta name="apple-mobile-web-app-title" content="Svalbard | Matthew Grove">
|
||||
<link rel="apple-touch-icon-precomposed" href="https://mgrove.uk/logo.png">
|
||||
|
||||
<!-- tile icon & colour for Windows 8 -->
|
||||
<meta name="msapplication-TileImage" content="https://mgrove.uk/logo.png">
|
||||
<meta name="msapplication-TileColor" content="#d84315">
|
||||
|
||||
<title>Svalbard | Matthew Grove</title>
|
||||
<meta name="description" content="THe northernmost territory in the world - by Matthew Grove">
|
||||
|
||||
<!-- import Roboto (font) -->
|
||||
<link href="/css/roboto.css" rel="stylesheet" type="text/css">
|
||||
|
||||
<!-- import jQuery -->
|
||||
<script src="/js/jquery.min.js" type="text/javascript"></script>
|
||||
|
||||
<!-- import cookie JavaScript -->
|
||||
<script src="/js/cookies.js" type="text/javascript"></script>
|
||||
|
||||
<!-- import Material Design components & icons -->
|
||||
<link href="/css/material-components-web.min.css" rel="stylesheet" type="text/css">
|
||||
<link href="/css/material_icons.css" rel="stylesheet" type="text/css">
|
||||
<script src="/js/material-components-web.min.js" type="text/javascript"></script>
|
||||
|
||||
<!-- import local styling & scripts -->
|
||||
<script src="/js/global.js" type="text/javascript"></script>
|
||||
<link href="/css/global.css" rel="stylesheet" type="text/css">
|
||||
|
||||
<!-- Global site tag (gtag.js) - Google Analytics -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-124505000-1" type="text/javascript"></script>
|
||||
<script type="text/javascript">
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
gtag('config', 'UA-124505000-1');
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- cookie notice is included automatically -->
|
||||
<div id="cookies">
|
||||
<p>Just to let you know, I use cookies on my site.</p>
|
||||
<p><a href="javascript:void(0);" id="close-cookies">OK</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- content of navbar is included automatically -->
|
||||
<aside class="navbar-insert mdc-drawer mdc-drawer--modal">
|
||||
<div class="mdc-drawer__content">
|
||||
<div style="margin: 15px;text-align:center;">
|
||||
<img src="https://mgrove.uk/logo.png" style="width: 90%;"/>
|
||||
</div>
|
||||
<div class="mdc-list">
|
||||
<a class="mdc-list-item" href="https://blog.mgrove.uk">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">assignment</i>
|
||||
<span class="mdc-list-item__text">My Blog</span>
|
||||
</a>
|
||||
<a class="mdc-list-item" href="/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">home</i>
|
||||
<span class="mdc-list-item__text">Home Page</span>
|
||||
</a>
|
||||
|
||||
|
||||
<a class="mdc-list-item" href="/comsci/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">computer</i>
|
||||
<span class="mdc-list-item__text">ComSci</span>
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
<a class="mdc-list-item" href="/luhn-algorithm/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">credit_card</i>
|
||||
<span class="mdc-list-item__text">Luhn Algorithm</span>
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
<a class="mdc-list-item" href="/svalbard/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">ac_unit</i>
|
||||
<span class="mdc-list-item__text">Svalbard</span>
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a class="mdc-list-item" href="/computer-science-blog/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">code</i>
|
||||
<span class="mdc-list-item__text">GCSE Computer Science Blog</span>
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<div class="mdc-drawer-scrim"></div>
|
||||
|
||||
|
||||
<div class="mdc-drawer-app-content">
|
||||
<header class="mdc-top-app-bar app-bar" id="app-bar">
|
||||
<div class="mdc-top-app-bar__row">
|
||||
<section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
|
||||
<a href="javascript:void(0);" class="demo-mensu material-icons mdc-top-app-bar__navigation-icon">menu</a>
|
||||
<span class="mdc-top-app-bar__title">Svalbard | Matthew Grove</span>
|
||||
</section>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="main-content" id="main-content">
|
||||
<div class="mdc-top-app-bar--fixed-adjust">
|
||||
<div style="text-align: left; max-width: 700px; margin: auto">
|
||||
|
||||
<h1 id="svalbard-norway">Svalbard, Norway</h1>
|
||||
<h2 id="background">Background</h2>
|
||||
<ul>
|
||||
<li>Northernmost territory in the world</li>
|
||||
<li>60% glaciers</li>
|
||||
<li>40% tundra</li>
|
||||
<li>5 main islands (largest is Spitzbergen)</li>
|
||||
<li>Population of 2700</li>
|
||||
<li>More snowmobiles than people</li>
|
||||
</ul>
|
||||
|
||||
<h2 id="opportunities">Opportunities</h2>
|
||||
<ul>
|
||||
<li>Coal mining
|
||||
<ul>
|
||||
<li>300 jobs in coal mines</li>
|
||||
<li>Backbone of economy</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>Energy devlopment
|
||||
<ul>
|
||||
<li>Located near Mid-Atlantic Ridge - thin & hot rocks</li>
|
||||
<li>Potential for geothermal energy to replace polluting coal power station</li>
|
||||
<li>Or replace water in power station with CO<sub>2</sub></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>Fishing
|
||||
<ul>
|
||||
<li>Barents Sea (South of Svalbard) is one of the richest fishing grounds in the world</li>
|
||||
<li>150 species of fish - conservation is vital</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>Tourism
|
||||
<ul>
|
||||
<li>70,000 people visited Longyearbyen in 2011</li>
|
||||
<li>Port was expanded to cope with tourist numbers</li>
|
||||
<li>300 jobs in tourism</li>
|
||||
<li>Northen lights, natural environment and adventures attract tourists</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<h2 id="challenges">Challenges</h2>
|
||||
<ul>
|
||||
<li>Extreme temperatures
|
||||
<ul>
|
||||
<li>Sometimes below -30°C</li>
|
||||
<li>But wear warm clothes</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>Construction
|
||||
<ul>
|
||||
<li>Permafrost has to be protected from melting before foundations can be dug</li>
|
||||
<li>Difficult to build in the cold and the long dark periods - so most work is done in the summer</li>
|
||||
<li>However, road maintenance is relatively easy</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>Services
|
||||
<ul>
|
||||
<li>Pipes and cables must be kept off the ground, to ensure they don’t freeze</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>Accessibility
|
||||
<ul>
|
||||
<li>Limited transport</li>
|
||||
<li>Islands can only be accessed by plane or ship</li>
|
||||
<li>Only 50 km of roads in Longyearbyen</li>
|
||||
<li>But there is an international airport</li>
|
||||
<li>And snowmobiles can be used to travel around</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- link to source code on GitHub -->
|
||||
<a href="https://github.com/mgrove36/demo-code/tree/master/svalbard/" class="source-code-link mdc-fab mdc-fab--extended" data-mdc-auto-init="MDCRipple">
|
||||
<span class="material-icons mdc-fab__icon">rate_review</span>
|
||||
<span class="mdc-fab__label">View on GitHub</span>
|
||||
</a>
|
||||
</div>
|
||||
</main>
|
||||
<footer>
|
||||
© Matthew Grove 2019
|
||||
</footer>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
336
_site/young-reporter/index.html
Normal file
336
_site/young-reporter/index.html
Normal file
@@ -0,0 +1,336 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
|
||||
<meta name="HandheldFriendly" content="True">
|
||||
<link rel="icon" sizes="192x192" href="https://mgrove.uk/logo.png">
|
||||
|
||||
<!-- add to homescreen for Chrome on Android -->
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
<link rel="icon" sizes="192x192" href="https://mgrove.uk/logo.png">
|
||||
|
||||
<!-- add to homescreen for Safari on iOS -->
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black">
|
||||
<meta name="apple-mobile-web-app-title" content="BBC Young Reporter Article Creator | Matthew Grove">
|
||||
<link rel="apple-touch-icon-precomposed" href="https://mgrove.uk/logo.png">
|
||||
|
||||
<!-- tile icon & colour for Windows 8 -->
|
||||
<meta name="msapplication-TileImage" content="https://mgrove.uk/logo.png">
|
||||
<meta name="msapplication-TileColor" content="#d84315">
|
||||
|
||||
<title>BBC Young Reporter Article Creator | Matthew Grove</title>
|
||||
<meta name="description" content="A simple tool to create markdown files from news articles, for uploading to the Reading School BBC Young Reporter website - by Matthew Grove">
|
||||
|
||||
<!-- import Roboto (font) -->
|
||||
<link href="/css/roboto.css" rel="stylesheet" type="text/css">
|
||||
|
||||
<!-- import jQuery -->
|
||||
<script src="/js/jquery.min.js" type="text/javascript"></script>
|
||||
|
||||
<!-- import cookie JavaScript -->
|
||||
<script src="/js/cookies.js" type="text/javascript"></script>
|
||||
|
||||
<!-- import Material Design components & icons -->
|
||||
<link href="/css/material-components-web.min.css" rel="stylesheet" type="text/css">
|
||||
<link href="/css/material_icons.css" rel="stylesheet" type="text/css">
|
||||
<script src="/js/material-components-web.min.js" type="text/javascript"></script>
|
||||
|
||||
<!-- import local styling & scripts -->
|
||||
<script src="/js/global.js" type="text/javascript"></script>
|
||||
<link href="/css/global.css" rel="stylesheet" type="text/css">
|
||||
|
||||
<!-- Global site tag (gtag.js) - Google Analytics -->
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-124505000-1" type="text/javascript"></script>
|
||||
<script type="text/javascript">
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
gtag('config', 'UA-124505000-1');
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- cookie notice is included automatically -->
|
||||
<div id="cookies">
|
||||
<p>Just to let you know, I use cookies on my site.</p>
|
||||
<p><a href="javascript:void(0);" id="close-cookies">OK</a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- content of navbar is included automatically -->
|
||||
<aside class="navbar-insert mdc-drawer mdc-drawer--modal">
|
||||
<div class="mdc-drawer__content">
|
||||
<div style="margin: 15px;text-align:center;">
|
||||
<img src="https://mgrove.uk/logo.png" style="width: 90%;"/>
|
||||
</div>
|
||||
<div class="mdc-list">
|
||||
<a class="mdc-list-item" href="https://blog.mgrove.uk">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">assignment</i>
|
||||
<span class="mdc-list-item__text">My Blog</span>
|
||||
</a>
|
||||
<a class="mdc-list-item" href="/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">home</i>
|
||||
<span class="mdc-list-item__text">Home Page</span>
|
||||
</a>
|
||||
|
||||
|
||||
<a class="mdc-list-item" href="/comsci/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">computer</i>
|
||||
<span class="mdc-list-item__text">ComSci</span>
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
<a class="mdc-list-item" href="/luhn-algorithm/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">credit_card</i>
|
||||
<span class="mdc-list-item__text">Luhn Algorithm</span>
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
<a class="mdc-list-item" href="/young-reporter/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">article</i>
|
||||
<span class="mdc-list-item__text">BBC Young Reporter Article Creator</span>
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a class="mdc-list-item" href="/computer-science-blog/">
|
||||
<i class="material-icons mdc-list-item__graphic" aria-hidden="true">code</i>
|
||||
<span class="mdc-list-item__text">GCSE Computer Science Blog</span>
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<div class="mdc-drawer-scrim"></div>
|
||||
|
||||
|
||||
<div class="mdc-drawer-app-content">
|
||||
<header class="mdc-top-app-bar app-bar" id="app-bar">
|
||||
<div class="mdc-top-app-bar__row">
|
||||
<section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
|
||||
<a href="javascript:void(0);" class="demo-mensu material-icons mdc-top-app-bar__navigation-icon">menu</a>
|
||||
<span class="mdc-top-app-bar__title">BBC Young Reporter Article Creator | Matthew Grove</span>
|
||||
</section>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="main-content" id="main-content">
|
||||
<div class="mdc-top-app-bar--fixed-adjust">
|
||||
<h1 id="reading-school-bbc-young-reporter-article-compiler">Reading School BBC Young Reporter Article Compiler</h1>
|
||||
|
||||
<p>Fill in the fields below, and then click the <em>download</em> button to create a file to be uploaded to Reading School’s BBC Young Reporter website.</p>
|
||||
|
||||
<p>Give the authors’ names in the format <code class="highlighter-rouge">First_Name Last_Initial</code>, and separate multiple authors with a comma - e.g. <code class="highlighter-rouge">John D, Emma S</code></p>
|
||||
|
||||
<ul>
|
||||
<li>If there are any headings inside your article, please place <code class="highlighter-rouge"># </code> in front of them</li>
|
||||
<li>For subtitles, use <code class="highlighter-rouge">## </code>, as so on for smaller headings, up to and including <code class="highlighter-rouge">###### </code></li>
|
||||
<li>For bullet points, use <code class="highlighter-rouge">* </code>, and for indented bullets, increase the indent using tab</li>
|
||||
<li>For numbered lists, use the numbers/letters: e.g. <code class="highlighter-rouge">1. </code></li>
|
||||
</ul>
|
||||
|
||||
<p>Note the requirement for spaces after each of the above items - for example:</p>
|
||||
|
||||
<p><code class="highlighter-rouge">### My Heading</code></p>
|
||||
|
||||
<p><code class="highlighter-rouge">* Numbered item</code></p>
|
||||
|
||||
<p>will produce:</p>
|
||||
|
||||
<h3 id="my-heading">My Heading</h3>
|
||||
|
||||
<ol>
|
||||
<li>Numbered item</li>
|
||||
</ol>
|
||||
|
||||
<p>However, the below don’t need spaces:</p>
|
||||
|
||||
<ul>
|
||||
<li>For italics, use <code class="highlighter-rouge">*my italic text*</code></li>
|
||||
<li>For bold, use <code class="highlighter-rouge">**my bold text**</code></li>
|
||||
<li>For bold and italics, use <code class="highlighter-rouge">***my bold, italic text***</code></li>
|
||||
<li>For links, use <code class="highlighter-rouge">[text to show in article](URL)</code></li>
|
||||
<li>To include an extra image (besides the cover image), use:</li>
|
||||
</ul>
|
||||
|
||||
<p><code class="highlighter-rouge">{% include image.html id=ID_OF_IMAGE caption="IMAGE_CAPTION" copyright="IMAGE_COPYRIGHT" %}</code></p>
|
||||
|
||||
<p>replacing <code class="highlighter-rouge">ID_OF_IMAGE</code> with a unique ID for the image in your article - start at 1 for the first image (excluding the cover image).</p>
|
||||
|
||||
<p>The cover image for your article must be a JPEG image, and have the <code class="highlighter-rouge">jpg</code> file extension. If your image is a PNG, you can convert it using an online tool. The file name must also be the same as your article’s file name. This will be provided to you when you download the file from this page. E.g. if the file you download from this page is <code class="highlighter-rouge">news-article.md</code> then your cover image must be <code class="highlighter-rouge">news-article.jpg</code> (capital letters <strong>DO</strong> matter).</p>
|
||||
|
||||
<p>Any extra images for your article must be in the format:</p>
|
||||
|
||||
<p><code class="highlighter-rouge">ARTICLE_FILE_NAME--extra-IMAGE_ID.jpg</code>, e.g. <code class="highlighter-rouge">news-article--extra-1.jpg</code></p>
|
||||
|
||||
<p>where you replace <code class="highlighter-rouge">ARTICLE_FILE_NAME</code> with the file name you used for the cover image, and <code class="highlighter-rouge">IMAGE_ID</code> with the ID you gave the image when you inserted it into your article’s body, as seen above.</p>
|
||||
|
||||
<div class="mdc-text-field-container">
|
||||
<div class="mdc-text-field mdc-text-field--outlined" data-mdc-auto-init="MDCTextField">
|
||||
<input type="text" class="mdc-text-field__input" id="article-title" />
|
||||
<label class="mdc-floating-label">Article title</label>
|
||||
<div class="mdc-notched-outline">
|
||||
<svg><path class="mdc-notched-outline__path" /></svg>
|
||||
</div>
|
||||
<div class="mdc-notched-outline__idle"></div>
|
||||
</div>
|
||||
<div class="mdc-text-field mdc-text-field--outlined" data-mdc-auto-init="MDCTextField">
|
||||
<input type="text" class="mdc-text-field__input" id="authors" />
|
||||
<label class="mdc-floating-label">Authors</label>
|
||||
<div class="mdc-notched-outline">
|
||||
<svg><path class="mdc-notched-outline__path" /></svg>
|
||||
</div>
|
||||
<div class="mdc-notched-outline__idle"></div>
|
||||
</div>
|
||||
<div class="mdc-text-field mdc-text-field--outlined" data-mdc-auto-init="MDCTextField">
|
||||
<input type="text" class="mdc-text-field__input" id="image-caption" />
|
||||
<label class="mdc-floating-label">Image caption</label>
|
||||
<div class="mdc-notched-outline">
|
||||
<svg><path class="mdc-notched-outline__path" /></svg>
|
||||
</div>
|
||||
<div class="mdc-notched-outline__idle"></div>
|
||||
</div>
|
||||
<div class="mdc-text-field mdc-text-field--outlined" data-mdc-auto-init="MDCTextField">
|
||||
<input type="text" class="mdc-text-field__input" id="image-copyright" />
|
||||
<label class="mdc-floating-label">Image copyright</label>
|
||||
<div class="mdc-notched-outline">
|
||||
<svg><path class="mdc-notched-outline__path" /></svg>
|
||||
</div>
|
||||
<div class="mdc-notched-outline__idle"></div>
|
||||
</div>
|
||||
<div class="mdc-text-field mdc-text-field--outlined" data-mdc-auto-init="MDCTextField">
|
||||
<input type="text" class="mdc-text-field__input" id="article-description" />
|
||||
<label class="mdc-floating-label">Article description</label>
|
||||
<div class="mdc-notched-outline">
|
||||
<svg><path class="mdc-notched-outline__path" /></svg>
|
||||
</div>
|
||||
<div class="mdc-notched-outline__idle"></div>
|
||||
</div>
|
||||
<br />
|
||||
<div class="mdc-text-field mdc-text-field--outlined mdc-text-field--textarea mdc-text-field--no-label" data-mdc-auto-init="MDCTextField">
|
||||
<textarea class="mdc-text-field__input" rows="8" aria-label="Label" id="article-content" placeholder="Article content"></textarea>
|
||||
<div class="mdc-notched-outline">
|
||||
<svg><path class="mdc-notched-outline__path" /></svg>
|
||||
</div>
|
||||
<div class="mdc-notched-outline__idle"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p><button class="download_button mdc-button mdc-button--outlined" onclick="downloadFile();" data-mdc-auto-init="MDCRipple">
|
||||
<i class="material-icons mdc-button__icon">cloud_download</i>
|
||||
Download article
|
||||
</button></p>
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.mdc-text-field--textarea .mdc-text-field__input {
|
||||
padding-top: 16px;
|
||||
}
|
||||
.mdc-text-field--textarea:not(.mdc-text-field--disabled) {
|
||||
border-color: rgba(0,0,0,0.12);
|
||||
}
|
||||
|
||||
#article-content::placeholder {
|
||||
color: rgba(0,0,0,0.63);
|
||||
}
|
||||
|
||||
.mdc-text-field {
|
||||
min-width: 500px;
|
||||
}
|
||||
|
||||
.mdc-text-field--textarea.mdc-text-field--focussed .mdc-text-field__input {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.mdc-text-field--textarea .mdc-text-field__input {
|
||||
content: "Article content";
|
||||
}
|
||||
|
||||
.mdc-text-field--textarea .mdc-text-field__input:focus {
|
||||
content: "";
|
||||
}
|
||||
|
||||
.mdc-text-field-container {
|
||||
max-width: 1508px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1550px) {
|
||||
.mdc-text-field-container {
|
||||
max-width: 1004px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1045px) {
|
||||
.mdc-text-field-container {
|
||||
max-width: 502px;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<script>
|
||||
function downloadFile() {
|
||||
if (document.getElementById("article-title").value != "" && document.getElementById("article-title").value != "" && document.getElementById("authors").value != "" && document.getElementById("image-caption").value != "" && document.getElementById("image-copyright").value != "" && document.getElementById("article-description").value != "") {
|
||||
var today = new Date();
|
||||
var dd = String(today.getDate()).padStart(2, '0');
|
||||
var mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!
|
||||
var yyyy = today.getFullYear();
|
||||
var hours = today.getHours();
|
||||
var minutes = today.getMinutes();
|
||||
var date = yyyy + "-" + mm + "-" + dd + " " + hours + ":" + minutes
|
||||
|
||||
var file_name = document.getElementById("article-title").value.replace(/[.,\/#!$%\^&\*;:{}=\-_`~()]/g,"").replace(/\s{2,}/g," ").replace(/\s+/g,"-").toLowerCase() + ".md";
|
||||
var text = `---
|
||||
title: '` + document.getElementById("article-title").value + `'
|
||||
date: ` + date + `
|
||||
authors: ` + document.getElementById("authors").value + `
|
||||
image-caption: ` + document.getElementById("image-caption").value + `
|
||||
copyright: ` + document.getElementById("image-copyright").value + `
|
||||
description: ` + document.getElementById("article-description").value + `
|
||||
---
|
||||
|
||||
` + document.getElementById("article-content").value;
|
||||
|
||||
var element = document.createElement("a");
|
||||
element.setAttribute("href", "data:text/plain;charset=utf-8," + encodeURIComponent(text));
|
||||
element.setAttribute("download", file_name);
|
||||
|
||||
element.style.display = "none";
|
||||
document.body.appendChild(element);
|
||||
|
||||
element.click();
|
||||
|
||||
document.body.removeChild(element);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<!-- link to source code on GitHub -->
|
||||
<a href="https://github.com/mgrove36/demo-code/tree/master/young-reporter/" class="source-code-link mdc-fab mdc-fab--extended" data-mdc-auto-init="MDCRipple">
|
||||
<span class="material-icons mdc-fab__icon">rate_review</span>
|
||||
<span class="mdc-fab__label">View on GitHub</span>
|
||||
</a>
|
||||
</div>
|
||||
</main>
|
||||
<footer>
|
||||
© Matthew Grove 2020
|
||||
</footer>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
193
young-reporter/index.md
Normal file
193
young-reporter/index.md
Normal file
@@ -0,0 +1,193 @@
|
||||
---
|
||||
title: BBC Young Reporter Article Creator
|
||||
description: A simple tool to create markdown files from news articles, for uploading to the Reading School BBC Young Reporter website
|
||||
layout: default
|
||||
icon: article
|
||||
---
|
||||
|
||||
# Reading School BBC Young Reporter Article Compiler
|
||||
|
||||
Fill in the fields below, and then click the *download* button to create a file to be uploaded to Reading School's BBC Young Reporter website.
|
||||
|
||||
Give the authors' names in the format `First_Name Last_Initial`, and separate multiple authors with a comma - e.g. `John D, Emma S`
|
||||
|
||||
* If there are any headings inside your article, please place `# ` in front of them
|
||||
* For subtitles, use `## `, as so on for smaller headings, up to and including `###### `
|
||||
* For bullet points, use `* `, and for indented bullets, increase the indent using tab
|
||||
* For numbered lists, use the numbers/letters: e.g. `1. `
|
||||
|
||||
Note the requirement for spaces after each of the above items - for example:
|
||||
|
||||
`### My Heading`
|
||||
|
||||
`* Numbered item`
|
||||
|
||||
will produce:
|
||||
|
||||
### My Heading
|
||||
|
||||
1. Numbered item
|
||||
|
||||
However, the below don't need spaces:
|
||||
|
||||
* For italics, use `*my italic text*`
|
||||
* For bold, use `**my bold text**`
|
||||
* For bold and italics, use `***my bold, italic text***`
|
||||
* For links, use `[text to show in article](URL)`
|
||||
* To include an extra image (besides the cover image), use:
|
||||
|
||||
`{% raw %}{% include image.html id=ID_OF_IMAGE caption="IMAGE_CAPTION" copyright="IMAGE_COPYRIGHT" %}{% endraw %}`
|
||||
|
||||
replacing `ID_OF_IMAGE` with a unique ID for the image in your article - start at 1 for the first image (excluding the cover image).
|
||||
|
||||
The cover image for your article must be a JPEG image, and have the `jpg` file extension. If your image is a PNG, you can convert it using an online tool. The file name must also be the same as your article's file name. This will be provided to you when you download the file from this page. E.g. if the file you download from this page is `news-article.md` then your cover image must be `news-article.jpg` (capital letters **DO** matter).
|
||||
|
||||
Any extra images for your article must be in the format:
|
||||
|
||||
`ARTICLE_FILE_NAME--extra-IMAGE_ID.jpg`, e.g. `news-article--extra-1.jpg`
|
||||
|
||||
where you replace `ARTICLE_FILE_NAME` with the file name you used for the cover image, and `IMAGE_ID` with the ID you gave the image when you inserted it into your article's body, as seen above.
|
||||
|
||||
<div class="mdc-text-field-container">
|
||||
<div class="mdc-text-field mdc-text-field--outlined" data-mdc-auto-init="MDCTextField">
|
||||
<input type="text" class="mdc-text-field__input" id="article-title">
|
||||
<label class="mdc-floating-label">Article title</label>
|
||||
<div class="mdc-notched-outline">
|
||||
<svg><path class="mdc-notched-outline__path"/></svg>
|
||||
</div>
|
||||
<div class="mdc-notched-outline__idle"></div>
|
||||
</div>
|
||||
<div class="mdc-text-field mdc-text-field--outlined" data-mdc-auto-init="MDCTextField">
|
||||
<input type="text" class="mdc-text-field__input" id="authors">
|
||||
<label class="mdc-floating-label">Authors</label>
|
||||
<div class="mdc-notched-outline">
|
||||
<svg><path class="mdc-notched-outline__path"/></svg>
|
||||
</div>
|
||||
<div class="mdc-notched-outline__idle"></div>
|
||||
</div>
|
||||
<div class="mdc-text-field mdc-text-field--outlined" data-mdc-auto-init="MDCTextField">
|
||||
<input type="text" class="mdc-text-field__input" id="image-caption">
|
||||
<label class="mdc-floating-label">Image caption</label>
|
||||
<div class="mdc-notched-outline">
|
||||
<svg><path class="mdc-notched-outline__path"/></svg>
|
||||
</div>
|
||||
<div class="mdc-notched-outline__idle"></div>
|
||||
</div>
|
||||
<div class="mdc-text-field mdc-text-field--outlined" data-mdc-auto-init="MDCTextField">
|
||||
<input type="text" class="mdc-text-field__input" id="image-copyright">
|
||||
<label class="mdc-floating-label">Image copyright</label>
|
||||
<div class="mdc-notched-outline">
|
||||
<svg><path class="mdc-notched-outline__path"/></svg>
|
||||
</div>
|
||||
<div class="mdc-notched-outline__idle"></div>
|
||||
</div>
|
||||
<div class="mdc-text-field mdc-text-field--outlined" data-mdc-auto-init="MDCTextField">
|
||||
<input type="text" class="mdc-text-field__input" id="article-description">
|
||||
<label class="mdc-floating-label">Article description</label>
|
||||
<div class="mdc-notched-outline">
|
||||
<svg><path class="mdc-notched-outline__path"/></svg>
|
||||
</div>
|
||||
<div class="mdc-notched-outline__idle"></div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="mdc-text-field mdc-text-field--outlined mdc-text-field--textarea mdc-text-field--no-label" data-mdc-auto-init="MDCTextField">
|
||||
<textarea class="mdc-text-field__input" rows="8" aria-label="Label" id="article-content" placeholder="Article content"></textarea>
|
||||
<div class="mdc-notched-outline">
|
||||
<svg><path class="mdc-notched-outline__path"/></svg>
|
||||
</div>
|
||||
<div class="mdc-notched-outline__idle"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<button class="download_button mdc-button mdc-button--outlined" onclick="downloadFile();" data-mdc-auto-init="MDCRipple">
|
||||
<i class="material-icons mdc-button__icon">cloud_download</i>
|
||||
Download article
|
||||
</button>
|
||||
|
||||
<style>
|
||||
body {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.mdc-text-field--textarea .mdc-text-field__input {
|
||||
padding-top: 16px;
|
||||
}
|
||||
.mdc-text-field--textarea:not(.mdc-text-field--disabled) {
|
||||
border-color: rgba(0,0,0,0.12);
|
||||
}
|
||||
|
||||
#article-content::placeholder {
|
||||
color: rgba(0,0,0,0.63);
|
||||
}
|
||||
|
||||
.mdc-text-field {
|
||||
min-width: 500px;
|
||||
}
|
||||
|
||||
.mdc-text-field--textarea.mdc-text-field--focussed .mdc-text-field__input {
|
||||
color: black;
|
||||
}
|
||||
|
||||
.mdc-text-field--textarea .mdc-text-field__input {
|
||||
content: "Article content";
|
||||
}
|
||||
|
||||
.mdc-text-field--textarea .mdc-text-field__input:focus {
|
||||
content: "";
|
||||
}
|
||||
|
||||
.mdc-text-field-container {
|
||||
max-width: 1508px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1550px) {
|
||||
.mdc-text-field-container {
|
||||
max-width: 1004px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1045px) {
|
||||
.mdc-text-field-container {
|
||||
max-width: 502px;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<script>
|
||||
function downloadFile() {
|
||||
if (document.getElementById("article-title").value != "" && document.getElementById("article-title").value != "" && document.getElementById("authors").value != "" && document.getElementById("image-caption").value != "" && document.getElementById("image-copyright").value != "" && document.getElementById("article-description").value != "") {
|
||||
var today = new Date();
|
||||
var dd = String(today.getDate()).padStart(2, '0');
|
||||
var mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!
|
||||
var yyyy = today.getFullYear();
|
||||
var hours = today.getHours();
|
||||
var minutes = today.getMinutes();
|
||||
var date = yyyy + "-" + mm + "-" + dd + " " + hours + ":" + minutes
|
||||
|
||||
var file_name = document.getElementById("article-title").value.replace(/[.,\/#!$%\^&\*;:{}=\-_`~()]/g,"").replace(/\s{2,}/g," ").replace(/\s+/g,"-").toLowerCase() + ".md";
|
||||
var text = `---
|
||||
title: '` + document.getElementById("article-title").value + `'
|
||||
date: ` + date + `
|
||||
authors: ` + document.getElementById("authors").value + `
|
||||
image-caption: ` + document.getElementById("image-caption").value + `
|
||||
copyright: ` + document.getElementById("image-copyright").value + `
|
||||
description: ` + document.getElementById("article-description").value + `
|
||||
---
|
||||
|
||||
` + document.getElementById("article-content").value;
|
||||
|
||||
var element = document.createElement("a");
|
||||
element.setAttribute("href", "data:text/plain;charset=utf-8," + encodeURIComponent(text));
|
||||
element.setAttribute("download", file_name);
|
||||
|
||||
element.style.display = "none";
|
||||
document.body.appendChild(element);
|
||||
|
||||
element.click();
|
||||
|
||||
document.body.removeChild(element);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user