Skip to content

Instantly share code, notes, and snippets.

@schmijos
Last active June 13, 2018 20:24
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save schmijos/94047fd9380dcd4bc0b977a3cf5f8cd8 to your computer and use it in GitHub Desktop.
Save schmijos/94047fd9380dcd4bc0b977a3cf5f8cd8 to your computer and use it in GitHub Desktop.
Display the source blob
Display the rendered blob
Raw
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Brauzeugen</title>
<style>
@font-face {
font-family: PfefferMediaeval;
src: url(PfefferMediaeval.svg);
}
body {
font-family: PfefferMediaeval, 'Open Sans', sans-serif;
text-align: justify;
}
h1, h2, h3 {
letter-spacing: 0.1em;
font-variant: small-caps;
text-align: center;
}
p {
line-height: 133%;
}
p:first-letter, p .followup-first-letter {
color: #FF5722;
}
p:first-of-type:first-letter {
font-size: 250%;
float: left;
margin-right: 0.15em;
font-style: normal;
margin-top: 0.2em;
}
article {
clip-path: polygon(3% 0, 7% 1%, 11% 0%, 16% 2%, 20% 0, 23% 2%, 28% 2%, 32% 1%, 35% 1%, 39% 3%, 41% 1%, 45% 0%, 47% 2%, 50% 2%, 53% 0, 58% 2%, 60% 2%, 63% 1%, 65% 0%, 67% 2%, 69% 2%, 73% 1%, 76% 1%, 79% 0, 82% 1%, 85% 0, 87% 1%, 89% 0, 92% 1%, 96% 0, 98% 3%, 99% 3%, 99% 6%, 100% 11%, 98% 15%, 100% 21%, 99% 28%, 100% 32%, 99% 35%, 99% 40%, 100% 43%, 99% 48%, 100% 53%, 100% 57%, 99% 60%, 100% 64%, 100% 68%, 99% 72%, 100% 75%, 100% 79%, 99% 83%, 100% 86%, 100% 90%, 99% 94%, 99% 98%, 95% 99%, 92% 99%, 89% 100%, 86% 99%, 83% 100%, 77% 99%, 72% 100%, 66% 98%, 62% 100%, 59% 99%, 54% 99%, 49% 100%, 46% 98%, 43% 100%, 40% 98%, 38% 100%, 35% 99%, 31% 100%, 28% 99%, 25% 99%, 22% 100%, 19% 99%, 16% 100%, 13% 99%, 10% 99%, 7% 100%, 4% 99%, 2% 97%, 1% 97%, 0% 94%, 1% 89%, 0% 84%, 1% 81%, 0 76%, 0 71%, 1% 66%, 0% 64%, 0% 61%, 0% 59%, 1% 54%, 0% 49%, 1% 45%, 0% 40%, 1% 37%, 0% 34%, 1% 29%, 0% 23%, 2% 20%, 1% 17%, 1% 13%, 0 10%, 1% 6%, 1% 3%);
background-color: #ffc1070f;
box-shadow: 10px 10px grey;
filter: drop-shadow(0px 10px 5px rgba(0,0,0,0.1));
padding: 50px 20px 20px 20px;
max-width: 480px;
column-count: 2;
column-gap: 40px;
column-rule-style: solid;
column-rule-width: 2px;
column-rule-color: #FF572255;
margin: 0 auto 50px auto;
}
.illustration {
display: block;
width: 150px;
margin: 50px auto 100px auto;
filter: opacity(80%);
}
.signature {
font-family: Papyrus, sans-serif;
}
</style>
</head>
<body>
<article>
<section>
<h1>Brauzeugen</h1>
<p>Guten Tag, Wanderer! Du hast dir ein <strong>gutes Bier</strong> verdient – und genau solches brauen wir.
Der richtige Einsatz feiner Nasen und brachialer Muskelkraft führt zu unserem zerbrechlichen und doch so männlichen
Getränk.</p>
<p>Du bist herzlich zum Verkosten eingeladen. Melde dich bei:<br>
<a href="mailto:jschmid+bier@fastmail.net">jschmid+bier@fastmail.net</a>.
</p>
<p>Bis dann,<br>Brauschmid und EXperte</p>
<img class="illustration" src="bar-1299049.svg">
</section>
<section>
<h2>Wir sind</h2>
<p>
Wir sind zwei Geniesser, welche während der gemeinsamen Studienzeit in Rapperswil die Liebe zum guten Bier
gefunden haben. Dank der VSHSR-Brauerei lernten wir, dass selbst Gebrautes einfach besser schmeckt.
Vielen Dank hier an Tobias Lehner und Johannes Federer (die damaligen Braumeister), dass ihr unsere Mentoren
wart!
</p>
<p>
Das Bedürfnis, gutes Bier zu brauen und natürlich auch zu trinken überdauerte das Studium.
Wir haben uns mit den nötigen Gerätschaften eingedeckt und unsere ersten Fehltritte und Fortschritte erlebt.
Seit einiger Zeit finden wir unser Bier auch gut genug, dass wir es nicht nur an angeheiterte Kollegen
ausschenken, sondern auch ganz bewusst an Freunde und Bekannte zum degustieren geben.
</p>
<p>Josua & Matthias</p>
</section>
</article>
</body>
<script>
window.onload = function(){
var elements = document.querySelectorAll('p');
for (var i=0; i<elements.length; i++){
elements[i].innerHTML = elements[i].innerHTML.replace(/([.?!]\s+)(\w)/g, "$1<span class='followup-first-letter'>$2</span>")
}
}
</script>
</html>
Display the source blob
Display the rendered blob
Raw
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment