mirror of
https://github.com/jgthms/bulma.git
synced 2024-11-14 11:14:24 +00:00
Fix relative links
This commit is contained in:
parent
6fe3eb0b74
commit
957a45a50c
@ -41,13 +41,13 @@
|
||||
<a class="button bd-is-bleeding is-large" href="{{ site.data.meta.book_url }}" target="_blank" rel="nofollow">
|
||||
<span>
|
||||
<em>PDF + Epub + Mobi</em>
|
||||
<strong>Buy</strong> from <img src="/images/book/bleedingedge-type.png">
|
||||
<strong>Buy</strong> from <img src="{{ site.url }}/images/book/bleedingedge-type.png">
|
||||
</span>
|
||||
</a>
|
||||
<a class="button bd-is-amazon is-large" href="{{ site.data.meta.book_amazon }}" target="_blank" rel="nofollow">
|
||||
<span>
|
||||
<em>Kindle version</em>
|
||||
<strong>Buy</strong> from <img src="/images/book/amazon-logo.png">
|
||||
<strong>Buy</strong> from <img src="{{ site.url }}/images/book/amazon-logo.png">
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
|
@ -16,11 +16,11 @@
|
||||
Home
|
||||
</a>
|
||||
<div class="navbar-item has-dropdown has-dropdown-up is-hoverable">
|
||||
<a class="navbar-link" href="/documentation/overview/start/">
|
||||
<a class="navbar-link" href="{{ site.url }}/documentation/overview/start/">
|
||||
Docs
|
||||
</a>
|
||||
<div class="navbar-dropdown">
|
||||
<a class="navbar-item" href="/documentation/overview/start/">
|
||||
<a class="navbar-item" href="{{ site.url }}/documentation/overview/start/">
|
||||
Overview
|
||||
</a>
|
||||
<a class="navbar-item" href="{{ site.url }}/documentation/modifiers/syntax/">
|
||||
|
@ -20,11 +20,11 @@
|
||||
Home
|
||||
</a>
|
||||
<div class="navbar-item has-dropdown is-hoverable">
|
||||
<a class="navbar-link" href="/documentation/overview/start/">
|
||||
<a class="navbar-link" href="{{ site.url }}/documentation/overview/start/">
|
||||
Docs
|
||||
</a>
|
||||
<div class="navbar-dropdown">
|
||||
<a class="navbar-item" href="/documentation/overview/start/">
|
||||
<a class="navbar-item" href="{{ site.url }}/documentation/overview/start/">
|
||||
Overview
|
||||
</a>
|
||||
<a class="navbar-item" href="{{ site.url }}/documentation/modifiers/syntax/">
|
||||
|
@ -16,11 +16,11 @@
|
||||
Home
|
||||
</a>
|
||||
<div class="navbar-item has-dropdown is-hoverable">
|
||||
<a class="navbar-link" href="/documentation/overview/start/">
|
||||
<a class="navbar-link" href="{{ site.url }}/documentation/overview/start/">
|
||||
Docs
|
||||
</a>
|
||||
<div class="navbar-dropdown{% if include.boxed %} is-boxed{% endif %}">
|
||||
<a class="navbar-item" href="/documentation/overview/start/">
|
||||
<a class="navbar-item" href="{{ site.url }}/documentation/overview/start/">
|
||||
Overview
|
||||
</a>
|
||||
<a class="navbar-item" href="{{ site.url }}/documentation/modifiers/syntax/">
|
||||
|
@ -2,7 +2,7 @@
|
||||
<div class="notification is-info" style="border-radius: 0; margin-bottom: 0;">
|
||||
<p>
|
||||
You are viewing the deprecated <strong>{{site.data.meta.version}}</strong> version of the website.
|
||||
<a href="/">Click here to view the latest version</a>
|
||||
<a href="{{ site.url }}/">Click here to view the latest version</a>
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
@ -27,7 +27,7 @@
|
||||
}
|
||||
</style>
|
||||
<div class="native-main">
|
||||
<img class="native-img" src="/images/fortyfour-native.png">
|
||||
<img class="native-img" src="{{ site.url }}/images/fortyfour-native.png">
|
||||
<div class="native-details">
|
||||
<span class="native-company">CSS in 44 minutes</span>
|
||||
<span class="native-desc">Learn how to build your own webpage from scratch!</span>
|
||||
|
@ -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>
|
||||
|
||||
|
@ -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>
|
||||
|
||||
|
@ -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>
|
||||
|
@ -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>
|
||||
|
||||
|
@ -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>
|
||||
|
||||
|
@ -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>
|
||||
|
@ -368,11 +368,11 @@ meta:
|
||||
|
||||
{% capture navbar_dropup_snippet %}
|
||||
<div class="navbar-item has-dropdown has-dropdown-up is-hoverable">
|
||||
<a class="navbar-link" href="/documentation/overview/start/">
|
||||
<a class="navbar-link" href="{{ site.url }}/documentation/overview/start/">
|
||||
Docs
|
||||
</a>
|
||||
<div class="navbar-dropdown">
|
||||
<a class="navbar-item" href="/documentation/overview/start/">
|
||||
<a class="navbar-item" href="{{ site.url }}/documentation/overview/start/">
|
||||
Overview
|
||||
</a>
|
||||
</div>
|
||||
|
@ -74,7 +74,7 @@ meta:
|
||||
|
||||
<div class="content">
|
||||
<p>
|
||||
Bulma uses it for the <a href="/documentation/elements/tag/">tags</a>, the <a href="/documentation/elements/notification/">notifications</a>, and the <a href="/documentation/components/message/">messages</a>:
|
||||
Bulma uses it for the <a href="{{ site.url }}/documentation/elements/tag/">tags</a>, the <a href="{{ site.url }}/documentation/elements/notification/">notifications</a>, and the <a href="{{ site.url }}/documentation/components/message/">messages</a>:
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
@ -101,7 +101,7 @@ meta:
|
||||
|
||||
<div class="content">
|
||||
<p>
|
||||
Since icon fonts are simply <strong>text</strong>, you can use the <a href="/documentation/modifiers/typography-helpers/#colors">text color modifiers</a> to change the icon's color.
|
||||
Since icon fonts are simply <strong>text</strong>, you can use the <a href="{{ site.url }}/documentation/modifiers/typography-helpers/#colors">text color modifiers</a> to change the icon's color.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
@ -125,9 +125,9 @@ breadcrumb:
|
||||
|
||||
<div class="content">
|
||||
<p>
|
||||
<code><a href="/bulma-start/">bulma-start</a></code> is a tiny npm package that includes the <code>npm</code> dependencies you need to build your own website with Bulma.
|
||||
<code><a href="{{ site.url }}/bulma-start/">bulma-start</a></code> is a tiny npm package that includes the <code>npm</code> dependencies you need to build your own website with Bulma.
|
||||
</p>
|
||||
<p>
|
||||
<a class="button is-link" href="/bulma-start/">Check it out</a>
|
||||
<a class="button is-link" href="{{ site.url }}/bulma-start/">Check it out</a>
|
||||
</p>
|
||||
</div>
|
||||
|
@ -102,10 +102,10 @@ videos:
|
||||
<div class="column is-8 is-offset-1">
|
||||
<a class="image" href="{{ video.video_url }}" target="_blank" rel="nofollow">
|
||||
{% if video.no_video %}
|
||||
<img src="/images/videos/{{ video.id }}.png" alt="{{ video.title }} screenshot">
|
||||
<img src="{{ site.url }}/images/videos/{{ video.id }}.png" alt="{{ video.title }} screenshot">
|
||||
{% else %}
|
||||
<video autoplay loop muted>
|
||||
<source media="(min-width: 640px)" src="/images/videos/{{ video.id }}.mp4">
|
||||
<source media="(min-width: 640px)" src="{{ site.url }}/images/videos/{{ video.id }}.mp4">
|
||||
</video>
|
||||
{% endif %}
|
||||
</a>
|
||||
|
@ -2,7 +2,11 @@
|
||||
"name": "bulma",
|
||||
"version": "0.7.2",
|
||||
"homepage": "https://bulma.io",
|
||||
"author": "Jeremy Thomas <bbxdesign@gmail.com> (https://jgthms.com)",
|
||||
"author": {
|
||||
"name": "Jeremy Thomas",
|
||||
"email": "bbxdesign@gmail.com",
|
||||
"url": "https://jgthms.com"
|
||||
},
|
||||
"description": "Modern CSS framework based on Flexbox",
|
||||
"main": "bulma.sass",
|
||||
"unpkg": "css/bulma.css",
|
||||
|
Loading…
Reference in New Issue
Block a user