mirror of
https://github.com/LukasJoswiak/etch.git
synced 2024-05-17 21:38:32 -04:00
94 lines
3.6 KiB
HTML
94 lines
3.6 KiB
HTML
<!DOCTYPE html>
|
|
<html><head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="description" content="Your site description">
|
|
|
|
<link rel="shortcut icon" href="https://lukasjoswiak.github.io/etch/favicon.ico">
|
|
|
|
<link rel="stylesheet" href="/etch/css/style.min.css">
|
|
|
|
<title>Rich Content</title>
|
|
</head>
|
|
<body><header id="banner">
|
|
<h2><a href="https://lukasjoswiak.github.io/etch/">Website Name</a></h2>
|
|
<nav>
|
|
<ul>
|
|
<li>
|
|
<a href="/etch/" title="posts">posts</a>
|
|
</li><li>
|
|
<a href="/etch/about/" title="about">about</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
</header>
|
|
<main id="content">
|
|
<article>
|
|
<header id="post-header">
|
|
<h1>Rich Content</h1>
|
|
<div>
|
|
<time>March 10, 2019</time>
|
|
</div>
|
|
</header><p>Hugo ships with several <a href="https://gohugo.io/content-management/shortcodes/#use-hugo-s-built-in-shortcodes">Built-in Shortcodes</a> for rich content, along with a <a href="https://gohugo.io/about/hugo-and-gdpr/">Privacy Config</a> and a set of Simple Shortcodes that enable static and no-JS versions of various social media embeds.</p>
|
|
<hr>
|
|
<h2 id="youtube-privacy-enhanced-shortcode">YouTube Privacy Enhanced Shortcode</h2>
|
|
|
|
<div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;">
|
|
<iframe src="https://www.youtube.com/embed/ZJthWmvUzzc" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:0;" allowfullscreen title="YouTube Video"></iframe>
|
|
</div>
|
|
|
|
<br>
|
|
<hr>
|
|
<h2 id="twitter-shortcode">Twitter Shortcode</h2>
|
|
<blockquote class="twitter-tweet"><p lang="en" dir="ltr">“In addition to being more logical, asymmetry has the advantage that its complete appearance is far more optically effective than symmetry.”<br>— Jan Tschichold <a href="https://t.co/gcv7SrhvJb">pic.twitter.com/gcv7SrhvJb</a></p>— Graphic Design History (@DesignReviewed) <a href="https://twitter.com/DesignReviewed/status/1085870671291310081?ref_src=twsrc%5Etfw">January 17, 2019</a></blockquote>
|
|
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
|
|
|
|
<br>
|
|
<hr>
|
|
<h2 id="vimeo-simple-shortcode">Vimeo Simple Shortcode</h2>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<style>
|
|
.__h_video {
|
|
position: relative;
|
|
padding-bottom: 56.23%;
|
|
height: 0;
|
|
overflow: hidden;
|
|
width: 100%;
|
|
background: #000;
|
|
}
|
|
.__h_video img {
|
|
width: 100%;
|
|
height: auto;
|
|
color: #000;
|
|
}
|
|
.__h_video .play {
|
|
height: 72px;
|
|
width: 72px;
|
|
left: 50%;
|
|
top: 50%;
|
|
margin-left: -36px;
|
|
margin-top: -36px;
|
|
position: absolute;
|
|
cursor: pointer;
|
|
}
|
|
</style>
|
|
|
|
|
|
<div class="s_video_simple __h_video">
|
|
<a href="https://vimeo.com/4.8912912e+07" rel="noopener" target="_blank">
|
|
|
|
|
|
<img src="https://i.vimeocdn.com/video/337401969-979f0cc9f55fdf305fb8984e90d92639ec9d7ecc4c9dfbc6536e28edb43784ce-d_640" srcset="https://i.vimeocdn.com/video/337401969-979f0cc9f55fdf305fb8984e90d92639ec9d7ecc4c9dfbc6536e28edb43784ce-d_640 1x, https://i.vimeocdn.com/video/337401969-979f0cc9f55fdf305fb8984e90d92639ec9d7ecc4c9dfbc6536e28edb43784ce-d_640 2x" alt="Sing Jan Swing - Kinetic Type">
|
|
<div class="play"><svg version="1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 61 61"><circle cx="30.5" cy="30.5" r="30.5" opacity=".8" fill="#000"></circle><path d="M25.3 19.2c-2.1-1.2-3.8-.2-3.8 2.2v18.1c0 2.4 1.7 3.4 3.8 2.2l16.6-9.1c2.1-1.2 2.1-3.2 0-4.4l-16.6-9z" fill="#fff"></path></svg></div></a></div></article>
|
|
|
|
</main><footer id="footer">
|
|
Copyright © 2022 Your Name
|
|
</footer>
|
|
</body>
|
|
</html>
|