mirror of
https://github.com/jenil/chota.git
synced 2023-08-10 21:13:07 +03:00
51 lines
1.5 KiB
HTML
51 lines
1.5 KiB
HTML
|
<section id="card">
|
||
|
|
<h4>Card</h4>
|
||
|
|
<p>The <code>.card</code> element is simply a container with a shadow, a border, a radius, and some padding.</p>
|
||
|
|
<p>You can add a simple <code>header</code> element with a heading tag in it to add a heading to the card.</p>
|
||
|
|
<div class="row is-center">
|
||
|
|
<div class="col">
|
||
|
|
<div class="card">
|
||
|
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloremque cumque velit id.</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col">
|
||
|
|
{% highlight html %}
|
||
|
|
<div class="card">
|
||
|
|
<p>Lorem ipsum ... nostrud exercit.</p>
|
||
|
|
</div>
|
||
|
|
{% endhighlight %}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<hr>
|
||
|
|
<div class="row is-center">
|
||
|
|
<div class="col-6">
|
||
|
|
<div class="card">
|
||
|
|
<header>
|
||
|
|
<h4>Card title</h4>
|
||
|
|
</header>
|
||
|
|
<p>A nisi ullam impedit molestiae, sapiente id, numquam accusantium eius cum, iste eum iusto blanditiis doloribus beatae. Molestias iste explicabo libero nam, voluptas harum ipsum quod velit enim. Quae, cupiditate?</p>
|
||
|
|
<footer class="is-right">
|
||
|
|
<a href="#!" class="button primary">Submit</a>
|
||
|
|
<a href="#!" class="button">Cancel</a>
|
||
|
|
</footer>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row is-center">
|
||
|
|
<div class="col">
|
||
|
|
{% highlight html %}
|
||
|
|
<div class="card">
|
||
|
|
<header>
|
||
|
|
<h4>Card title</h4>
|
||
|
|
</header>
|
||
|
|
<p>A nisi ullam ... cupiditate?</p>
|
||
|
|
<footer class="is-right">
|
||
|
|
<a class="button primary">Submit</a>
|
||
|
|
<a class="button">Cancel</a>
|
||
|
|
</footer>
|
||
|
|
</div>
|
||
|
|
{% endhighlight %}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|