mirror of
https://github.com/jgthms/bulma
synced 2026-03-15 02:04:29 -07:00
Add bd classes
This commit is contained in:
@@ -13,7 +13,7 @@
|
||||
<p class="subtitle">
|
||||
Stay updated about new features, bug fixes, and releases
|
||||
</p>
|
||||
<a class="button is-rss" href="{{ site.url }}/atom.xml">
|
||||
<a class="button bd-is-rss" href="{{ site.url }}/atom.xml">
|
||||
<span class="icon">
|
||||
<i class="fa fa-rss"></i>
|
||||
</span>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(0, 0%, 7%);"></span>
|
||||
<span class="bd-color" style="background: hsl(0, 0%, 7%);"></span>
|
||||
<code>hsl(0, 0%, 7%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(0, 0%, 14%);"></span>
|
||||
<span class="bd-color" style="background: hsl(0, 0%, 14%);"></span>
|
||||
<code>hsl(0, 0%, 14%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(0, 0%, 4%);"></span>
|
||||
<span class="bd-color" style="background: hsl(0, 0%, 4%);"></span>
|
||||
<code>hsl(0, 0%, 4%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(217, 71%, 53%);"></span>
|
||||
<span class="bd-color" style="background: hsl(217, 71%, 53%);"></span>
|
||||
<code>hsl(217, 71%, 53%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(141, 71%, 48%);"></span>
|
||||
<span class="bd-color" style="background: hsl(141, 71%, 48%);"></span>
|
||||
<code>hsl(141, 71%, 48%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(0, 0%, 29%);"></span>
|
||||
<span class="bd-color" style="background: hsl(0, 0%, 29%);"></span>
|
||||
<code>hsl(0, 0%, 29%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(0, 0%, 21%);"></span>
|
||||
<span class="bd-color" style="background: hsl(0, 0%, 21%);"></span>
|
||||
<code>hsl(0, 0%, 21%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(0, 0%, 71%);"></span>
|
||||
<span class="bd-color" style="background: hsl(0, 0%, 71%);"></span>
|
||||
<code>hsl(0, 0%, 71%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(0, 0%, 86%);"></span>
|
||||
<span class="bd-color" style="background: hsl(0, 0%, 86%);"></span>
|
||||
<code>hsl(0, 0%, 86%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(0, 0%, 48%);"></span>
|
||||
<span class="bd-color" style="background: hsl(0, 0%, 48%);"></span>
|
||||
<code>hsl(0, 0%, 48%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(14, 100%, 53%);"></span>
|
||||
<span class="bd-color" style="background: hsl(14, 100%, 53%);"></span>
|
||||
<code>hsl(14, 100%, 53%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(271, 100%, 71%);"></span>
|
||||
<span class="bd-color" style="background: hsl(271, 100%, 71%);"></span>
|
||||
<code>hsl(271, 100%, 71%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(348, 100%, 61%);"></span>
|
||||
<span class="bd-color" style="background: hsl(348, 100%, 61%);"></span>
|
||||
<code>hsl(348, 100%, 61%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(171, 100%, 41%);"></span>
|
||||
<span class="bd-color" style="background: hsl(171, 100%, 41%);"></span>
|
||||
<code>hsl(171, 100%, 41%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(0, 0%, 98%);"></span>
|
||||
<span class="bd-color" style="background: hsl(0, 0%, 98%);"></span>
|
||||
<code>hsl(0, 0%, 98%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(0, 0%, 96%);"></span>
|
||||
<span class="bd-color" style="background: hsl(0, 0%, 96%);"></span>
|
||||
<code>hsl(0, 0%, 96%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(0, 0%, 100%);"></span>
|
||||
<span class="bd-color" style="background: hsl(0, 0%, 100%);"></span>
|
||||
<code>hsl(0, 0%, 100%)</code>
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
<span class="color" style="background: hsl(48, 100%, 67%);"></span>
|
||||
<span class="bd-color" style="background: hsl(48, 100%, 67%);"></span>
|
||||
<code>hsl(48, 100%, 67%)</code>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
<a class="tw-button button"
|
||||
<a class="bd-tw-button button"
|
||||
data-social-network="Twitter"
|
||||
data-social-action="tweet"
|
||||
data-social-target="{{ site.url }}"
|
||||
@@ -10,4 +10,4 @@
|
||||
<span>
|
||||
{{ include.label }}
|
||||
</span>
|
||||
</a>
|
||||
</a>
|
||||
|
||||
@@ -439,7 +439,7 @@
|
||||
<div class="column is-10">
|
||||
<div class="columns">
|
||||
<div class="column is-3">
|
||||
<h4 class="subtitle is-4 feature-title">
|
||||
<h4 class="subtitle is-4 bd-feature-title">
|
||||
<a href="{{ site.url }}/documentation/form/general/">
|
||||
Form
|
||||
</a>
|
||||
@@ -452,7 +452,7 @@
|
||||
|
||||
<div class="columns">
|
||||
<div class="column is-3">
|
||||
<h4 class="subtitle is-4 feature-title">
|
||||
<h4 class="subtitle is-4 bd-feature-title">
|
||||
<a href="{{ site.url }}/documentation/elements/box/">
|
||||
Box
|
||||
</a>
|
||||
@@ -465,7 +465,7 @@
|
||||
|
||||
<div class="columns">
|
||||
<div class="column is-3">
|
||||
<h4 class="subtitle is-4 feature-title">
|
||||
<h4 class="subtitle is-4 bd-feature-title">
|
||||
<a href="{{ site.url }}/documentation/elements/button/">
|
||||
Button
|
||||
</a>
|
||||
@@ -478,7 +478,7 @@
|
||||
|
||||
<div class="columns">
|
||||
<div class="column is-3">
|
||||
<h4 class="subtitle is-4 feature-title">
|
||||
<h4 class="subtitle is-4 bd-feature-title">
|
||||
<a href="{{ site.url }}/documentation/elements/notification/">
|
||||
Notification
|
||||
</a>
|
||||
@@ -491,7 +491,7 @@
|
||||
|
||||
<div class="columns">
|
||||
<div class="column is-3">
|
||||
<h4 class="subtitle is-4 feature-title">
|
||||
<h4 class="subtitle is-4 bd-feature-title">
|
||||
<a href="{{ site.url }}/documentation/elements/progress/">
|
||||
Progress bar
|
||||
</a>
|
||||
@@ -504,7 +504,7 @@
|
||||
|
||||
<div class="columns">
|
||||
<div class="column is-3">
|
||||
<h4 class="subtitle is-4 feature-title">
|
||||
<h4 class="subtitle is-4 bd-feature-title">
|
||||
<a href="{{ site.url }}/documentation/elements/tag/">
|
||||
Tags
|
||||
</a>
|
||||
@@ -528,7 +528,7 @@
|
||||
<div class="column is-10">
|
||||
<div class="columns">
|
||||
<div class="column is-3">
|
||||
<h4 class="subtitle is-4 feature-title">
|
||||
<h4 class="subtitle is-4 bd-feature-title">
|
||||
<a href="{{ site.url }}/documentation/components/card/">
|
||||
Card
|
||||
</a>
|
||||
@@ -541,7 +541,7 @@
|
||||
|
||||
<div class="columns">
|
||||
<div class="column is-3">
|
||||
<h4 class="subtitle is-4 feature-title">
|
||||
<h4 class="subtitle is-4 bd-feature-title">
|
||||
<a href="{{ site.url }}/documentation/components/dropdown/">
|
||||
Dropdown
|
||||
</a>
|
||||
@@ -554,7 +554,7 @@
|
||||
|
||||
<div class="columns">
|
||||
<div class="column is-3">
|
||||
<h4 class="subtitle is-4 feature-title">
|
||||
<h4 class="subtitle is-4 bd-feature-title">
|
||||
<a href="{{ site.url }}/documentation/components/message/">
|
||||
Message
|
||||
</a>
|
||||
@@ -567,7 +567,7 @@
|
||||
|
||||
<div class="columns">
|
||||
<div class="column is-3">
|
||||
<h4 class="subtitle is-4 feature-title">
|
||||
<h4 class="subtitle is-4 bd-feature-title">
|
||||
<a href="{{ site.url }}/documentation/components/pagination/">
|
||||
Pagination
|
||||
</a>
|
||||
@@ -580,7 +580,7 @@
|
||||
|
||||
<div class="columns">
|
||||
<div class="column is-3">
|
||||
<h4 class="subtitle is-4 feature-title">
|
||||
<h4 class="subtitle is-4 bd-feature-title">
|
||||
<a href="{{ site.url }}/documentation/components/tabs/">
|
||||
Tabs
|
||||
</a>
|
||||
@@ -593,7 +593,7 @@
|
||||
|
||||
<div class="columns">
|
||||
<div class="column is-3">
|
||||
<h4 class="subtitle is-4 feature-title">
|
||||
<h4 class="subtitle is-4 bd-feature-title">
|
||||
<a href="{{ site.url }}/documentation/components/media-object/">
|
||||
Media object
|
||||
</a>
|
||||
@@ -606,7 +606,7 @@
|
||||
|
||||
<div class="columns">
|
||||
<div class="column is-3">
|
||||
<h4 class="subtitle is-4 feature-title">
|
||||
<h4 class="subtitle is-4 bd-feature-title">
|
||||
<a href="{{ site.url }}/documentation/components/menu/">
|
||||
Menu
|
||||
</a>
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
<hr style="margin-bottom: 0;">
|
||||
|
||||
<h3 id="{{ include.name | slugify }}" class="title anchor-title">
|
||||
<h3 id="{{ include.name | slugify }}" class="title bd-anchor-title">
|
||||
{{ include.name }}
|
||||
<a class="anchor-link" href="#{{ include.name | slugify }}">
|
||||
<a class="bd-anchor-link" href="#{{ include.name | slugify }}">
|
||||
#
|
||||
</a>
|
||||
</h3>
|
||||
|
||||
@@ -65,7 +65,7 @@
|
||||
</p>
|
||||
{{#unless site.deprecated}}
|
||||
<small>
|
||||
<a class="view-all-versions" href="/versions">View all versions</a>
|
||||
<a class="bd-view-all-versions" href="/versions">View all versions</a>
|
||||
</small>
|
||||
{{/unless}}
|
||||
</div>
|
||||
@@ -101,7 +101,7 @@
|
||||
</div>
|
||||
<div class="level-right">
|
||||
<div class="level-item">
|
||||
<a class="button is-rss is-small" href="{{ site.url }}/atom.xml">
|
||||
<a class="button bd-is-rss is-small" href="{{ site.url }}/atom.xml">
|
||||
<span class="icon is-small">
|
||||
<i class="fa fa-rss"></i>
|
||||
</span>
|
||||
@@ -142,11 +142,11 @@
|
||||
</div>
|
||||
</div>
|
||||
<a class="navbar-item {% if page.route == 'expo' %}is-active{% endif %}" href="{{ site.url }}/expo/">
|
||||
<span class="emoji">🎨</span>
|
||||
<span class="bd-emoji">🎨</span>
|
||||
Expo
|
||||
</a>
|
||||
<a class="navbar-item {% if page.route == 'love' %}is-active{% endif %}" href="{{ site.url }}/love/">
|
||||
<span class="emoji">❤️</span>
|
||||
<span class="bd-emoji">❤️</span>
|
||||
Love
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
<article class="media pro is-{{ include.type }}">
|
||||
<article class="media bd-pro is-{{ include.type }}">
|
||||
<aside class="media-left">
|
||||
<span class="icon">
|
||||
<i class="fa fa-{{ include.icon }}"></i>
|
||||
@@ -8,8 +8,8 @@
|
||||
<p class="title is-5 pro-title">
|
||||
{{ include.title }}
|
||||
</p>
|
||||
<div class="pro-content">
|
||||
<div class="bd-pro-content">
|
||||
{{ include.content | markdownify }}
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</article>
|
||||
|
||||
@@ -1,39 +1,39 @@
|
||||
<div class="container">
|
||||
<div class="columns">
|
||||
<div class="column is-4">
|
||||
<article class="testimonial">
|
||||
<article class="bd-testimonial">
|
||||
<blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">So, I was making an exam and in a matter of 30 minutes I had my structure complete with responsive, Bulma is crazy. Thanks <a href="https://twitter.com/jgthms">@jgthms</a></p>— Francisco Cruz (@atFranCruz) <a href="https://twitter.com/atFranCruz/status/868829487072464897">May 28, 2017</a></blockquote>
|
||||
</article>
|
||||
|
||||
<article class="testimonial">
|
||||
<article class="bd-testimonial">
|
||||
<blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr"><a href="https://twitter.com/jgthms">@jgthms</a> Hey Jeremy! Been putting Bulma into a project during the last days - absolutely love it! Well done! 😍</p>— Simon Jaeger (@simonjaegr) <a href="https://twitter.com/simonjaegr/status/834140257054502913">February 21, 2017</a></blockquote>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<div class="column is-4">
|
||||
<article class="testimonial">
|
||||
<article class="bd-testimonial">
|
||||
<blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">Bulma, I think I'm in love. <a href="https://t.co/APYefmC1Bs">https://t.co/APYefmC1Bs</a> via <a href="https://twitter.com/jgthms">@jgthms</a></p>— Jesse Schoff (@jesseschoff) <a href="https://twitter.com/jesseschoff/status/869284735440363520">May 29, 2017</a></blockquote>
|
||||
</article>
|
||||
|
||||
<article class="testimonial">
|
||||
<article class="bd-testimonial">
|
||||
<blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr"><a href="https://t.co/ClYmBd8tGR">https://t.co/ClYmBd8tGR</a> is an impressive CSS framework. Flexbox grid, no JS, modular components (use what you need), Sass.<br><br>💯 <a href="https://twitter.com/jgthms">@jgthms</a>.</p>— scottgallant (@scottgallant) <a href="https://twitter.com/scottgallant/status/835834634655174658">February 26, 2017</a></blockquote>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<div class="column is-4">
|
||||
<article class="testimonial">
|
||||
<article class="bd-testimonial">
|
||||
<blockquote class="twitter-tweet" data-cards="hidden" data-lang="en"><p lang="en" dir="ltr">I usually hate having to write CSS, but I really like working with the lightweight Bulma (<a href="https://t.co/OAMLjKWzak">https://t.co/OAMLjKWzak</a>) by <a href="https://twitter.com/jgthms">@jgthms</a> so far 👍</p>— mario zupan (@mzupzup) <a href="https://twitter.com/mzupzup/status/874925154475929602">June 14, 2017</a></blockquote>
|
||||
</article>
|
||||
|
||||
<article class="testimonial">
|
||||
<article class="bd-testimonial">
|
||||
<blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr"><a href="https://twitter.com/jgthms">@jgthms</a> Hey.I just stopped by here to say thank you so much for Bulma. It made my website looks 100 times better 😍</p>— juliooooo (@juliooooo000) <a href="https://twitter.com/juliooooo000/status/819710615337857024">January 13, 2017</a></blockquote>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="more-loves">
|
||||
<p class="more-loves-container">
|
||||
<a class="button is-medium is-danger rainbow" href="{{ site.url }}/love/">
|
||||
<div class="bd-more-loves">
|
||||
<p class="bd-more-loves-container">
|
||||
<a class="button is-medium is-danger bd-rainbow" href="{{ site.url }}/love/">
|
||||
<span>See more <strong>love</strong> 🤗</span>
|
||||
</a>
|
||||
</p>
|
||||
|
||||
@@ -1,27 +1,27 @@
|
||||
{% assign twUrl = "https://twitter.com/" | append: include.username | append: "/status/" | append: include.id %}
|
||||
|
||||
<article class="tw">
|
||||
<header class="tw-header">
|
||||
<a class="tw-author" href="{{ twUrl }}" target="_blank">
|
||||
<figure class="tw-avatar">
|
||||
<article class="bd-tw">
|
||||
<header class="bd-tw-header">
|
||||
<a class="bd-tw-author" href="{{ twUrl }}" target="_blank">
|
||||
<figure class="bd-tw-avatar">
|
||||
<img src="{{ include.avatar }}">
|
||||
</figure>
|
||||
<div class="tw-name">
|
||||
<strong class="tw-fullname">
|
||||
<div class="bd-tw-name">
|
||||
<strong class="bd-tw-fullname">
|
||||
{{ include.fullname }}
|
||||
</strong>
|
||||
<span class="tw-username">
|
||||
<span class="bd-tw-username">
|
||||
@{{ include.username }}
|
||||
</span>
|
||||
</div>
|
||||
</a>
|
||||
</header>
|
||||
|
||||
<div class="tw-content">
|
||||
<div class="bd-tw-content">
|
||||
{{ include.content }}
|
||||
</div>
|
||||
|
||||
<p class="tw-date">
|
||||
<p class="bd-tw-date">
|
||||
<a href="{{ twUrl }}" target="_blank">
|
||||
{{ include.date }}
|
||||
</a>
|
||||
|
||||
@@ -75,9 +75,9 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="more-loves">
|
||||
<p class="more-loves-container">
|
||||
<a class="button is-medium is-danger rainbow" href="{{ site.url }}/love/">
|
||||
<div class="bd-more-loves">
|
||||
<p class="bd-more-loves-container">
|
||||
<a class="button is-medium is-danger bd-rainbow" href="{{ site.url }}/love/">
|
||||
<span>See more <strong>love</strong> 🤗</span>
|
||||
</a>
|
||||
</p>
|
||||
|
||||
Reference in New Issue
Block a user