Ark/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma synced 2026-03-15 02:04:29 -07:00
Code Issues Packages Projects Releases Wiki Activity

Fix relative links

Browse Source
This commit is contained in:
Jeremy Thomas
2018-10-12 11:23:32 +01:00
parent 6fe3eb0b74
commit 957a45a50c
18 changed files with 57 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
docs/_posts/2017-08-03-list-of-tags.md
View File

@@ -12,8 +12,8 @@ The [tag](/documentation/elements/tag/) is a small but useful element that can b
A tag rarely comes on its own though, so Bulma now supports [list of tags](/documentation/elements/tag/#list-of-tags). The same way you can [group controls](together), you can now **group tags together** to form a list that can span multiple lines.
<figure>
<a href="/documentation/elements/tag/#list-of-tags">
<img src="/images/blog/list-of-tags.png" alt="List of tags in CSS" width="660" height="401">
<a href="{{ site.url }}/documentation/elements/tag/#list-of-tags">
<img src="{{ site.url }}/images/blog/list-of-tags.png" alt="List of tags in CSS" width="660" height="401">
</a>
</figure>

4
docs/_posts/2017-10-22-list-of-buttons.md
View File

@@ -10,8 +10,8 @@ icon: "hand-pointer"
Similarly to the [list of tags](/2017/08/03/list-of-tags/) launched a few months ago, the [button](/documentation/elements/button/) has its own **list of buttons**:
<figure>
<a href="/documentation/elements/button/#list-of-buttons">
<img src="/images/blog/list-of-buttons.png" alt="List of buttons in CSS" width="660" height="550">
<a href="{{ site.url }}/documentation/elements/button/#list-of-buttons">
<img src="{{ site.url }}/images/blog/list-of-buttons.png" alt="List of buttons in CSS" width="660" height="550">
</a>
</figure>

6
docs/_posts/2017-11-01-fixed-navbar.md
View File

@@ -11,7 +11,7 @@ You can now fix a [navbar](/documentation/components/navbar/#fixed-navbar) to th
<figure>
<video width="602.5" height="360" autoplay muted loop>
<source src="/images/blog/fixed-navbar.mp4" type="video/mp4">
<source src="{{ site.url }}/images/blog/fixed-navbar.mp4" type="video/mp4">
</video>
</figure>
@@ -20,7 +20,7 @@ You can now fix a [navbar](/documentation/components/navbar/#fixed-navbar) to th
As a added **bonus**, the bottom navbar required a new **dropup** feature which has also been implemented!
<figure>
<a href="/documentation/components/navbar/#fixed-navbar">
<img src="/images/blog/dropup.png" alt="Navbar dropup" width="660" height="239">
<a href="{{ site.url }}/documentation/components/navbar/#fixed-navbar">
<img src="{{ site.url }}/images/blog/dropup.png" alt="Navbar dropup" width="660" height="239">
</a>
</figure>

2
docs/_posts/2017-11-14-bulma-is-on-patreon.md
View File

@@ -12,7 +12,7 @@ icon_brand: true
<figure>
<a href="https://www.patreon.com/jgthms" target="_blank">
<img src="/images/blog/patreon-homepage.png" alt="Bulma Patreon homepage" width="840" height="525">
<img src="{{ site.url }}/images/blog/patreon-homepage.png" alt="Bulma Patreon homepage" width="840" height="525">
</a>
</figure>

48
docs/_posts/2018-04-13-website-redesign.md
View File

@@ -10,9 +10,9 @@ icon: "star"
The Bulma website has been widely redesigned! There's been a lot of work, to say the least:
<figure>
<img src="/images/blog/v7/files.png" alt="files" width="312" height="37">
<img src="{{ site.url }}/images/blog/v7/files.png" alt="files" width="312" height="37">
<br>
<img src="/images/blog/v7/diff.png" alt="diff" width="167" height="38">
<img src="{{ site.url }}/images/blog/v7/diff.png" alt="diff" width="167" height="38">
</figure>
Just see for yourself!
@@ -20,14 +20,14 @@ Just see for yourself!
<div class="columns">
<div class="column">
<p class="has-text-centered has-text-grey-light">Before</p>
<a href="/images/blog/v7/before.png">
<img src="/images/blog/v7/before.png" alt="v7 website" width="1400" height="1200">
<a href="{{ site.url }}/images/blog/v7/before.png">
<img src="{{ site.url }}/images/blog/v7/before.png" alt="v7 website" width="1400" height="1200">
</a>
</div>
<div class="column">
<p class="has-text-centered has-text-grey-light">After</p>
<a href="/images/blog/v7/after.png">
<img src="/images/blog/v7/after.png" alt="v7 website" width="1400" height="1200">
<a href="{{ site.url }}/images/blog/v7/after.png">
<img src="{{ site.url }}/images/blog/v7/after.png" alt="v7 website" width="1400" height="1200">
</a>
</div>
</div>
@@ -37,8 +37,8 @@ Just see for yourself!
The **navbar** has been updated with a lighter markup and cleaner design:
<figure>
<a href="/images/blog/v7/navbar.png">
<img src="/images/blog/v7/navbar.png" alt="navbar" width="1080" height="84">
<a href="{{ site.url }}/images/blog/v7/navbar.png">
<img src="{{ site.url }}/images/blog/v7/navbar.png" alt="navbar" width="1080" height="84">
</a>
</figure>
@@ -49,16 +49,16 @@ This doesn't affect the current navbars. There's actually a new modifier called
On the homepage, there's a new [**customization** section with a live example](/#customize):
<figure>
<a href="/#customize">
<img src="/images/blog/v7/customize.png" alt="customize" width="492" height="582">
<a href="{{ site.url }}/#customize">
<img src="{{ site.url }}/images/blog/v7/customize.png" alt="customize" width="492" height="582">
</a>
</figure>
{% include elements/anchor.html name="Breadcrumb" %}
<figure>
<a href="/images/blog/v7/breadcrumb.png">
<img src="/images/blog/v7/breadcrumb.png" alt="breadcrumb" width="422" height="24">
<a href="{{ site.url }}/images/blog/v7/breadcrumb.png">
<img src="{{ site.url }}/images/blog/v7/breadcrumb.png" alt="breadcrumb" width="422" height="24">
</a>
</figure>
@@ -80,8 +80,8 @@ This has led to the creation of new **intermediate pages**:
These intermediate pages have new **link boxes** that help dive into each sub-category:
<figure>
<a href="/images/blog/v7/links.png">
<img src="/images/blog/v7/links.png" alt="footer links" width="664" height="468">
<a href="{{ site.url }}/images/blog/v7/links.png">
<img src="{{ site.url }}/images/blog/v7/links.png" alt="footer links" width="664" height="468">
</a>
</figure>
@@ -90,16 +90,16 @@ These intermediate pages have new **link boxes** that help dive into each sub-ca
Next to the breadcrumb, you can easily navigate to the **sibling** pages with the **previous** and **next** links:
<figure>
<a href="/images/blog/v7/prevnext.png">
<img src="/images/blog/v7/prevnext.png" alt="prevnext buttons" width="48" height="24">
<a href="{{ site.url }}/images/blog/v7/prevnext.png">
<img src="{{ site.url }}/images/blog/v7/prevnext.png" alt="prevnext buttons" width="48" height="24">
</a>
</figure>
These links are also available at the bottom:
<figure>
<a href="/images/blog/v7/prevnextbis.png">
<img src="/images/blog/v7/prevnextbis.png" alt="prevnextbis buttons" width="664" height="58">
<a href="{{ site.url }}/images/blog/v7/prevnextbis.png">
<img src="{{ site.url }}/images/blog/v7/prevnextbis.png" alt="prevnextbis buttons" width="664" height="58">
</a>
</figure>
@@ -108,8 +108,8 @@ These links are also available at the bottom:
There's a new **sidebar** including a navigation menu with all the categories and sub-categories:
<figure>
<a href="/images/blog/v7/categories.png">
<img src="/images/blog/v7/categories.png" alt="categories menu" width="256" height="397">
<a href="{{ site.url }}/images/blog/v7/categories.png">
<img src="{{ site.url }}/images/blog/v7/categories.png" alt="categories menu" width="256" height="397">
</a>
</figure>
@@ -118,8 +118,8 @@ There's a new **sidebar** including a navigation menu with all the categories an
On some pages below the categories, you'll find a new menu called "On this page" which is actually a **scroll spy**:
<figure>
<a href="/images/blog/v7/scrollspy.png">
<img src="/images/blog/v7/scrollspy.png" alt="scrollspy menu" width="199" height="341">
<a href="{{ site.url }}/images/blog/v7/scrollspy.png">
<img src="{{ site.url }}/images/blog/v7/scrollspy.png" alt="scrollspy menu" width="199" height="341">
</a>
</figure>
@@ -128,8 +128,8 @@ On some pages below the categories, you'll find a new menu called "On this page"
The footer has been redesigned as well. Among other things, there's a **sitemap** available:
<figure>
<a href="/images/blog/v7/footer.png">
<img src="/images/blog/v7/footer.png" alt="footer links" width="984" height="302">
<a href="{{ site.url }}/images/blog/v7/footer.png">
<img src="{{ site.url }}/images/blog/v7/footer.png" alt="footer links" width="984" height="302">
</a>
</figure>

4
docs/_posts/2018-06-20-automatic-variables-documentation.md
View File

@@ -14,11 +14,11 @@ More and more CSS values are transformed into Sass variables for easy customizat
While providing these variables is necessary, it's only useful if developers are aware they exist! Keeping **in sync** the documentation and the source files used to be a manual process. It is now **automatic**, thanks to a script that parses the source files and outputs the numerous Sass variables as JSON data.
<figure>
<img src="/images/blog/variables/json.png" alt="JSON variables" width="275" height="775">
<img src="{{ site.url }}/images/blog/variables/json.png" alt="JSON variables" width="275" height="775">
</figure>
As an added bonus, each variable row in the docs comes with its **type** and its **computed value** (if applicable).
<figure>
<img src="/images/blog/variables/variables-table.png" alt="Variables table" width="597" height="212">
<img src="{{ site.url }}/images/blog/variables/variables-table.png" alt="Variables table" width="597" height="212">
</figure>