You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
117 lines
3.1 KiB
117 lines
3.1 KiB
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
|
<title>Blockstart Template</title>
|
|
|
|
<link rel="stylesheet" href="/blockstart/blockstart.css">
|
|
|
|
<style>
|
|
</style>
|
|
|
|
</head>
|
|
|
|
<body>
|
|
<block class="solid horizontal pad" style="--value: 0; --text: 9; --spacing: space-around; width: unset;">
|
|
<a href="/blockstart/demos/">vimeo</a>
|
|
<div class="horizontal" style="--spacing: end;">
|
|
<button>New video</button>
|
|
</div>
|
|
</block>
|
|
|
|
<block class="center-text solid pad" style="--value: 0; --text: 9;">
|
|
<h1>Scrolling thing</h1>
|
|
<h1>With Vimeo</h1>
|
|
|
|
<block class="center horizontal sized" style="--w: 60vw; --text: 0">
|
|
<button>See plans</button>
|
|
<button>Join for free</button>
|
|
</block>
|
|
</block>
|
|
|
|
<block class="pad">
|
|
<shape style="--w: 450px; --h: 500px">
|
|
<h1>Scroll Sample</h1>
|
|
</shape>
|
|
</block>
|
|
|
|
<block class="pad">
|
|
<p>Tofu single-origin coffee cray offal gastropub hoodie edison bulb fam flannel pug tumblr celiac.</p>
|
|
|
|
<p>Cardigan raclette tbh, kitsch lomo fanny pack vegan.</p>
|
|
</block>
|
|
|
|
<block class="pad solid" style="--pad: 2rem; --value: 0; --text: 9;">
|
|
<shape class="border" style="--value: 9; --text: 0; --h: 400px; --w: 300px;">
|
|
<h1>Video Marketing</h1>
|
|
</shape>
|
|
<shape class="border" style="--value: 9; --text: 0; --h: 400px; --w: 300px;">
|
|
<h1>Video Marketing</h1>
|
|
</shape>
|
|
<shape class="border" style="--value: 9; --text: 0; --h: 400px; --w: 300px;">
|
|
<h1>Video Marketing</h1>
|
|
</shape>
|
|
</block>
|
|
|
|
<block class="sized center pad" style="--w: 80vw;">
|
|
<block class="center-text">
|
|
<h4>INTEGRATIONS</h4>
|
|
<p>Cardigan raclette tbh, kitsch lomo fanny pack vegan.</p>
|
|
</block>
|
|
|
|
<grid class="center sized pad" style="--cols: 1fr 1fr; --pad: 2rem">
|
|
<block class="center-text pad">
|
|
<h1>Company</h1>
|
|
</block>
|
|
<block class="center-text pad">
|
|
<h1>Company</h1>
|
|
</block>
|
|
<block class="center-text pad">
|
|
<h1>Company</h1>
|
|
</block>
|
|
<block class="center-text pad">
|
|
<h1>Company</h1>
|
|
</block>
|
|
<block class="center-text pad">
|
|
<h1>Company</h1>
|
|
</block>
|
|
<block class="center-text pad">
|
|
<h1>Company</h1>
|
|
</block>
|
|
<block class="center-text pad">
|
|
<h1>Company</h1>
|
|
</block>
|
|
<block class="center-text pad">
|
|
<h1>Company</h1>
|
|
</block>
|
|
<block class="center-text pad" style="grid-column: 1 / span 2">
|
|
<h1>Company</h1>
|
|
</block>
|
|
</grid>
|
|
</block>
|
|
|
|
<block class="pad solid center-text" style="--value: 0; --text: 9; --pad: 2rem;">
|
|
<h1>Flexitarian Vice Poutine Synth</h1>
|
|
<hr>
|
|
|
|
<shape style="--h: 400px; --value: 5;">
|
|
<h1>Scroller</h1>
|
|
</shape>
|
|
|
|
<hr>
|
|
|
|
<h1>Ready to unlock the power of video?</h1>
|
|
|
|
<block class="center" style="--text: 0;">
|
|
<button>See plans</button>
|
|
<button>Join for free</button>
|
|
</block>
|
|
</block>
|
|
|
|
<block class="solid sized center" style="--value: 7; --h: 600px;">
|
|
<h1>Footer</h1>
|
|
</block>
|
|
</body>
|
|
</html>
|
|
|