mirror of
https://github.com/jgthms/bulma.git
synced 2024-10-17 09:04:18 +00:00
afcdb7dbcc
* Update navbar variables in component docs page * Update pagination variables in component docs page * Update tabs variables in component docs page * Update button variables in element docs page * Update table variables in element docs page * Update title variables in element docs page * Update variables template to support layout * Add section variables in relevant docs page * Add footer variables in relevant docs page * Update variables template to support custom messages * Add form generic variables in relevant docs page * Update derived variables in relevant docs page * Add generic variables to variables docs page * Update sass files count in docs Modular page
51 lines
1.2 KiB
HTML
51 lines
1.2 KiB
HTML
---
|
|
title: Section
|
|
layout: documentation
|
|
doc-tab: layout
|
|
doc-subtab: section
|
|
variables:
|
|
- name: $section-padding
|
|
value: 3rem 1.5rem
|
|
- name: $section-padding-medium
|
|
value: 9rem 1.5rem
|
|
- name: $section-padding-large
|
|
value: 18rem 1.5rem
|
|
---
|
|
|
|
{% include subnav-layout.html %}
|
|
|
|
<section class="section">
|
|
<div class="container">
|
|
<h1 class="title">Section</h1>
|
|
<h2 class="subtitle">
|
|
A simple container to divide your page into <strong>sections</strong>, like the one you're currently reading
|
|
</h2>
|
|
|
|
<hr>
|
|
|
|
<div class="content">
|
|
<p>Use sections as <strong>direct</strong> children of <code>body</code>.</p>
|
|
</div>
|
|
|
|
{% highlight html %}
|
|
<body>
|
|
<section class="section">
|
|
<div class="container">
|
|
<h1 class="title">Section</h1>
|
|
<h2 class="subtitle">
|
|
A simple container to divide your page into <strong>sections</strong>, like the one you're currently reading
|
|
</h2>
|
|
</div>
|
|
</section>
|
|
</body>
|
|
{% endhighlight %}
|
|
|
|
<div class="content">
|
|
<p>You can use the modifiers <code>is-medium</code> and <code>is-large</code> to change the <strong>spacing</strong>.</p>
|
|
</div>
|
|
|
|
{% include variables.html layout=true %}
|
|
|
|
</div>
|
|
</section>
|