You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

142 lines
5.6 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>The Remote Roast</title>
<meta name="DC.title" content="The Remote Roast" />
<meta name="description" content="The Remote Roast Club, a rC3 assembly about coffee.">
<meta property="og:title" content="The Remote Roast">
<meta property="og:description" content="The Remote Roast Club, a rC3 assembly about coffee.">
<meta property="og:image" content="https://remoteroast.club/thumbnail.jpg">
<meta property="og:url" content="https://remoteroast.club/index.html">
<meta name="twitter:card" content="summary_large_image">
<style>
@font-face {
font-family: "Orbitron";
font-weight: 700;
font-display: swap;
font-style: normal;
src: url("orbitron-bold-webfont.woff") format("woff");
}
body {
max-width: calc(100vw - 2em);
width: 40em;
height: 100vh;
margin: 0 auto;
padding: 2em 0;
background: #221714;
color: #FEE;
font: 20px/1.4 mono;
text-align: center;
}
#logo {
width: 200px;
height: 200px;
}
h1,h2 {
font: bold 30px/1.4 Orbitron;
}
section {
text-align: justify;
margin-top: 3em;
}
a {
color: white;
}
a::after {
content: "";
display: inline-block;
width: .8em;
height: .8em;
margin: 0 0 .2em .2em;
background: transparent url(link.svg) center no-repeat;
}
.day {
display: inline-block;
width: 6em;
}
li {
margin: 1em 0;
}
@media screen and (max-width: 370px) {
.day { display: inline; width: auto; }
}
</style>
</head>
<body>
<header>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 624 624" version="1.1" id="logo">
<rect x="1.156" y="-0.188" width="576.313" height="576.343" fill="#000" />
<rect x="143" y="240" width="97" height="288" style="fill:#001b18" />
<rect x="528" y="432" width="96" height="192" style="fill:#001b18" />
<rect x="528" y="47" width="96" height="97" style="fill:#01a08f" />
<rect x="432" y="47" width="96" height="193" style="fill:#01a08f" />
<rect x="336" y="47" width="96" height="97" style="fill:#01a08f" />
<rect x="336" y="432" width="96" height="192" style="fill:#01a08f" />
<rect x="240" y="336" width="96" height="288" style="fill:#01a08f" />
<rect x="143" y="528" width="97" height="96" style="fill:#01564d" />
<rect x="528" y="143" width="96" height="289" style="fill:#01a08f" />
<rect x="432" y="528" width="96" height="96" style="fill:#01564d" />
<rect x="240" y="47" width="96" height="289" style="fill:#01564d" />
<rect x="432" y="240" width="96" height="288" style="fill:#02fae0" />
<rect x="336" y="143" width="96" height="290" style="fill:#02fae0" />
<text x="210" y="550" style="font: bold 140px Orbitron" fill="#fff" stroke="#01564d" stroke-width="8">R2C</text>
<rect fill="none" stroke="#fff" stroke-width="7.63px" x="1.156" y="-0.188" width="576.313" height="576.343" />
<g fill="none" stroke="#fff" stroke-width="1.2" stroke-linecap="round" style="transform: scale(15) translate(10px, 4px)">
<!-- coffee icon from https://feathericons.com/ -->
<path d="M18 8h1a4 4 0 0 1 0 8h-1"></path><path d="M2 8h16v9a4 4 0 0 1-4 4H6a4 4 0 0 1-4-4V8z"></path>
<line x1="6" y1="1" x2="6" y2="4"></line>
<line x1="10" y1="1" x2="10" y2="4"></line>
<line x1="14" y1="1" x2="14" y2="4"></line>
</g>
</svg>
<h1>The Remote Roast Club</h1>
</header>
<main>
<section name="what" id="what">
<header><h2>What?</h2></header>
<p>
This was an
<a rel="noopener" target="_blank" href="https://events.ccc.de/2012/10/22/assemblies/">assembly</a>
by a coffee enthusiast for coffee enthusiasts. People could chat about
topics from coffee beans, origins and varieties to brewing methods and
coffee robots. Two (technically three) workshops showed people how to
get the best out of their coffee with the equipment they already have.
</p>
</section>
<section name="where-to-find" id="where">
<header><h2>Where?</h2></header>
<p>
If you were live in the
<a rel="noopener" target="_blank" href="https://rc3.world/" title="rC3 world">rC3 World</a>
you would look for Remote Roast in the
<a rel="noopener" target="_blank" href="https://rc3.world/rc3/assemblies/all" title="List of assemblies on rC3">list of assemblies</a>
or
<a rel="noopener" target="_blank" href="https://rc3.world/rc3/assembly/remoteroast/" title="RemoteRostClub Assembly on rC3">go to the RemoteRostClub Assembly</a>
directly. All this probably doesn't work anymore.
</section>
<section name="events" id="events">
<header><h2>Events</h2></header>
<p>Currently no events planned.</p>
<ol>
<!-- EXAMPLE
<li>
<time datetime="2020-12-28 14:00:00.0+01:00"><span class="day">Monday</span> 14:00</time>
<time datetime="2020-12-28 14:30:00.0+01:00">14:30</time>
<a rel="noopener" target="_blank" href="https://rc3.world/rc3/event/howto-chemex/" title="RemoteRostClub Event: How to Chemex">HowTo: Chemex / V60 / Kalita Wave</a>
</li>
-->
</ol>
</section>
</main>
<script data-goatcounter="https://remoterost-club.goatcounter.com/count" async src="//gc.zgo.at/count.js"></script>
</body>
</html>