Skip to content
Snippets Groups Projects
Commit 15917e6d authored by Tim Fechner's avatar Tim Fechner
Browse files

Update to bulma 0.3.2

parent c2d6e2f8
No related branches found
No related tags found
No related merge requests found
Expand all Show whitespace changes
Inline Side-by-side
Showing
with 1036 additions and 1359 deletions
hshassets/assets/sass/_init.scss
+ 1
− 1
View file @ 15917e6d
// Import some awesome libraries here
@import 'lib/bulma-0.3.1/bulma.sass';
@import 'lib/bulma-0.3.2/bulma.sass';
@import 'lib/font-awesome-4.7.0/scss/font-awesome.scss';
@import 'lib/animate.css-3.5.1/animate.scss';
......
hshassets/assets/sass/lib/bulma-0.3.1/css/bulma.css.map deleted 100644 → 0
+ 0
− 49
View file @ c2d6e2f8
This diff is collapsed.
hshassets/assets/sass/lib/bulma-0.3.1/docs/documentation/grid.html deleted 100644 → 0
+ 0
− 749
View file @ c2d6e2f8
This diff is collapsed.
hshassets/assets/sass/lib/bulma-0.3.1/docs/documentation/navbar.html deleted 100644 → 0
+ 0
− 257
View file @ c2d6e2f8
---
layout: documentation
doc-tab: navbar
---
<section class="section">
<div class="container">
<h1 class="title">Navbar</h1>
<h2 class="subtitle">A multi-purpose <strong>horizontal navbar</strong>, which can contain almost any other element</h2>
<hr>
<div class="content">
<p>The <strong>structure</strong> of a navbar is the following:</p>
<ul>
<li>
<code>navbar</code>: main container
<ul>
<li><code>navbar-left</code> for the left side</li>
<li>
<code>navbar-right</code> for the right side
<ul>
<li><code>navbar-item</code> for each individual element</li>
</ul>
</li>
</ul>
</li>
</ul>
<p>In a <code>navbar-item</code>, you can then insert almost <em>anything</em> you want: a title, a button, a text input, or just simple text. No matter what elements you put inside a Bulma <code>navbar</code>, they will always be <strong>vertically aligned</strong>.</p>
</div>
<div class="structure">
<nav class="navbar structure-item is-structure-container" title="navbar">
<div class="navbar-left structure-item" title="navbar-left">
<div class="navbar-item">
<p class="subtitle is-5">
<strong>123</strong> posts
</p>
</div>
<div class="navbar-item">
<p class="control has-addons">
<input class="input" type="text" placeholder="Find a post">
<button class="button">
Search
</button>
</p>
</div>
</div>
<div class="navbar-right structure-item" title="navbar-right">
<p class="navbar-item">
<strong>All</strong>
</p>
<p class="navbar-item">
<a>Published</a>
</p>
<p class="navbar-item">
<a>Drafts</a>
</p>
<p class="navbar-item">
<a>Deleted</a>
</p>
<p class="navbar-item">
<a class="button is-success">
New
</a>
</p>
</div>
</nav>
</div>
<div class="example">
<nav class="navbar">
<div class="navbar-left">
<div class="navbar-item">
<p class="subtitle is-5">
<strong>123</strong> posts
</p>
</div>
<div class="navbar-item">
<p class="control has-addons">
<input class="input" type="text" placeholder="Find a post">
<button class="button">
Search
</button>
</p>
</div>
</div>
<div class="navbar-right">
<p class="navbar-item">
<strong>All</strong>
</p>
<p class="navbar-item">
<a>Published</a>
</p>
<p class="navbar-item">
<a>Drafts</a>
</p>
<p class="navbar-item">
<a>Deleted</a>
</p>
<p class="navbar-item">
<a class="button is-success">
New
</a>
</p>
</div>
</nav>
</div>
{% highlight html %}
<!-- Main container -->
<nav class="navbar">
<!-- Left side -->
<div class="navbar-left">
<div class="navbar-item">
<p class="subtitle is-5">
<strong>123</strong> posts
</p>
</div>
<div class="navbar-item">
<p class="control has-addons">
<input class="input" type="text" placeholder="Find a post">
<button class="button">
Search
</button>
</p>
</div>
</div>
<!-- Right side -->
<div class="navbar-right">
<p class="navbar-item"><strong>All</strong></p>
<p class="navbar-item"><a>Published</a></p>
<p class="navbar-item"><a>Drafts</a></p>
<p class="navbar-item"><a>Deleted</a></p>
<p class="navbar-item"><a class="button is-success">New</a></p>
</div>
</nav>
{% endhighlight %}
<hr>
<h3 class="title">Centered navbar</h3>
<div class="content">
If you want a <strong>centered navbar</strong>, you can use as many <code>navbar-item</code> as you want, as long as they are <strong>direct</strong> children of the <code>navbar</code> container.
</div>
<div class="example">
<nav class="navbar">
<div class="navbar-item has-text-centered">
<p class="heading">Tweets</p>
<p class="title">3,456</p>
</div>
<div class="navbar-item has-text-centered">
<p class="heading">Following</p>
<p class="title">123</p>
</div>
<div class="navbar-item has-text-centered">
<p class="heading">Followers</p>
<p class="title">456K</p>
</div>
<div class="navbar-item has-text-centered">
<p class="heading">Likes</p>
<p class="title">789</p>
</div>
</nav>
</div>
{% highlight html %}
<nav class="navbar">
<div class="navbar-item has-text-centered">
<p class="heading">Tweets</p>
<p class="title">3,456</p>
</div>
<div class="navbar-item has-text-centered">
<p class="heading">Following</p>
<p class="title">123</p>
</div>
<div class="navbar-item has-text-centered">
<p class="heading">Followers</p>
<p class="title">456K</p>
</div>
<div class="navbar-item has-text-centered">
<p class="heading">Likes</p>
<p class="title">789</p>
</div>
</nav>
{% endhighlight %}
<div class="example">
<nav class="navbar">
<p class="navbar-item has-text-centered">
<a class="link is-info">Home</a>
</p>
<p class="navbar-item has-text-centered">
<a class="link is-info">Menu</a>
</p>
<p class="navbar-item has-text-centered">
<img src="{{ site.url }}/images/bulma-type.png" alt="" style="height: 33px;">
</p>
<p class="navbar-item has-text-centered">
<a class="link is-info">Reservations</a>
</p>
<p class="navbar-item has-text-centered">
<a class="link is-info">Contact</a>
</p>
</nav>
</div>
{% highlight html %}
<nav class="navbar">
<p class="navbar-item has-text-centered">
<a class="link is-info">Home</a>
</p>
<p class="navbar-item has-text-centered">
<a class="link is-info">Menu</a>
</p>
<p class="navbar-item has-text-centered">
<img src="{{ site.url }}/images/bulma-type.png" alt="" style="height: 33px;">
</p>
<p class="navbar-item has-text-centered">
<a class="link is-info">Reservations</a>
</p>
<p class="navbar-item has-text-centered">
<a class="link is-info">Contact</a>
</p>
</nav>
{% endhighlight %}
<hr>
<h3 class="title">Mobile navbar</h3>
<div class="content">
By default, for space concerns, the navbar is vertical on mobile. If you want the navbar to be horizontal on mobile as well, add the <code>is-mobile</code> modifier on the <code>navbar</code> container.
</div>
<div class="example">
<nav class="navbar is-mobile">
<div class="navbar-item has-text-centered">
<p class="heading">Tweets</p>
<p class="title">3,456</p>
</div>
<div class="navbar-item has-text-centered">
<p class="heading">Following</p>
<p class="title">123</p>
</div>
<div class="navbar-item has-text-centered">
<p class="heading">Followers</p>
<p class="title">456K</p>
</div>
<div class="navbar-item has-text-centered">
<p class="heading">Likes</p>
<p class="title">789</p>
</div>
</nav>
</div>
</div>
</section>
hshassets/assets/sass/lib/bulma-0.3.1/CHANGELOG.md → hshassets/assets/sass/lib/bulma-0.3.2/CHANGELOG.md
+ 9
− 0
View file @ 15917e6d
# Bulma Changelog
## 0.3.2
* Fix #478
## 0.3.1
* Fix #441
* Fix #443
## 0.3.0
* Use `rem` and `em` (!)
......
hshassets/assets/sass/lib/bulma-0.3.1/bower.json → hshassets/assets/sass/lib/bulma-0.3.2/bower.json
+ 1
− 1
View file @ 15917e6d
{
"name": "bulma",
"version": "0.3.1",
"version": "0.3.2",
"homepage": "http://bulma.io",
"authors": [
"jgthms <bbxdesign@gmail.com>"
......
hshassets/assets/sass/lib/bulma-0.3.1/bulma.sass → hshassets/assets/sass/lib/bulma-0.3.2/bulma.sass
+ 1
− 1
View file @ 15917e6d
/*! bulma.io v0.3.1 | MIT License | github.com/jgthms/bulma */
/*! bulma.io v0.3.2 | MIT License | github.com/jgthms/bulma */
@charset "utf-8"
@import "sass/utilities/_all"
......
hshassets/assets/sass/lib/bulma-0.3.2/css/bulma.css.map 0 → 100644
+ 1
− 0
View file @ 15917e6d
This diff is collapsed.
hshassets/assets/sass/lib/bulma-0.3.1/docs/_config.yml → hshassets/assets/sass/lib/bulma-0.3.2/docs/_config.yml
+ 2
− 2
View file @ 15917e6d
......@@ -13,6 +13,6 @@ fontawesome: https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-aweso
# Variables
documentation: "/documentation/overview/start/"
download: https://github.com/jgthms/bulma/archive/0.3.1.zip
download: https://github.com/jgthms/bulma/archive/0.3.2.zip
github: https://github.com/jgthms/bulma
version: 0.3.1
version: 0.3.2
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment