mirror of
https://github.com/jgthms/bulma
synced 2026-03-15 02:04:29 -07:00
Init v1
This commit is contained in:
Jeremy Thomas
20
docs/_includes/global/about.html
Normal file
20
docs/_includes/global/about.html
Normal file
@@ -0,0 +1,20 @@
|
||||
<footer class="bd-footer footer has-text-centered">
|
||||
<div class="container">
|
||||
<div class="columns">
|
||||
<div class="column is-4">
|
||||
{% include about/author.html %}
|
||||
</div>
|
||||
<div class="column is-4">
|
||||
{% include about/contribute.html %}
|
||||
</div>
|
||||
<div class="column is-4">
|
||||
{% include about/share.html %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bd-footer-tsp has-text-centered">
|
||||
Source code licensed <a href="https://opensource.org/licenses/mit-license.php" target="_blank">MIT</a>.
|
||||
Website content licensed <a rel="license" href="https://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank">CC BY-NC-SA 4.0</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
@@ -1,8 +0,0 @@
|
||||
{% if site.deprecated %}
|
||||
<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="{{ site.url }}/">Click here to view the latest version</a>
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
@@ -1,79 +0,0 @@
|
||||
{% include footer/support.html %} {% include global/native.html %} {% include
|
||||
footer/main.html %}
|
||||
|
||||
<div class="v1-modal modal">
|
||||
<div class="bd-book-modal-background"></div>
|
||||
<h3 class="v1-modal-title title">
|
||||
<span class="v1-modal-emoji">🎉</span>
|
||||
Bulma v1 is coming soon!
|
||||
</h3>
|
||||
|
||||
<ul class="v1-tags">
|
||||
<li class="v1-tag" style="background-color: #2a2e37; color: #fff">
|
||||
<span class="icon" style="color: #8158f5">
|
||||
<i class="fas fa-moon"></i>
|
||||
</span>
|
||||
Dark Mode
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-danger">
|
||||
<i class="fas fa-th-large"></i>
|
||||
</span>
|
||||
Smart Grid
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-link">
|
||||
<i class="fab fa-css3"></i>
|
||||
</span>
|
||||
CSS Variables
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-amazon">
|
||||
<i class="fas fa-tint"></i>
|
||||
</span>
|
||||
Auto-Color
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-success">
|
||||
<i class="fas fa-paint-brush"></i>
|
||||
</span>
|
||||
Themes
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-rss">
|
||||
<i class="fas fa-spinner"></i>
|
||||
</span>
|
||||
Skeleton Loaders
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-info">
|
||||
<i class="fas fa-palette"></i>
|
||||
</span>
|
||||
Auto-Palettes
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-sass">
|
||||
<i class="fas fa-bullseye"></i>
|
||||
</span>
|
||||
Dart Sass Support
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-primary">
|
||||
<i class="fas fa-info-circle"></i>
|
||||
</span>
|
||||
Improved Accessibility
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-fortyfour">
|
||||
<i class="fas fa-swatchbook"></i>
|
||||
</span>
|
||||
HSLA
|
||||
</li>
|
||||
<li class="v1-tag is-last">and much more…</li>
|
||||
</ul>
|
||||
|
||||
<button
|
||||
class="bd-book-modal-close modal-close is-large"
|
||||
aria-label="close"
|
||||
></button>
|
||||
</div>
|
||||
@@ -1,22 +0,0 @@
|
||||
<a class="bd-fortyfour" href="https://gum.co/css-44-deluxe" target="_blank">
|
||||
<p class="bd-fortyfour-label">My CSS ebook</p>
|
||||
|
||||
<figure class="bd-fortyfour-image">
|
||||
{%
|
||||
include elements/responsive-image.html
|
||||
path="css-book/css-in-44-minutes-book-cover"
|
||||
extension="png"
|
||||
alt="CSS in 44 minutes book cover"
|
||||
width="126"
|
||||
height="176"
|
||||
%}
|
||||
</figure>
|
||||
|
||||
<p class="bd-fortyfour-text">My 44-page ebook to teach you <strong>CSS in 44 minutes</strong></p>
|
||||
|
||||
<div class="bd-fortyfour-cta">
|
||||
<span class="button is-primary is-light is-rounded is-small">
|
||||
<strong>Buy now →</strong>
|
||||
</span>
|
||||
</div>
|
||||
</a>
|
||||
@@ -1,88 +1,109 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="{% if page.excerpt %}{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.data.meta.description }}{% endif %}">
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta
|
||||
name="description"
|
||||
content="{% if page.excerpt %}{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.data.meta.description }}{% endif %}"
|
||||
>
|
||||
|
||||
<title>{% if page.fulltitle %}{{ page.fulltitle | markdownify | strip_html }}{% else %}{% if page.title %}{{ page.title | markdownify | strip_html }} | {% endif %}{{ site.data.meta.title | markdownify | strip_html }}{% endif %}</title>
|
||||
<title>
|
||||
{% if page.fulltitle -%}
|
||||
{{- page.fulltitle | markdownify | strip_html -}}
|
||||
{%- else -%}
|
||||
{%- if page.title %}{{ page.title | markdownify | strip_html }} | {% endif -%}
|
||||
{{- site.data.meta.title | markdownify | strip_html -}}
|
||||
{%- endif %}
|
||||
</title>
|
||||
|
||||
<link rel="stylesheet" href="{{ site.url }}/vendor/fontawesome-free-5.15.2-web/css/all.min.css">
|
||||
{% if page.fontawesome4 %}
|
||||
<link rel="stylesheet" href="{{ site.data.icons.fontawesome4 }}">
|
||||
{% endif %}
|
||||
{% if page.ionicons %}
|
||||
<link rel="stylesheet" href="{{ site.data.icons.ionicons }}">
|
||||
{% endif %}
|
||||
{% if page.mdi %}
|
||||
<link rel="stylesheet" href="{{ site.data.icons.mdi }}">
|
||||
{% endif %}
|
||||
|
||||
{% if page.fontawesome4 %}
|
||||
<link rel="stylesheet" href="{{ site.data.icons.fontawesome4 }}">
|
||||
{% endif %}
|
||||
{% if page.ionicons %}
|
||||
<link rel="stylesheet" href="{{ site.data.icons.ionicons }}">
|
||||
{% endif %}
|
||||
{% if page.mdi %}
|
||||
<link rel="stylesheet" href="{{ site.data.icons.mdi }}">
|
||||
{% endif %}
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css">
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="{{ site.url }}/assets/css/{{ site.docs_file }}.css?v={{ site.time | date: "%Y%m%d%H%M" }}"
|
||||
>
|
||||
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css">
|
||||
<link rel="stylesheet" href="{{ site.url }}/css/{{ site.docs_file }}.css?v={{ site.time | date: "%Y%m%d%H%M" }}">
|
||||
<link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.url }}">
|
||||
<link
|
||||
rel="alternate"
|
||||
type="application/rss+xml"
|
||||
title="{{ site.data.meta.title }}"
|
||||
href="{{ "/atom.xml" | prepend: site.url }}"
|
||||
>
|
||||
|
||||
<link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.url }}">
|
||||
<link rel="alternate" type="application/rss+xml" title="{{ site.data.meta.title }}" href="{{ "/atom.xml" | prepend: site.url }}">
|
||||
<meta property="og:url" content="{{ site.url }}">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
<meta property="og:image:width" content="1200">
|
||||
<meta property="og:image:height" content="630">
|
||||
|
||||
<meta property="og:url" content="{{ site.url }}">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:image:type" content="image/png">
|
||||
<meta property="og:image:width" content="1200">
|
||||
<meta property="og:image:height" content="630">
|
||||
<meta name="twitter:card" content="summary_large_image">
|
||||
<meta name="twitter:site" content="@jgthms">
|
||||
<meta name="twitter:creator" content="@jgthms">
|
||||
|
||||
<meta name="twitter:card" content="summary_large_image">
|
||||
<meta name="twitter:site" content="@jgthms">
|
||||
<meta name="twitter:creator" content="@jgthms">
|
||||
<!-- Shared social media -->
|
||||
{% if page.share_title %}
|
||||
<meta property="og:title" content="{{ page.share_title }}">
|
||||
<meta name="twitter:title" content="{{ page.share_title }}">
|
||||
{% elsif page.title %}
|
||||
<meta property="og:title" content="{{ page.title | replace: ' ', ' ' | strip_html }}">
|
||||
<meta name="twitter:title" content="{{ page.title | replace: ' ', ' ' | strip_html }}">
|
||||
{% else %}
|
||||
<meta property="og:title" content="{{ site.data.meta.title }}">
|
||||
<meta name="twitter:title" content="{{ site.data.meta.title }}">
|
||||
{% endif %}
|
||||
|
||||
<!-- Shared social media -->
|
||||
{% if page.share_title %}
|
||||
<meta property="og:title" content="{{ page.share_title }}">
|
||||
<meta name="twitter:title" content="{{ page.share_title }}">
|
||||
{% elsif page.title %}
|
||||
<meta property="og:title" content="{{ page.title | replace: ' ', ' ' | strip_html }}">
|
||||
<meta name="twitter:title" content="{{ page.title | replace: ' ', ' ' | strip_html }}">
|
||||
{% else %}
|
||||
<meta property="og:title" content="{{ site.data.meta.title }}">
|
||||
<meta name="twitter:title" content="{{ site.data.meta.title }}">
|
||||
{% endif %}
|
||||
|
||||
{% if page.share_description %}
|
||||
<meta property="og:description" content="{{ page.share_description }}">
|
||||
<meta name="twitter:description" content="{{ page.share_description }}">
|
||||
{% elsif page.layout == 'post' %}
|
||||
<meta property="og:description" content="{{ page.content | strip_html | truncate: 400, '…' }}">
|
||||
<meta name="twitter:description" content="{{ page.content | strip_html | truncate: 400, '…' }}">
|
||||
{% elsif page.doc-tab %}
|
||||
{% assign link = site.data.links.by_id[page.doc-tab] %}
|
||||
{% if link.subtitle %}
|
||||
<meta property="og:description" content="{{ link.subtitle | strip_html }}">
|
||||
<meta name="twitter:description" content="{{ link.subtitle | strip_html }}">
|
||||
{% else %}
|
||||
<meta property="og:description" content="{{ site.data.meta.description }}">
|
||||
<meta name="twitter:description" content="{{ site.data.meta.description }}">
|
||||
{% endif %}
|
||||
{% if page.share_description %}
|
||||
<meta property="og:description" content="{{ page.share_description }}">
|
||||
<meta name="twitter:description" content="{{ page.share_description }}">
|
||||
{% elsif page.layout == 'post' %}
|
||||
<meta property="og:description" content="{{ page.content | strip_html | truncate: 400, '…' }}">
|
||||
<meta name="twitter:description" content="{{ page.content | strip_html | truncate: 400, '…' }}">
|
||||
{% elsif page['doc-tab'] %}
|
||||
{% assign link = site.data.links.by_id[page['doc-tab']] %}
|
||||
{% if link.subtitle %}
|
||||
<meta property="og:description" content="{{ link.subtitle | strip_html }}">
|
||||
<meta name="twitter:description" content="{{ link.subtitle | strip_html }}">
|
||||
{% else %}
|
||||
<meta property="og:description" content="{{ site.data.meta.description }}">
|
||||
<meta name="twitter:description" content="{{ site.data.meta.description }}">
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<meta property="og:description" content="{{ site.data.meta.description }}">
|
||||
<meta name="twitter:description" content="{{ site.data.meta.description }}">
|
||||
{% endif %}
|
||||
|
||||
{% if page.share_image %}
|
||||
<meta property="og:image" content="{{ site.url }}{{ page.share_image }}">
|
||||
<meta name="twitter:image" content="{{ site.url }}{{ page.share_image }}">
|
||||
{% elsif page.layout == 'post' %}
|
||||
<meta property="og:image" content="{{ site.url }}/images/blog/share/{{ page.id | slice: 12,page.id.size }}.jpg">
|
||||
<meta name="twitter:image" content="{{ site.url }}/images/blog/share/{{ page.id | slice: 12,page.id.size }}.jpg">
|
||||
{% else %}
|
||||
<meta property="og:image" content="{{ site.url }}/images/bulma-banner.png">
|
||||
<meta name="twitter:image" content="{{ site.url }}/images/bulma-banner.png">
|
||||
{% endif %}
|
||||
{% if page.share_image %}
|
||||
<meta property="og:image" content="{{ site.url }}{{ page.share_image }}">
|
||||
<meta name="twitter:image" content="{{ site.url }}{{ page.share_image }}">
|
||||
{% elsif page.layout == 'post' %}
|
||||
<meta
|
||||
property="og:image"
|
||||
content="{{ site.url }}/assets/images/blog/share/{{ page.id | slice: 12,page.id.size }}.jpg"
|
||||
>
|
||||
<meta
|
||||
name="twitter:image"
|
||||
content="{{ site.url }}/assets/images/blog/share/{{ page.id | slice: 12,page.id.size }}.jpg"
|
||||
>
|
||||
{% else %}
|
||||
<meta property="og:image" content="{{ site.url }}/assets/images/bulma-banner.png">
|
||||
<meta name="twitter:image" content="{{ site.url }}/assets/images/bulma-banner.png">
|
||||
{% endif %}
|
||||
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="{{ site.url }}/favicons/apple-touch-icon.png?v=201701041855">
|
||||
<link rel="icon" type="image/png" href="{{ site.url }}/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
|
||||
<link rel="icon" type="image/png" href="{{ site.url }}/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
|
||||
<link rel="manifest" href="{{ site.url }}/favicons/manifest.json?v=201701041855">
|
||||
<link rel="mask-icon" href="{{ site.url }}/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
|
||||
<link rel="shortcut icon" href="{{ site.url }}/favicons/favicon.ico?v=201701041855">
|
||||
<meta name="msapplication-config" content="{{ site.url }}/favicons/browserconfig.xml?v=201701041855">
|
||||
<meta name="theme-color" content="#00d1b2">
|
||||
</head>
|
||||
<!-- Favicons -->
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="{{ site.url }}/favicons/apple-touch-icon.png?v=201701041855">
|
||||
<link rel="icon" type="image/png" href="{{ site.url }}/favicons/favicon-32x32.png?v=201701041855" sizes="32x32">
|
||||
<link rel="icon" type="image/png" href="{{ site.url }}/favicons/favicon-16x16.png?v=201701041855" sizes="16x16">
|
||||
<!-- link rel="manifest" href="{{ site.url }}/favicons/manifest.json?v=201701041855" -->
|
||||
<link rel="mask-icon" href="{{ site.url }}/favicons/safari-pinned-tab.svg?v=201701041855" color="#00d1b2">
|
||||
<link rel="shortcut icon" href="{{ site.url }}/favicons/favicon.ico?v=201701041855">
|
||||
<meta name="msapplication-config" content="{{ site.url }}/favicons/browserconfig.xml?v=201701041855">
|
||||
<meta name="theme-color" content="#00d1b2">
|
||||
|
||||
99
docs/_includes/global/header.html
Normal file
99
docs/_includes/global/header.html
Normal file
@@ -0,0 +1,99 @@
|
||||
<header class="bd-header">
|
||||
<a class="bulma-logo" href="{{ site.url }}/">
|
||||
{% include svg/bulma-logo.html %}
|
||||
</a>
|
||||
|
||||
<nav id="js-nav" class="bd-nav">
|
||||
{% for link_id in site.data.links.navbar %}
|
||||
{% include global/nav-item.html link_id=link_id %}
|
||||
{% endfor %}
|
||||
|
||||
<div class="bd-nav-icons">
|
||||
{% for link_id in site.data.links.navbar_icons %}
|
||||
{% include global/nav-item.html link_id=link_id %}
|
||||
{% endfor %}
|
||||
|
||||
<button class="bd-nav-item is-search is-icon">
|
||||
<span class="icon">
|
||||
<i class="fa-solid fa-magnifying-glass fa-lg"></i>
|
||||
</span>
|
||||
</button>
|
||||
|
||||
<button class="bd-nav-item is-icon is-ellipsis js-burger" data-target="js-more">
|
||||
<span class="icon">
|
||||
<i class="fa-solid fa-ellipsis fa-lg"></i>
|
||||
</span>
|
||||
</button>
|
||||
|
||||
<div id="js-more" class="bd-nav-menu is-more js-menu">
|
||||
{% for link_id in site.data.links.navbar_more %}
|
||||
{% include global/nav-item.html link_id=link_id %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a class="button is-primary bd-nav-mobile-download"> Download </a>
|
||||
</nav>
|
||||
|
||||
<div class="bd-nav-themes">
|
||||
<button id="js-cycle" class="bd-cycle js-burger" data-target="js-themes">
|
||||
<div class="bd-cycles">
|
||||
<div class="bd-cycle-sun">
|
||||
<span class="icon">
|
||||
<i class="fas fa-lg fa-sun" aria-hidden="true"></i>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="bd-cycle-moon">
|
||||
<span class="icon">
|
||||
<i class="fas fa-lg fa-moon" aria-hidden="true"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<div id="js-themes" class="bd-nav-menu is-cycles js-menu js-themes">
|
||||
<button data-scheme="light" class="bd-nav-item is-sun" aria-label="Light mode">
|
||||
<span class="icon">
|
||||
<i class="fas fa-sun" aria-hidden="true"></i>
|
||||
</span>
|
||||
<span>Light</span>
|
||||
</button>
|
||||
|
||||
<button data-scheme="dark" class="bd-nav-item is-moon" aria-label="Dark mode">
|
||||
<span class="icon">
|
||||
<i class="fas fa-moon" aria-hidden="true"></i>
|
||||
</span>
|
||||
<span>Dark</span>
|
||||
</button>
|
||||
|
||||
<button data-scheme="system" class="bd-nav-item is-system" aria-label="System mode">
|
||||
<span class="icon">
|
||||
<i class="fas fa-display" aria-hidden="true"></i>
|
||||
</span>
|
||||
<span>System</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bd-nav-search">
|
||||
<button class="bd-nav-item is-search-desktop is-icon js-burger" data-target="js-search">
|
||||
<span class="icon">
|
||||
<i class="fa-solid fa-magnifying-glass fa-lg"></i>
|
||||
</span>
|
||||
</button>
|
||||
|
||||
<div id="js-search" class="bd-nav-menu is-search js-menu">
|
||||
<input id="form-search" class="input" type="text" placeholder="Search">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a class="button is-primary bd-nav-desktop-download"> Download </a>
|
||||
|
||||
<button class="navbar-burger bd-nav-burger js-burger" data-target="js-nav">
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
</button>
|
||||
</header>
|
||||
@@ -1,4 +1,4 @@
|
||||
<script src="{{ site.url }}/vendor/native.js"></script>
|
||||
<script src="{{ site.url }}/assets/vendor/native.js"></script>
|
||||
<script>
|
||||
_native.init('CVAIKK3E', {
|
||||
targetClass: 'native-js',
|
||||
@@ -38,6 +38,7 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="bd-native">
|
||||
<div class="native-js">
|
||||
<a href="#native_link#" class="native-flex">
|
||||
<style>
|
||||
@@ -73,3 +74,4 @@
|
||||
<span class="button is-medium native-cta">#native_cta#</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
41
docs/_includes/global/nav-item.html
Normal file
41
docs/_includes/global/nav-item.html
Normal file
@@ -0,0 +1,41 @@
|
||||
{% assign link = site.data.links.by_id[include.link_id] %}
|
||||
{% assign cleanpath = link.path | remove: '/' %}
|
||||
|
||||
<a
|
||||
class="
|
||||
bd-nav-item
|
||||
bd-theme-{{ include.link_id }}
|
||||
is-{{ include.link_id }}
|
||||
{% if link.icon_only %}
|
||||
is-icon
|
||||
{% endif %}
|
||||
{% if page.route == cleanpath %}
|
||||
is-active
|
||||
{% endif %}
|
||||
{% if page.path contains '_posts' and include.link_id == 'blog' %}
|
||||
is-active
|
||||
{% endif %}
|
||||
"
|
||||
title="{{ link.subtitle | strip_html }}"
|
||||
{% if link.href %}
|
||||
href="{{ link.href }}"
|
||||
target="_blank"
|
||||
{% else %}
|
||||
href="{{ site.url }}{{ link.path }}"
|
||||
{% endif %}
|
||||
>
|
||||
<span class="icon">
|
||||
<i class="{{ link.icon }}"></i>
|
||||
</span>
|
||||
|
||||
{% unless link.icon_only %}
|
||||
<span class="bd-nav-item-name">
|
||||
{% if link.long_name %}
|
||||
<span class="is-hidden-fullhd">{{ link.name }}</span>
|
||||
<span class="is-hidden is-block-fullhd">{{ link.long_name }}</span>
|
||||
{% else %}
|
||||
{{ link.name }}
|
||||
{% endif %}
|
||||
</span>
|
||||
{% endunless %}
|
||||
</a>
|
||||
@@ -1,20 +0,0 @@
|
||||
{% assign link = site.data.links.by_id[include.link_id] %}
|
||||
{% assign cleanpath = link.path | remove_first: "/" %}
|
||||
|
||||
<a class="
|
||||
navbar-item
|
||||
bd-navbar-item
|
||||
bd-navbar-item-{{ link_id }}
|
||||
{{ include.class }}
|
||||
{% if page.route == cleanpath %}is-active{% endif %}
|
||||
{% if page.path contains '_posts' and link_id == 'blog' %}
|
||||
is-active
|
||||
{% endif %}
|
||||
"
|
||||
href="{{ site.url }}{{ link.path }}">
|
||||
<span class="icon has-text-{{ link.color }}">
|
||||
<i class="{% if link.icon_brand %}fab{% elsif link.icon_regular %}far{% else %}fas{% endif %} fa-{{ link.icon }}"></i>
|
||||
</span>
|
||||
|
||||
<span>{{ link.title }}</span>
|
||||
</a>
|
||||
@@ -1,69 +0,0 @@
|
||||
<div id="{{ include.id }}" class="navbar-start bd-navbar-start bd-is-{{ include.version }}">
|
||||
<a class="
|
||||
navbar-item bd-navbar-item bd-navbar-item-base bd-navbar-item-documentation
|
||||
{% if page.route == 'documentation' %}is-active{% endif %}
|
||||
{% if page.layout == 'documentation' %}is-active{% endif %}
|
||||
"
|
||||
href="{{ site.url }}{{ site.data.meta.documentation }}">
|
||||
<span class="icon has-text-primary">
|
||||
<i class="fas fa-book"></i>
|
||||
</span>
|
||||
<span>
|
||||
Docs
|
||||
</span>
|
||||
</a>
|
||||
|
||||
{% for link_id in site.data.links.navbar %}
|
||||
{%
|
||||
include global/navbar-item.html
|
||||
link_id=link_id
|
||||
class="bd-navbar-item-base"
|
||||
%}
|
||||
{% endfor %}
|
||||
|
||||
{% for link_id in site.data.links.navbarMore %}
|
||||
{%
|
||||
include global/navbar-item.html
|
||||
link_id=link_id
|
||||
class="bd-navbar-item-more"
|
||||
%}
|
||||
{% endfor %}
|
||||
|
||||
<div class="navbar-item bd-navbar-item bd-navbar-item-base has-dropdown is-hoverable">
|
||||
{% assign link = site.data.links.by_id['more'] %}
|
||||
|
||||
<a class="navbar-link bd-navbar-ellipsis" href="{{ site.url }}{{ link.path }}">
|
||||
<span class="icon">
|
||||
<i class="fas fa-ellipsis-h"></i>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<div class="navbar-dropdown bd-navbar-dropdown is-boxed">
|
||||
{% for link_id in site.data.links.more %}
|
||||
{% assign link = site.data.links.by_id[link_id] %}
|
||||
{% assign cleanpath = link.path | remove_first: "/" %}
|
||||
<a class="
|
||||
navbar-item
|
||||
{% if page.route == cleanpath %}is-active{% endif %}
|
||||
"
|
||||
data-route="{{ page.route }}"
|
||||
href="{{ site.url }}{{ link.path }}">
|
||||
<div>
|
||||
<div class="icon-text">
|
||||
<span class="icon has-text-{{ link.color }}">
|
||||
<i class="{% if link.icon_brand %}fab{% elsif link.icon_regular %}far{% else %}fas{% endif %} fa-{{ link.icon }}"></i>
|
||||
</span>
|
||||
<span>
|
||||
<strong>{{ link.name }}</strong>
|
||||
</span>
|
||||
</div>
|
||||
{{ link.subtitle }}
|
||||
</div>
|
||||
</a>
|
||||
{% unless forloop.last %}
|
||||
<hr class="navbar-divider {% if forloop.first %}{% endif %}">
|
||||
{% endunless %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1,97 +0,0 @@
|
||||
<nav id="navbar" class="bd-navbar navbar">
|
||||
<div class="navbar-brand">
|
||||
<a class="navbar-item" href="{{ site.url }}">
|
||||
<img src="{{ site.url }}/images/bulma-logo.png" alt="{{ site.data.meta.title }}" width="112" height="28">
|
||||
</a>
|
||||
|
||||
<a class="navbar-item bd-navbar-mobile-icon" href="{{ site.data.meta.github }}" target="_blank">
|
||||
<span class="icon" style="color: var(--github);">
|
||||
<i class="fab fa-lg fa-github-alt"></i>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<a class="navbar-item bd-navbar-mobile-icon" href="{{ site.data.meta.twitter }}" target="_blank">
|
||||
<span class="icon" style="color: var(--twitter);">
|
||||
<i class="fab fa-lg fa-twitter"></i>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<div class="navbar-item bd-navbar-mobile-sponsor-icon">
|
||||
<a href="{{ site.url }}{{ site.data.links.by_id.become-sponsor.path }}" class="button is-sponsor is-outlined is-small">
|
||||
<span class="icon">
|
||||
<i class="fas fa-thumbs-up"></i>
|
||||
</span>
|
||||
<span>Sponsor</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<button id="searchIcon" class="navbar-item bd-navbar-search-icon bd-navbar-search-mobile-icon">
|
||||
<span class="icon">
|
||||
<i class="fas fa-lg fa-search"></i>
|
||||
</span>
|
||||
</button>
|
||||
|
||||
<button id="navbarBurger" class="navbar-burger" data-target="navMenu{{ include.id }}">
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div id="navMenu{{ include.id }}" class="navbar-menu">
|
||||
{% include global/navbar-start.html id="navbarStartOriginal" version="original" %}
|
||||
|
||||
<div class="navbar-end">
|
||||
<a class="bd-navbar-icon navbar-item" href="{{ site.data.meta.github }}" target="_blank">
|
||||
<span class="icon" style="color: var(--github);">
|
||||
<i class="fab fa-lg fa-github-alt"></i>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<a class="bd-navbar-icon navbar-item" href="{{ site.data.meta.twitter }}" target="_blank">
|
||||
<span class="icon" style="color: var(--twitter);">
|
||||
<i class="fab fa-lg fa-twitter"></i>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<div class="navbar-item bd-navbar-sponsor-button is-hidden-desktop">
|
||||
<a class="button is-sponsor is-light">
|
||||
<span class="icon is-small">
|
||||
<i class="fas fa-thumbs-up"></i>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="navbar-item bd-navbar-download-button is-hidden-touch">
|
||||
<a class="button is-primary mr-3" href="{{ site.data.meta.download }}">
|
||||
<span class="icon is-hidden-touch is-hidden-desktop-only">
|
||||
<i class="fas fa-download"></i>
|
||||
</span>
|
||||
<span>Download</span>
|
||||
</a>
|
||||
|
||||
<a href="{{ site.url }}{{ site.data.links.by_id.become-sponsor.path }}" class="button is-sponsor is-light">
|
||||
<span class="icon is-small is-hidden-touch is-hidden-desktop-only">
|
||||
<i class="fas fa-thumbs-up"></i>
|
||||
</span>
|
||||
<span>
|
||||
Sponsor
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="search" class="bd-search">
|
||||
<p class="control has-icons-left">
|
||||
<input id="algoliaSearch" class="input is-rounded" type="text" placeholder="Search the docs">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-search"></i>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="bd-navbar bd-is-clone">
|
||||
{% include global/navbar-start.html id="navbarStartClone" version="clone" %}
|
||||
</div>
|
||||
@@ -1,37 +0,0 @@
|
||||
<div id="newsletter" class="bd-newsletter">
|
||||
<section class="bd-index-section bd-newsletter-box">
|
||||
<div class="bd-newsletter-heading">
|
||||
<span class="icon has-text-primary is-size-2-widescreen">
|
||||
<i class="fas fa-paper-plane"></i>
|
||||
</span>
|
||||
|
||||
<h2 class="title has-text-black mb-0 is-size-2-widescreen">
|
||||
<strong>Newsletter</strong>
|
||||
<small>Features, releases, showcase… stay in the loop!</small>
|
||||
</h2>
|
||||
|
||||
<form action="https://mail.jgthms.com/subscribe" method="POST" accept-charset="utf-8">
|
||||
<div class="bd-newsletter-fields">
|
||||
<div class="control has-icons-left is-expanded">
|
||||
<input type="email" value="" name="email" class="input is-medium is-primary" placeholder="email address" required>
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-envelope"></i>
|
||||
</span>
|
||||
{% include elements/drawing.html id='spam-free' width=112 height=88 %}
|
||||
</div>
|
||||
|
||||
<div class="control">
|
||||
<div class="is-hidden">
|
||||
<input type="text" name="hp" id="hp">
|
||||
</div>
|
||||
<input type="hidden" name="list" value="So5UY3O9gHJkq892bn763Tyf4A">
|
||||
<input type="hidden" name="subform" value="yes">
|
||||
<button class="button is-medium is-primary">
|
||||
<strong>Subscribe</strong>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
@@ -1,14 +0,0 @@
|
||||
<div class="bd-notice">
|
||||
<div class="container">
|
||||
<div class="bd-notice-body">
|
||||
<p>
|
||||
Bulma <strong>{{ site.data.meta.version }}</strong> is out! With <strong>RTL support</strong> and <a href="{{ site.url }}/documentation/helpers/spacing-helpers/"><strong>spacing helpers</strong></a>.
|
||||
</p>
|
||||
<p>
|
||||
<a target="_blank" href="{{ site.data.meta.release_notes }}">Release notes</a>
|
||||
<span>–</span>
|
||||
<a target="_blank" href="{{ site.data.meta.download }}"><strong>Download it now</strong></a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1,60 +0,0 @@
|
||||
<script src="{{ site.url }}/vendor/clipboard-1.7.1.min.js"></script>
|
||||
<script src="{{ site.url }}/vendor/js.cookie-2.1.4.min.js"></script>
|
||||
<script src="{{ site.url }}/vendor/cupcakes-3.1.0.min.js"></script>
|
||||
|
||||
<script src="{{ site.url }}/lib/main.js?v={{ site.time | date: '%Y%m%d%H%M' }}"></script>
|
||||
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-82634666-2"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
|
||||
gtag('config', 'UA-82634666-2');
|
||||
</script>
|
||||
|
||||
{% if page.route == 'index' %}
|
||||
<script src="https://player.vimeo.com/api/player.js" ></script>
|
||||
<script type="text/javascript" src="{{ site.url }}/lib/index.js?v={{ site.time | date: '%Y%m%d%H%M' }}"></script>
|
||||
<script>
|
||||
WebFontConfig = {
|
||||
google: {
|
||||
families: ['Nunito:400,700']
|
||||
}
|
||||
};
|
||||
(function(d) {
|
||||
var wf = d.createElement('script'), s = d.scripts[0];
|
||||
wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js';
|
||||
wf.async = true;
|
||||
s.parentNode.insertBefore(wf, s);
|
||||
})(document);
|
||||
</script>
|
||||
{% endif %}
|
||||
|
||||
{% if page.layout == 'documentation' %}
|
||||
<script src="{{ site.url }}/lib/docs.js?v={{ site.time | date: '%Y%m%d%H%M' }}"></script>
|
||||
{% endif %}
|
||||
|
||||
{% if page.doc-subtab == 'start' %}
|
||||
<script src="{{ site.url }}/lib/start.js?v={{ site.time | date: '%Y%m%d%H%M' }}"></script>
|
||||
{% endif %}
|
||||
|
||||
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
|
||||
<script type="text/javascript"> docsearch({
|
||||
apiKey: 'cb93c14bebd90678e789c946d95ea94d',
|
||||
indexName: 'bulma',
|
||||
inputSelector: '#algoliaSearch',
|
||||
debug: false // Set debug to true if you want to inspect the dropdown
|
||||
});
|
||||
</script>
|
||||
|
||||
<script>
|
||||
window.addEventListener("load", function(){
|
||||
window.cupcakeconsent.initialise({
|
||||
"content": {
|
||||
"message": "Just so you know, this website uses cookies.",
|
||||
"dismiss": "<span>👍</span> Got it!",
|
||||
"link": "What are cookies?"
|
||||
}
|
||||
})});
|
||||
</script>
|
||||
@@ -1,14 +0,0 @@
|
||||
<div class="bd-side-sponsrs">
|
||||
<p class="bd-side-sponsor-label">Sponsors</p>
|
||||
|
||||
<a class="bd-side-sponsor" href="https://password.link/" target="_blank">
|
||||
{%
|
||||
include elements/responsive-image.html
|
||||
path="amis/passwordlink"
|
||||
extension="png"
|
||||
alt="Password.link"
|
||||
width="332"
|
||||
height="96"
|
||||
%}
|
||||
</a>
|
||||
</div>
|
||||
@@ -1,23 +0,0 @@
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<div class="columns is-vcentered">
|
||||
<div class="column is-4">
|
||||
<p class="title">Sponsors</p>
|
||||
</div>
|
||||
<div class="column is-8">
|
||||
<div class="bd-sponsors">
|
||||
<a href="https://chainaxe.io/" target="_blank" rel="nofollow">
|
||||
{%
|
||||
include elements/responsive-image.html
|
||||
path="sponsors/chainaxe"
|
||||
extension="png"
|
||||
alt="chainaxe logo"
|
||||
width="99"
|
||||
height="70"
|
||||
%}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
41
docs/_includes/global/support.html
Normal file
41
docs/_includes/global/support.html
Normal file
@@ -0,0 +1,41 @@
|
||||
<div class="bd-home-section is-support bd-theme-docs has-text-centered">
|
||||
<h3 class="title">
|
||||
How to support Bulma
|
||||
</h3>
|
||||
|
||||
<div class="bd-footer-donations columns is-multiline">
|
||||
<div class="bd-footer-donation column">
|
||||
<p class="bd-footer-donation-title"><strong>One-time</strong> donation</p>
|
||||
<div class="bd-footer-donation-action">
|
||||
<form class="paypal-form" action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top">
|
||||
<input type="hidden" name="cmd" value="_s-xclick">
|
||||
<input type="hidden" name="hosted_button_id" value="8WMKYSRFN6A78">
|
||||
<input
|
||||
type="image"
|
||||
src="{{site.url}}/assets/images/paypal-donate.png"
|
||||
border="0"
|
||||
name="submit"
|
||||
alt="PayPal – The safer, easier way to pay online."
|
||||
height="30"
|
||||
>
|
||||
<img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if site.data.sponsors.footer.size > 0 %}
|
||||
<div class="bd-footer-donation column">
|
||||
<p class="bd-footer-donation-title">Visit our <strong>Sponsors</strong></p>
|
||||
|
||||
<div class="bd-footer-donation-items" id="pied"></div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="bd-footer-donation column">
|
||||
<p class="bd-footer-donation-title"><strong>Monthly</strong> donation</p>
|
||||
<div class="bd-footer-donation-action">
|
||||
{% include docs/elements/sponsor-button.html %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1,73 +0,0 @@
|
||||
<div class="v1-banner">
|
||||
<h3 class="v1-title">
|
||||
<span class="v1-emoji">🎉</span>
|
||||
Bulma v1 is coming soon!
|
||||
</h3>
|
||||
|
||||
<div class="v1-features">
|
||||
<ul class="v1-tags">
|
||||
<li class="v1-tag" style="background-color: #2a2e37; color: #fff">
|
||||
<span class="icon" style="color: #8158f5">
|
||||
<i class="fas fa-moon"></i>
|
||||
</span>
|
||||
Dark Mode
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-danger">
|
||||
<i class="fas fa-th-large"></i>
|
||||
</span>
|
||||
Smart Grid
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-link">
|
||||
<i class="fab fa-css3"></i>
|
||||
</span>
|
||||
CSS Variables
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-amazon">
|
||||
<i class="fas fa-tint"></i>
|
||||
</span>
|
||||
Auto-Color
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-success">
|
||||
<i class="fas fa-paint-brush"></i>
|
||||
</span>
|
||||
Themes
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-rss">
|
||||
<i class="fas fa-spinner"></i>
|
||||
</span>
|
||||
Skeleton Loaders
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-info">
|
||||
<i class="fas fa-palette"></i>
|
||||
</span>
|
||||
Auto-Palettes
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-sass">
|
||||
<i class="fas fa-bullseye"></i>
|
||||
</span>
|
||||
Dart Sass Support
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-primary">
|
||||
<i class="fas fa-info-circle"></i>
|
||||
</span>
|
||||
Improved Accessibility
|
||||
</li>
|
||||
<li class="v1-tag">
|
||||
<span class="icon has-text-fortyfour">
|
||||
<i class="fas fa-swatchbook"></i>
|
||||
</span>
|
||||
HSLA
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="v1-more">and much more…</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user