tiedote.md/templates/tiedote.html

289 lines
5.8 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="$lang$" xml:lang="$lang$"$if(dir)$ dir="$dir$"$endif$>
<head>
<meta charset="utf-8" />
<meta name="generator" content="pandoc" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
$for(author-meta)$
<meta name="author" content="$author-meta$" />
$endfor$
$if(date-meta)$
<meta name="dcterms.date" content="$date-meta$" />
$endif$
$if(keywords)$
<meta name="keywords" content="$for(keywords)$$keywords$$sep$, $endfor$" />
$endif$
<title>$otsikko$</title>
<style>
body { margin: 0px; }
html { background-color: #f8f8f8; }
#htmldiv {
line-height: 1.5;
font-family: Fira Sans,Georgia,sans-serif;
color: #1a1a1a;
background-color: #f8f8f8;
}
#bodydiv {
margin: 0 auto 5em auto;
max-width: 36em;
padding: 1em;
hyphens: auto;
word-wrap: break-word;
text-rendering: optimizeLegibility;
font-kerning: normal;
}
@media screen and (max-width: 50em) {
#bodydiv {
font-size: 0.9em;
}
}
@media print {
body {
background-color: transparent;
color: black;
font-size: 12pt;
}
p, h2, h3 {
orphans: 3;
widows: 3;
}
h2, h3, h4 {
page-break-after: avoid;
}
}
p {
margin: 1em 0;
}
a {
color: #33652e;
}
a:visited {
color: #1b4318;
}
img {
max-width: 100%;
}
h3 {
font-weight: 500;
font-size: 1.25em;
}
blockquote {
margin: 1em 1.7em 1em 1.7em;
color: #808080;
}
#bodydiv > section {
border-left: 0.4em solid #33652e;
padding: 0.5em 1em 0.5em 1em;
background-color: #fdfdfd;
margin: 1.5em 0;
border-radius: 0.25em;
}
code {
font-family: Menlo, Monaco, 'Lucida Console', Consolas, monospace;
background-color: #222234;
padding: .2em .4em;
font-size: 85%;
margin: 0;
}
pre {
margin: 1em 0;
background-color: #222234;
padding: 1em;
overflow: auto;
}
pre code {
padding: 0;
overflow: visible;
}
hr {
background-color: #1a1a1a;
border: none;
height: 0.1em;
margin: 1em 0;
}
table {
margin: 1em 0;
border-collapse: collapse;
width: 100%;
overflow-x: auto;
display: block;
}
table caption {
margin-bottom: 0.75em;
}
tbody {
margin-top: 0.5em;
border-top: 1px solid #1a1a1a;
border-bottom: 1px solid #1a1a1a;
}
th {
border-top: 1px solid #1a1a1a;
padding: 0.25em 0.5em 0.25em 0.5em;
}
td {
padding: 0.125em 0.5em 0.25em 0.5em;
}
header {
margin-bottom: 3em;
text-align: center;
}
h1 {
margin-bottom: 0;
}
#date {
margin-top: 0;
font-size: 1.3em;
margin-bottom: 1em;
}
#luemyös {
font-size: 1.1em;
font-style: italic;
max-width: 20em;
margin: auto;
margin-bottom: 0.5em;
}
#header-logo {
width: 70%;
height: auto;
margin: auto;
display: block;
}
#TOC {
text-align: center;
}
#toc-title {
font-weight: 500;
font-size: 1.4em;
margin-bottom: 0.5em;
color: #606060;
}
#TOC ul {
list-style: none;
padding: 0;
margin: 0;
}
#TOC ul a {
color: #606060;
}
#TOC a:not(:hover) {
text-decoration: none;
}
#social-links {
margin: 2.5em auto;
}
#social-links img {
height: 32px;
width: auto;
margin: none;
display: block;
}
#social-links a {
text-decoration: none;
background: white;
display: inline-block;
padding: 4px;
margin: 2px;
border-radius: 25%;
}
code{white-space: pre-wrap;}
span.smallcaps{font-variant: small-caps;}
span.underline{text-decoration: underline;}
div.column{display: inline-block; vertical-align: top; width: 50%;}
div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;}
ul.task-list{list-style: none;}
$if(quotes)$
q { quotes: "“" "”" "" ""; }
$endif$
footer {
text-align: center;
margin-top: 3em;
}
#footer-info {
margin-top: 2em;
font-weight: 200;
color: #606060;
}
figure img {
display: block;
margin: auto;
width: 100%;
}
figure figcaption {
display: none;
}
.display.math{display: block; text-align: center; margin: 0.5rem auto;}
</style>
</head>
<body>
<div id=htmldiv>
<div id=bodydiv>
$for(include-before)$
$include-before$
$endfor$
<header id="title-block-header">
<img id="header-logo" src="https://olarinmaensamoojat.fi/tiedotekuvat/logo.png"/>
<h1>$otsikko$</h1>
<p id="date">$date$</p>
$if(johtajatiedote)$
<p id="luemyös">Tämä tiedote täydentää OMS-tiedotetta, joten luethan myös sen.</p>
$endif$
$if(toc)$
<nav id="$idprefix$TOC" role="doc-toc">
<h2 id="$idprefix$toc-title">Tässä tiedotteessa</h2>
$table-of-contents$
</nav>
$endif$
</header>
$body$
<footer>
<p>
Partioterveisin viestintävastaavat, muu hallitus, ikäkausivastaavat ja jänötiimi.
</p>
<div id="social-links">
<a href="https://www.facebook.com/OlarinmaenSamoojat">
<img src="https://olarinmaensamoojat.fi/tiedotekuvat/facebook.png" alt="Olarinmäen samoojien Facebook-tili"/>
</a>
<a href="https://www.instagram.com/olarinmaensamoojat/">
<img src="https://olarinmaensamoojat.fi/tiedotekuvat/instagram.png" alt="Olarinmäen samoojien Instagram-tili"/>
</a>
<a href="https://kuvat.olarinmaensamoojat.fi">
<img src="https://olarinmaensamoojat.fi/tiedotekuvat/piwigo.png" alt="Olarinmäen samoojien kuvapankki"/>
</a>
<a href="https://olarinmaensamoojat.fi">
<img src="https://olarinmaensamoojat.fi/tiedotekuvat/nettisivut.png" alt="Olarinmäen samoojien nettisivut"/>
</a>
</div>
<div id="footer-info">
$if(johtajatiedote)$
<p>
Tämä sähköposti lähetetään Olarinmäen Samoojiin kuuluville johtajaikäisille
jäsenille. Osoitelähde on jäsenrekisteri Kuksa.
</p>
$else$
<p>
Tämä sähköposti lähetetään Olarinmäen Samoojiin kuuluville jäsenille
ja heidän vanhemmilleen. Osoitelähde on jäsenrekisteri Kuksa.
</p>
$endif$
<address>
Yhteystiedot:
<br>
Olarinmäen Samoojat
<br>
Kuunsäde 3 C
<br>
Espoo 02210
<br>
Finland
</address>
</div>
</footer>
</div>
</div>
</body>
</html>