bulma/docs/_includes/index/intro.html

53 lines
2.2 KiB
HTML
Raw Normal View History

2017-10-10 16:24:19 +00:00
<section class="hero is-medium intro">
<div class="hero-body">
<div class="container">
<div class="intro-columns">
<div class="intro-column is-content">
<div class="intro-content">
<h1 class="title intro-title">
<strong>Bulma</strong> is a free and open source <strong>CSS</strong> framework based on <strong>Flexbox</strong>.
</h1>
<div id="ghbtns" class="intro-ghbtns block">
<iframe src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
<iframe src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=fork&count=false&size=large" frameborder="0" scrolling="0" width="80px" height="30px"></iframe>
</div>
{% assign npmInstall = 'npm install bulma' %}
<pre id="npm" class="intro-npm"><code>{{ npmInstall }}</code><code id="npmCopy" class="intro-npm-copy" data-clipboard-text="{{ npmInstall }}">copy</code></pre>
<nav class="intro-buttons">
<a class="button is-primary is-large" href="{{ site.download }}">
<span>
<strong>Download</strong>
<small>v{{ site.version }}</small>
</span>
</a>
<a class="button is-light is-large" href="{{ site.documentation }}">
<span>
<span>View</span>
<strong>docs</strong>
</span>
</a>
</nav>
</div>
</div>
<div class="intro-column is-video">
<div class="intro-video">
2017-10-10 16:48:01 +00:00
<div class="intro-shadow"></div>
<div class="intro-spinner"></div>
2017-10-10 16:24:19 +00:00
<div class="intro-iframe">
2017-10-10 16:48:01 +00:00
<iframe id="introVimeo" src="https://player.vimeo.com/video/232485795?color=00d1b2" width="640" height="338" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
2017-10-10 16:24:19 +00:00
</div>
</div>
</div>
</div>
<div class="intro-carbon">
{% include carbon.html %}
</div>
</div>
</div>
</section>