mirror of
https://github.com/ClickHouse/ClickHouse.git
synced 2024-10-04 15:40:49 +00:00
305 lines
12 KiB
HTML
305 lines
12 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="en">
|
|||
|
|
<head>
|
|||
|
|
<title>Ribbon theme for Shower</title>
|
|||
|
|
<meta charset="utf-8">
|
|||
|
|
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
|||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
|||
|
|
<link rel="stylesheet" href="styles/screen-16x10.css">
|
|||
|
|
</head>
|
|||
|
|
<body class="shower list">
|
|||
|
|
<header class="caption">
|
|||
|
|
<h1>Presentation Title</h1>
|
|||
|
|
<p><a href="">Yours Truly</a>, Famous Inc.</p>
|
|||
|
|
</header>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2>Slide Header</h2>
|
|||
|
|
<p>Echo Park 8-bit sustainable umami deep v Kickstarter. DIY cliche typewriter brunch, Odd Future sriracha pickled aesthetic. Farm-to-table bespoke fingerstache, kale chips umami brunch letterpress.</p>
|
|||
|
|
<p>Whatever authentic disrupt, you probably haven't heard of them direct trade mlkshk Etsy. Gluten-free roof party plaid four loko quinoa.</p>
|
|||
|
|
<p class="note">Echo Park 8-bit sustainable umami deep v Kickstarter.</p>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2>Inline Elements</h2>
|
|||
|
|
<p>Retro meh brunch <a href="">aesthetic</a> Cosby sweater Shoreditch. Banksy Tumblr <strong>sriracha</strong>, flexitarian pug chia master cleanse vinyl <em>wayfarers</em> fanny pack bespoke Helvetica <b>roof</b> party. Messenger bag retro cred <i>Portland</i> next level. Yr stumptown Schlitz Carles deep v small batch. Hella sustainable messenger bag, <mark>leggings</mark> skateboard literally<sup>1</sup> bicycle rights H<sub>2</sub>0 mumblecore banh mi DIY VHS. Semiotics four loko street art asymmetrical. Asymmetrical <code><paleo></code> you probably haven’t heard of.</p>
|
|||
|
|
<footer class="footer">
|
|||
|
|
<p>Retro meh brunch <a href="">aesthetic</a> Cosby sweater Shoreditch. Banksy Tumblr <strong>sriracha</strong>, flexitarian pug chia master cleanse vinyl <em>wayfarers</em> fanny pack bespoke Helvetica <b>roof</b> party. Messenger bag retro cred <i>Portland</i> next level. Yr stumptown Schlitz Carles deep v small batch. Hella sustainable messenger bag, <mark>leggings</mark> skateboard literally<sup>1</sup> bicycle rights H<sub>2</sub>0 mumblecore banh mi DIY VHS. Semiotics four loko street art asymmetrical. Asymmetrical <code><paleo></code> you probably haven’t heard of.</p>
|
|||
|
|
</footer>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2>Quotes</h2>
|
|||
|
|
<blockquote>
|
|||
|
|
<p>Flannel bicycle rights locavore selfies skateboard. Authentic fanny pack paleo four loko bespoke. Artisan tattooed chia XOXO ennui, lomo disrupt 8-bit art party Tumblr scenester.</p>
|
|||
|
|
</blockquote>
|
|||
|
|
<figure>
|
|||
|
|
<blockquote>
|
|||
|
|
<p>Post-ironic fashion axe flexitarian, Tonx narwhal messenger bag Tumblr. Portland gentrify deep v kale chips literally.</p>
|
|||
|
|
</blockquote>
|
|||
|
|
<figcaption>Yours Truly</figcaption>
|
|||
|
|
</figure>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2>Nested Lists</h2>
|
|||
|
|
<ol>
|
|||
|
|
<li>Literally viral vegan, ugh drinking vinegar photo booth</li>
|
|||
|
|
<li>Wes Anderson chillwave Marfa pour-over Etsy banh mi</li>
|
|||
|
|
<li>Ethnic polaroid lo-fi iPhone ennui
|
|||
|
|
<ul>
|
|||
|
|
<li>Yr wayfarers before they sold out Kickstarter asymmetrical</li>
|
|||
|
|
<li>Irony flexitarian readymade quinoa, kogi bespoke meggings narwhal</li>
|
|||
|
|
<li>Skateboard Etsy twee artisan Echo Park</li>
|
|||
|
|
</ul>
|
|||
|
|
</li>
|
|||
|
|
<li>Tonx kitsch fingerstache readymade, retro single-origin coffee</li>
|
|||
|
|
</ol>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2>Block Lists</h2>
|
|||
|
|
<ul>
|
|||
|
|
<li>Retro meh brunch aesthetic Cosby sweater Shoreditch. Banksy Tumblr sriracha, flexitarian pug chia master cleanse vinyl wayfarers fanny pack.</li>
|
|||
|
|
<li>Messenger bag retro cred Portland next level. Yr stumptown Schlitz Carles deep v small batch. Hella sustainable messenger bag.</li>
|
|||
|
|
<li>Leggings skateboard literally1 bicycle rights H20 mumblecore banh mi DIY VHS. Semiotics four loko street art asymmetrical. Asymmetrical paleo you probably haven’t heard of.</li>
|
|||
|
|
</ul>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2>Latin and Cyrillic List Bullets</h2>
|
|||
|
|
<ul lang="en">
|
|||
|
|
<li>Occupy locavore blog, mustache you probably haven't heard of them</li>
|
|||
|
|
<li>Skateboard pork belly aesthetic hoodie selfies brunch</li>
|
|||
|
|
<li>Food truck gluten-free disrupt Portland</li>
|
|||
|
|
</ul>
|
|||
|
|
<ul lang="ru">
|
|||
|
|
<li>Helvetica narwhal drinking vinegar chillwave, post-ironic ennui</li>
|
|||
|
|
<li>Cray pug paleo retro, Echo Park narwhal Wes Anderson</li>
|
|||
|
|
<li>Disrupt Williamsburg fixie, shabby chic bicycle rights hashtag kogi</li>
|
|||
|
|
</ul>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide grid">
|
|||
|
|
<h2>Two Columns</h2>
|
|||
|
|
<p class="double">Echo Park 8-bit sustainable umami deep v Kickstarter. DIY cliche typewriter brunch, Odd Future sriracha pickled aesthetic. Farm-to-table bespoke fingerstache, kale chips umami brunch American Apparel letterpress. Whatever authentic disrupt, you probably haven't heard of them direct trade mlkshk Etsy. Gluten-free roof party plaid American Apparel four loko quinoa. Echo Park 8-bit sustainable.</p>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide grid">
|
|||
|
|
<h2>Three Columns</h2>
|
|||
|
|
<p class="triple">Echo Park 8-bit sustainable umami deep v Kickstarter. DIY cliche typewriter brunch, Odd Future sriracha pickled aesthetic. Farm-to-table bespoke fingerstache, kale chips umami brunch American Apparel letterpress. Whatever authentic disrupt, you probably haven't heard of them direct trade mlkshk Etsy. Gluten-free roof party plaid American Apparel four loko quinoa. Echo Park 8-bit sustainable.</p>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2>Simple Table</h2>
|
|||
|
|
<table>
|
|||
|
|
<tr>
|
|||
|
|
<th scope="col">Gentrify</th>
|
|||
|
|
<th>Twee</th>
|
|||
|
|
<th>Artisan</th>
|
|||
|
|
<th>Banksy</th>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<th scope="row">Messenger</th>
|
|||
|
|
<td>Mixtape</td>
|
|||
|
|
<td>Small batch</td>
|
|||
|
|
<td>Bicycle rights</td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<th scope="row">Meggings</th>
|
|||
|
|
<td>Freegan</td>
|
|||
|
|
<td>Retro biodiesel</td>
|
|||
|
|
<td>Slow-carb</td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<th scope="row">Vegan</th>
|
|||
|
|
<td>Occupy</td>
|
|||
|
|
<td>Normcore</td>
|
|||
|
|
<td>Put a bird on it</td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<th scope="row">Next level</th>
|
|||
|
|
<td>Selfies</td>
|
|||
|
|
<td>Sustainable</td>
|
|||
|
|
<td>Organic</td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<th scope="row">Umami</th>
|
|||
|
|
<td>Asymmetrical</td>
|
|||
|
|
<td>Keytar</td>
|
|||
|
|
<td>Craft beer</td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<th scope="row">Biodiesel</th>
|
|||
|
|
<td>Haven’t heard</td>
|
|||
|
|
<td>Skateboard</td>
|
|||
|
|
<td>Farm-to-table</td>
|
|||
|
|
</tr>
|
|||
|
|
</table>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2>Striped Table</h2>
|
|||
|
|
<table class="striped">
|
|||
|
|
<tr>
|
|||
|
|
<th scope="col">Gentrify</th>
|
|||
|
|
<th>Twee</th>
|
|||
|
|
<th>Artisan</th>
|
|||
|
|
<th>Banksy</th>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<th scope="row">Messenger</th>
|
|||
|
|
<td>Mixtape</td>
|
|||
|
|
<td>Small batch</td>
|
|||
|
|
<td>Bicycle rights</td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<th scope="row">Meggings</th>
|
|||
|
|
<td>Freegan</td>
|
|||
|
|
<td>Retro biodiesel</td>
|
|||
|
|
<td>Slow-carb</td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<th scope="row">Vegan</th>
|
|||
|
|
<td>Occupy</td>
|
|||
|
|
<td>Normcore</td>
|
|||
|
|
<td>Put a bird on it</td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<th scope="row">Next level</th>
|
|||
|
|
<td>Selfies</td>
|
|||
|
|
<td>Sustainable</td>
|
|||
|
|
<td>Organic</td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<th scope="row">Umami</th>
|
|||
|
|
<td>Asymmetrical</td>
|
|||
|
|
<td>Keytar</td>
|
|||
|
|
<td>Craft beer</td>
|
|||
|
|
</tr>
|
|||
|
|
<tr>
|
|||
|
|
<th scope="row">Biodiesel</th>
|
|||
|
|
<td>Haven’t heard</td>
|
|||
|
|
<td>Skateboard</td>
|
|||
|
|
<td>Farm-to-table</td>
|
|||
|
|
</tr>
|
|||
|
|
</table>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2>Plain Code Listing</h2>
|
|||
|
|
<pre><code><html lang="en">
|
|||
|
|
<mark><head></mark> <span class="comment"><!--Comment--></span>
|
|||
|
|
<title>Shower</title>
|
|||
|
|
<meta charset="<mark class="important">UTF-8</mark>">
|
|||
|
|
<link rel="stylesheet" href="screen.css">
|
|||
|
|
<script src="script.js"></script>
|
|||
|
|
<mark></head></mark></code></pre>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2>Numbered Code Listing</h2>
|
|||
|
|
<pre>
|
|||
|
|
<code><html lang="en"></code>
|
|||
|
|
<code><mark><head></mark> <span class="comment"><!--Comment--></span></code>
|
|||
|
|
<code> <title>Shower</title></code>
|
|||
|
|
<code> <meta charset="<mark class="important">UTF-8</mark>"></code>
|
|||
|
|
<code> <link rel="stylesheet" href="screen.css"></code>
|
|||
|
|
<code> <script src="script.js"></script></code>
|
|||
|
|
<code><mark></head></mark></code>
|
|||
|
|
</pre>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2>Highlighted Code Lines</h2>
|
|||
|
|
<pre>
|
|||
|
|
<code><html lang="en"></code>
|
|||
|
|
<code class="mark"><head> <span class="comment"><!--Comment--></span></code>
|
|||
|
|
<code> <title>Shower</title></code>
|
|||
|
|
<code> <meta charset="<mark class="important">UTF-8</mark>"></code>
|
|||
|
|
<code> <link rel="stylesheet" href="screen.css"></code>
|
|||
|
|
<code> <script src="script.js"></script></code>
|
|||
|
|
<code class="mark"></head></code>
|
|||
|
|
</pre>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2>Hidden Code Steps</h2>
|
|||
|
|
<pre>
|
|||
|
|
<code class="next"><html lang="en"></code>
|
|||
|
|
<code class="next"><mark><head></mark> <span class="comment"><!--Comment--></span></code>
|
|||
|
|
<code class="next"> <title>Shower</title></code>
|
|||
|
|
<code class="next"> <meta charset="<mark class="important">UTF-8</mark>"></code>
|
|||
|
|
<code class="next"> <link rel="stylesheet" href="screen.css"></code>
|
|||
|
|
<code class="next"> <script src="script.js"></script></code>
|
|||
|
|
<code class="next"><mark></head></mark></code>
|
|||
|
|
</pre>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2>Highlighted Code Steps</h2>
|
|||
|
|
<pre>
|
|||
|
|
<code class="mark next"><html lang="en"></code>
|
|||
|
|
<code><head> <span class="comment"><!--Comment--></span></code>
|
|||
|
|
<code class="mark next"> <title>Shower</title></code>
|
|||
|
|
<code> <meta charset="<mark class="important">UTF-8</mark>"></code>
|
|||
|
|
<code class="mark next"> <link rel="stylesheet" href="screen.css"></code>
|
|||
|
|
<code> <script src="script.js"></script></code>
|
|||
|
|
<code class="mark next"></head></code>
|
|||
|
|
</pre>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide grid">
|
|||
|
|
<h2>Grid Slide</h2>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide white">
|
|||
|
|
<h2>White Slide</h2>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide black">
|
|||
|
|
<h2>Black Slide</h2>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2 class="shout">Shout</h2>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2 class="shout">Multiline<br>Shout</h2>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2 class="shout"><a href="">Linked Shout</a></h2>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2 class="shout grow">Growing Shout</h2>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2 class="shout shrink">Shrinking Shout</h2>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<figure>
|
|||
|
|
<img class="cover" src="pictures/exact.png" alt="">
|
|||
|
|
<figcaption class="white">Copyright © 2016 <a href="">Yours Truly</a>, Famous Inc.</figcaption>
|
|||
|
|
</figure>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<img class="cover" src="pictures/tall.png" alt="">
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<img class="cover" src="pictures/wide.png" alt="">
|
|||
|
|
</section>
|
|||
|
|
<section class="slide white">
|
|||
|
|
<img class="place top left" src="pictures/square.png" alt="">
|
|||
|
|
<img class="place top" src="pictures/square.png" alt="">
|
|||
|
|
<img class="place top right" src="pictures/square.png" alt="">
|
|||
|
|
<img class="place left" src="pictures/square.png" alt="">
|
|||
|
|
<img class="place" src="pictures/square.png" alt="">
|
|||
|
|
<img class="place right" src="pictures/square.png" alt="">
|
|||
|
|
<img class="place bottom left" src="pictures/square.png" alt="">
|
|||
|
|
<img class="place bottom" src="pictures/square.png" alt="">
|
|||
|
|
<img class="place bottom right" src="pictures/square.png" alt="">
|
|||
|
|
</section>
|
|||
|
|
<section class="slide" data-timing="00:03">
|
|||
|
|
<h2 class="shout">Timer</h2>
|
|||
|
|
</section>
|
|||
|
|
<section class="slide">
|
|||
|
|
<h2>List Navigation</h2>
|
|||
|
|
<ol>
|
|||
|
|
<li>Ennui keffiyeh thundercats</li>
|
|||
|
|
<li class="next">Jean shorts biodiesel</li>
|
|||
|
|
<li class="next">Terry richardson, swag blog</li>
|
|||
|
|
<li class="next">Locavore umami vegan helvetica</li>
|
|||
|
|
<li class="next">Fingerstache kale chips</li>
|
|||
|
|
</ol>
|
|||
|
|
<p class="next">Before they sold out master</p>
|
|||
|
|
</section>
|
|||
|
|
<div class="progress"></div>
|
|||
|
|
<footer class="badge">
|
|||
|
|
<a href="https://github.com/shower/shower">Fork me on GitHub</a>
|
|||
|
|
</footer>
|
|||
|
|
<script src="../../shower.min.js"></script>
|
|||
|
|
<!-- Copyright © 2016 Yours Truly, Famous Inc. -->
|
|||
|
|
</body>
|
|||
|
|
</html>
|