"love": {
"name": "Love",
"path": "/love"
+ },
+ "bootstrap": {
+ "name": "Alternative to Bootstrap",
+ "path": "/alternative-to-bootstrap"
}
},
"categories": {
-<div class="bd-banner is-patreon">
- <p class="bd-banner-text">
- <strong>Support Bulma</strong> on Patreon
- </p>
- <a class="bd-banner-button" href="https://www.patreon.com/jgthms" target="_blank">
- <img src="/images/patreon.png" alt="Become a patron">
- </a>
-</div>
+<a class="bd-patreon-button" href="https://www.patreon.com/jgthms" target="_blank">
+ <img src="{{ site.url }}/images/become-a-patron.png" alt="Become a patron" width="148" height="36">
+</a>
--- /dev/null
+<h4 class="bd-footer-title">
+ <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://jgthms.com" property="cc:attributionName" rel="cc:attributionURL" target="_blank">Jeremy Thomas</a>.
+</h4>
+
+<div class="bd-footer-iframe">
+ <a href="{{ site.data.meta.twitter }}" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
+</div>
+
+<div class="bd-footer-tsp">
+ Source code licensed <a href="https://opensource.org/licenses/mit-license.php">MIT</a>.
+ <br>
+ Website content licensed <a rel="license" href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>
+</div>
--- /dev/null
+{% assign boostrap_link = site.data.links.by_id['boostrap'] %}
+{% assign expo_link = site.data.links.by_id['expo'] %}
+{% assign love_link = site.data.links.by_id['love'] %}
+
+<div class="bd-footer-stars">
+ <a class="bd-footer-star bd-is-bootstrap" href="{{ site.url }}{{ boostrap_link.path }}">
+ <header class="bd-footer-star-header">
+ <h4 class="bd-footer-title">
+ <strong>Coming from Bootstrap</strong>
+ </h4>
+ <p class="bd-footer-subtitle">
+ An alternative to Bootstrap
+ </p>
+ </header>
+
+ <figure class="bd-footer-star-figure">
+ <img src="{{ site.url }}/images/footer/bootstrap-to-bulma.png" width="160" height="48">
+ </figure>
+ </a>
+
+ <a class="bd-footer-star bd-is-expo" href="{{ site.url }}{{ expo_link.path }}">
+ <header class="bd-footer-star-header">
+ <h4 class="bd-footer-title">
+ <span class="icon bd-has-text-star">
+ <i class="fas fa-star"></i>
+ </span>
+ <strong>Expo</strong>
+ </h4>
+ <p class="bd-footer-subtitle">
+ See what you can build with Bulma
+ </p>
+ </header>
+ </a>
+
+ <a class="bd-footer-star bd-is-love" href="{{ site.url }}{{ love_link.path }}">
+ <header class="bd-footer-star-header">
+ <h4 class="bd-footer-title">
+ <span class="icon has-text-danger">
+ <i class="fas fa-heart"></i>
+ </span>
+ <strong>Love</strong>
+ </h4>
+ <p class="bd-footer-subtitle">
+ Fans of Bulma
+ </p>
+ </header>
+ </a>
+</div>
--- /dev/null
+<h4 class="bd-footer-title">
+ <strong>Contribute</strong> on GitHub
+</h4>
+
+<div class="bd-footer-iframe">
+ <iframe src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
+
+ <iframe src="https://ghbtns.com/github-btn.html?user=jgthms&type=follow&count=true&size=large" frameborder="0" scrolling="0" width="170px" height="30px"></iframe>
+</div>
--- /dev/null
+<h4 class="bd-footer-title">
+ <strong>Share</strong> on social media
+</h4>
+
+<div class="bd-footer-iframe">
+ <a href="https://twitter.com/share" class="twitter-share-button" data-text="{{ site.data.meta.title }}" data-url="{{ site.url }}" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
+
+ <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
+</div>
--- /dev/null
+<div class="bd-footer-support">
+ <h4 class="bd-footer-title">
+ <strong>Support</strong> Bulma
+ </h4>
+
+ <div class="bd-footer-donations columns">
+ <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}}/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>
+
+ <div class="bd-footer-donation column">
+ <p class="bd-footer-donation-title">
+ <strong>Monthly</strong> donation
+ </p>
+ <div class="bd-footer-donation-action">
+ {% include elements/patreon.html %}
+ </div>
+ </div>
+ </div>
+</div>
{% include global/sponsors.html %}
+<hr class="is-marginless">
+
{% include global/newsletter.html %}
<footer class="footer">
<div class="container">
<div class="columns">
<div class="column is-4">
- <div id="about" class="content">
- <strong xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">Bulma</strong> by <a xmlns:cc="http://creativecommons.org/ns#" href="https://jgthms.com" property="cc:attributionName" rel="cc:attributionURL">Jeremy Thomas</a>.
- <div class="twitter-container">
- <a href="{{ site.data.meta.twitter }}" class="twitter-follow-button" data-show-count="true" data-lang="en" data-size="large">@jgthms</a>
- </div>
- <p id="alternative">
- <a href="{{ site.url }}/alternative-to-bootstrap/">An alternative to <strong>Bootstrap</strong></a>
- </p>
- </div>
+ {% include footer/about.html %}
</div>
- <div class="column is-4">
- <div id="share" class="content">
- <div>
- <strong>Support</strong> and share the love!
- </div>
- <div id="social">
- <iframe class="github-btn" src="https://ghbtns.com/github-btn.html?user=jgthms&repo=bulma&type=star&count=true&size=large" allowtransparency="true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
-
- <a href="https://twitter.com/share" class="twitter-share-button" data-text="{{ site.data.meta.title }}" data-url="{{ site.url }}" data-count="horizontal" data-via="jgthms" data-related="jgthms:Creator of Bulma" data-size="large">Tweet</a>
-
- <div class="fb-like" data-href="https://www.facebook.com/bulmaio" data-layout="button" data-action="like" data-size="large" data-show-faces="false" data-share="true"></div>
-
- <a class="bd-patreon-button" href="https://www.patreon.com/jgthms" target="_blank">
- <img src="/images/patreon.png" alt="Become a patron">
- </a>
-
- <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}}/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>
- </div>
- <div class="column is-4">
- <div id="sister">
- <p>
- More <strong>helpful</strong> tools:
- </p>
- <ul>
- <li>
- <a href="http://cssreference.io">
- <img src="{{site.url}}/images/css-reference-logo.png" alt="CSS Reference logo">
- </a>
- </li>
- <li>
- <a href="http://htmlreference.io">
- <img src="{{site.url}}/images/html-reference-logo.png" alt="HTML Reference logo">
- </a>
- </li>
- </ul>
- </div>
- </div>
- </div>
-
- <div id="tsp">
- <p>
- <a href="{{ site.url }}/made-with-bulma/">
- <img src="{{ site.url }}/images/made-with-bulma.png" alt="Made with Bulma" width="128" height="24">
- </a>
- <small>
- Get the <a href="{{ site.url }}/made-with-bulma/">badge</a>!
- <br>
- Source code licensed <a href="https://opensource.org/licenses/mit-license.php">MIT</a>.
- <br>
- Website content licensed <a rel="license" href="https://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a>.
- </small>
- </p>
</div>
</div>
</footer>
<div class="navbar-item">
<div class="field is-grouped is-grouped-multiline">
<p class="control">
- <a href="https://www.patreon.com/jgthms" target="_blank" style="display: block;">
- <img
- style="border-radius: 3px; display: block; max-height: 36px;"
- src="/images/become_a_patron_button.png"
- width="153"
- height="36"
- srcset="/images/become_a_patron_button@3x.png 3x,
- /images/become_a_patron_button@2x.png 2x,
- /images/become_a_patron_button.png 1x"
- alt="Become a patron">
- </a>
+ {% include elements/patreon.html %}
</p>
<p class="control">
<a class="button is-primary" href="{{ site.data.meta.download }}">
-<section id="newsletter" class="hero is-primary">
- <div class="hero-body">
- <div class="container">
- <div class="columns is-vcentered">
- <div class="column is-one-third is-left">
- <p class="title">Bulma <strong>Newsletter</strong></p>
- <p class="subtitle">Get notified when v1 is ready!</p>
- </div>
+<section id="newsletter" class="section is-medium">
+ <div class="container">
+ <div class="columns is-vcentered">
+ <div class="column">
+ <p class="title">Newsletter</p>
+ <p class="subtitle is-4 has-text-grey-light">Features, releases, showcase… stay in the loop!</p>
+ </div>
- <div class="column">
- <form action="https://mail.jgthms.com/subscribe" method="POST" accept-charset="utf-8">
- <div class="field is-grouped">
- <div class="control has-icons-left is-expanded">
- <input type="email" value="" name="email" class="input is-flat required email" placeholder="email address" required>
- <span class="icon is-small is-left">
- <i class="fas fa-envelope"></i>
- </span>
- </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="submit" value="Subscribe" name="submit" id="mc-embedded-subscribe" class="button is-white is-outlined">
+ <div class="column">
+ <form action="https://mail.jgthms.com/subscribe" method="POST" accept-charset="utf-8">
+ <div class="field is-grouped">
+ <div class="control has-icons-left is-expanded">
+ <input type="email" value="" name="email" class="input is-flat required email" placeholder="email address" required>
+ <span class="icon is-small is-left">
+ <i class="fas fa-envelope"></i>
+ </span>
+ </div>
+ <div class="control">
+ <div class="is-hidden">
+ <input type="text" name="hp" id="hp">
</div>
+ <input type="hidden" name="list" value="So5UY3O9gHJkq892bn763Tyf4A">
+ <button class="button is-link">
+ <strong>Subscribe</strong>
+ </button>
</div>
- </form>
- </div>
+ </div>
+ </form>
</div>
</div>
</div>
-</section>
\ No newline at end of file
+</section>
-<section class="hero">
- <div class="hero-body">
- <div class="container">
- <div class="columns is-vcentered">
- <div class="column is-4">
- <p class="title">Bulma <strong>Sponsors</strong></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>
+<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>
-#about
- .twitter-container
- display: block
- height: 30px
- line-height: 30px
- margin-top: 0.5rem
- small
- display: block
- margin-top: 5px
-
-#mc_embed_signup
- .field
- margin-bottom: 0
- .notification
- margin-top: 0.75rem
-
-#share
- form
- height: 30px
- margin-top: 10px
+.bd-footer-title
+ color: $text-strong
+ font-size: 1.25rem
+ line-height: 1.25
+ margin-bottom: 1rem
+ transition-duration: $speed
+ transition-property: color
+ strong
+ font-weight: $weight-semibold
+
+.bd-footer-subtitle
+ color: $grey-light
+ margin-top: -1rem
+ transition-duration: $speed
+ transition-property: color
-#social
- align-items: center
+.bd-footer-iframe
display: flex
flex-wrap: wrap
- justify-content: flex-start
- max-width: 400px
- > iframe,
- > a,
- > form,
- > div
- display: inline-block
- font-size: 11px
- height: 30px
- line-height: 30px
- margin-top: 0.5rem
- .github-btn
- width: 160px
- .twitter-share-button
- margin-right: 10px
- min-width: 76px
- .paypal-form
- min-width: 148px
+ min-height: 30px
.fb-like
- align-items: center
- display: flex
- width: 130px
- .bd-patreon-button
+ margin-left: 10px
+
+.bd-footer-tsp
+ color: $grey-light
+ margin-top: 1.5rem
+
+%bd-footer-box
+ background-color: $white
+ border-radius: $radius-large
+ box-shadow: 0 1.5rem 1.5rem -1.25rem rgba($black, 0.1)
+ display: block
+ text-align: center
+ .bd-footer-title
+ font-size: 1.5rem
+ margin-bottom: 1rem
+
+// Support
+
+.bd-footer-support
+ @extend %bd-footer-box
+ margin-bottom: 3rem
+ margin-top: 2.25rem
+ padding: 2.5rem
+
+.bd-footer-donations
+ justify-content: center
+
+.bd-footer-donation
+ flex: none
+ width: 240px
+
+.bd-footer-donation-title
+ color: $grey-light
+ margin-bottom: 0.5rem
+ strong
+ color: currentColor
+
+.bd-footer-donation-action
+ @extend %center
+ min-height: 36px
+ .paypal-form
height: 30px
- margin-right: 0.5rem
- width: 128px
+ img
+ display: block
-#newsletter
- .input
- border-color: $white
- box-shadow: none
+// Stars
-#sister
- ul
- display: flex
- flex-wrap: wrap
- li
+$star-figure-height: 156px
+
+.bd-footer-stars
+ +tablet
+ align-items: stretch
display: flex
- height: 30px
- margin: 5px 1rem 0 0
- img
- height: 30px
+ justify-content: space-between
-#tsp
- margin-top: 3rem
- text-align: center
- small
- display: block
-
-#alternative
- font-size: 0.875rem
- margin-top: 0.5rem
- a
- color: $text-light
- &:hover
- text-decoration: underline
+.bd-footer-star
+ @extend %bd-footer-box
+ transition-duration: $speed
+ transition-property: box-shadow, transform
+ will-change: box-shadow, transform
+ +mobile
+ &:not(:last-child)
+ margin-bottom: 1.5rem
+ +tablet
+ width: calc(33.3333% - 2rem)
+ &:hover
+ box-shadow: 0 3rem 3rem -1.25rem rgba($black, 0.1)
+ transform: translateY(-0.5rem)
+ .bd-footer-title,
+ .bd-footer-subtitle
+ color: $link
+ &.bd-is-expo,
+ &.bd-is-love
+ padding-bottom: $star-figure-height
+ .bd-footer-title
+ align-items: center
+ display: flex
+ justify-content: center
+ .icon
+ margin-right: 0.25em
+ &.bd-is-expo
+ background-image: url("/images/footer/expo-examples.png")
+ background-repeat: repeat-x
+ background-position: bottom center
+ background-size: 352px $star-figure-height
+ &.bd-is-love
+ background-image: url("/images/footer/love.png")
+ background-repeat: no-repeat
+ background-position: bottom center
+ background-size: 440px 180px
+
+
+.bd-footer-star-header
+ padding: 1.5rem
+
+.bd-footer-star-figure
+ @extend %center
+ height: $star-figure-height
+ margin-top: -1rem
max-height: 100%
max-width: 100%
+.bd-patreon-button
+ img
+ border-radius: $radius
+
$carbon-spacing: 1rem
$carbon-shadow-size: 0.75rem
$carbon-image-height: 100px
$main-spacing: 3rem
$intro-width: 1080px
+$navbar-item-img-max-height: none
+
%center
align-items: center
display: flex
@charset "UTF-8";
-.bd-columns-tool {
+.bd-columns-tool, .bd-footer-donation-action, .bd-footer-star-figure {
align-items: center;
display: flex;
justify-content: center;
}
img,
-embed,
-iframe,
-object,
audio,
video {
height: auto;
}
.navbar-item img {
- max-height: 1.75rem;
+ max-height: none;
}
.navbar-item.has-dropdown {
}
.footer {
- background-color: whitesmoke;
+ background-color: #fafafa;
padding: 3rem 1.5rem 6rem;
}
max-width: 100%;
}
+.bd-patreon-button img {
+ border-radius: 4px;
+}
+
#carboncontainer {
align-items: center;
display: flex;
}
}
-#about .twitter-container {
- display: block;
- height: 30px;
- line-height: 30px;
- margin-top: 0.5rem;
+.bd-footer-title {
+ color: #363636;
+ font-size: 1.25rem;
+ line-height: 1.25;
+ margin-bottom: 1rem;
+ transition-duration: 86ms;
+ transition-property: color;
+}
+
+.bd-footer-title strong {
+ font-weight: 600;
+}
+
+.bd-footer-subtitle {
+ color: #b5b5b5;
+ margin-top: -1rem;
+ transition-duration: 86ms;
+ transition-property: color;
+}
+
+.bd-footer-iframe {
+ display: flex;
+ flex-wrap: wrap;
+ min-height: 30px;
}
-#about small {
+.bd-footer-iframe .fb-like {
+ margin-left: 10px;
+}
+
+.bd-footer-tsp {
+ color: #b5b5b5;
+ margin-top: 1.5rem;
+}
+
+.bd-footer-support, .bd-footer-star {
+ background-color: white;
+ border-radius: 6px;
+ box-shadow: 0 1.5rem 1.5rem -1.25rem rgba(10, 10, 10, 0.1);
display: block;
- margin-top: 5px;
+ text-align: center;
}
-#mc_embed_signup .field {
- margin-bottom: 0;
+.bd-footer-support .bd-footer-title, .bd-footer-star .bd-footer-title {
+ font-size: 1.5rem;
+ margin-bottom: 1rem;
}
-#mc_embed_signup .notification {
- margin-top: 0.75rem;
+.bd-footer-support {
+ margin-bottom: 3rem;
+ margin-top: 2.25rem;
+ padding: 2.5rem;
}
-#share form {
- height: 30px;
- margin-top: 10px;
+.bd-footer-donations {
+ justify-content: center;
}
-#social {
- align-items: center;
- display: flex;
- flex-wrap: wrap;
- justify-content: flex-start;
- max-width: 400px;
+.bd-footer-donation {
+ flex: none;
+ width: 240px;
}
-#social > iframe,
-#social > a,
-#social > form,
-#social > div {
- display: inline-block;
- font-size: 11px;
+.bd-footer-donation-title {
+ color: #b5b5b5;
+ margin-bottom: 0.5rem;
+}
+
+.bd-footer-donation-title strong {
+ color: currentColor;
+}
+
+.bd-footer-donation-action {
+ min-height: 36px;
+}
+
+.bd-footer-donation-action .paypal-form {
height: 30px;
- line-height: 30px;
- margin-top: 0.5rem;
}
-#social .github-btn {
- width: 160px;
+.bd-footer-donation-action .paypal-form img {
+ display: block;
}
-#social .twitter-share-button {
- margin-right: 10px;
- min-width: 76px;
+@media screen and (min-width: 769px), print {
+ .bd-footer-stars {
+ align-items: stretch;
+ display: flex;
+ justify-content: space-between;
+ }
}
-#social .paypal-form {
- min-width: 148px;
+.bd-footer-star {
+ transition-duration: 86ms;
+ transition-property: box-shadow, transform;
+ will-change: box-shadow, transform;
}
-#social .fb-like {
- align-items: center;
- display: flex;
- width: 130px;
+@media screen and (max-width: 768px) {
+ .bd-footer-star:not(:last-child) {
+ margin-bottom: 1.5rem;
+ }
}
-#social .bd-patreon-button {
- height: 30px;
- margin-right: 0.5rem;
- width: 128px;
+@media screen and (min-width: 769px), print {
+ .bd-footer-star {
+ width: calc(33.3333% - 2rem);
+ }
}
-#newsletter .input {
- border-color: white;
- box-shadow: none;
+.bd-footer-star:hover {
+ box-shadow: 0 3rem 3rem -1.25rem rgba(10, 10, 10, 0.1);
+ transform: translateY(-0.5rem);
}
-#sister ul {
- display: flex;
- flex-wrap: wrap;
+.bd-footer-star:hover .bd-footer-title,
+.bd-footer-star:hover .bd-footer-subtitle {
+ color: #3273dc;
}
-#sister li {
- display: flex;
- height: 30px;
- margin: 5px 1rem 0 0;
+.bd-footer-star.bd-is-expo, .bd-footer-star.bd-is-love {
+ padding-bottom: 156px;
}
-#sister img {
- height: 30px;
+.bd-footer-star.bd-is-expo .bd-footer-title, .bd-footer-star.bd-is-love .bd-footer-title {
+ align-items: center;
+ display: flex;
+ justify-content: center;
}
-#tsp {
- margin-top: 3rem;
- text-align: center;
+.bd-footer-star.bd-is-expo .bd-footer-title .icon, .bd-footer-star.bd-is-love .bd-footer-title .icon {
+ margin-right: 0.25em;
}
-#tsp small {
- display: block;
+.bd-footer-star.bd-is-expo {
+ background-image: url("/images/footer/expo-examples.png");
+ background-repeat: repeat-x;
+ background-position: bottom center;
+ background-size: 352px 156px;
}
-#alternative {
- font-size: 0.875rem;
- margin-top: 0.5rem;
+.bd-footer-star.bd-is-love {
+ background-image: url("/images/footer/love.png");
+ background-repeat: no-repeat;
+ background-position: bottom center;
+ background-size: 440px 180px;
}
-#alternative a {
- color: #7a7a7a;
+.bd-footer-star-header {
+ padding: 1.5rem;
}
-#alternative a:hover {
- text-decoration: underline;
+.bd-footer-star-figure {
+ height: 156px;
+ margin-top: -1rem;
}
::-moz-selection {
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bulma test page</title>
- <link rel="stylesheet" href="{{ site.url }}/css/bulma-test.css?v={{ site.time | date: "%Y%m%d%H%M" }}">
+ <link rel="stylesheet" href="{{ site.url }}/css/bulma-docs.css?v={{ site.time | date: "%Y%m%d%H%M" }}">
<script defer src="{{ site.data.icons.fontawesome5 }}"></script>
</head>
<body>
+ <!-- <object type="application/x-shockwave-flash" data="https://htmlreference.io/assets/golf.swf">
+ <param name="movie" value="https://htmlreference.io/assets/golf.swf">
+ <param name="wmode" value="transparent">
+ <p>You need to enable Flash to view this content.</p>
+ </object> -->
+ <!-- <embed src="https://www.youtube.com/embed/kmk43_2dtn0" width="640" height="480"> -->
+ <!-- <iframe width="560" height="315" src="https://www.youtube.com/embed/hK8ONv4wcbA" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe> -->
+ <!-- <iframe width="420" height="345" src="https://www.youtube.com/embed/tgbNymZ7vqY"></iframe> -->
{% include global/navbar.html %}
- {% include test/from-to.html %}
- {% include test/features.html %}
+ <footer class="footer">
+ <div class="container">
+ <div class="columns">
+ <div class="column is-4">
+ {% include footer/about.html %}
+ </div>
+ <div class="column is-4">
+ {% include footer/contribute.html %}
+ </div>
+ <div class="column is-4">
+ {% include footer/share.html %}
+ </div>
+ </div>
+ {% include footer/support.html %}
+ {% include footer/boxes.html %}
+ </div>
+ </footer>
+ <!-- {% include test/from-to.html %} -->
+ <!-- {% include test/features.html %} -->
+ <script async defer id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script>
+ <script async defer type="text/javascript">(function(d, s, id) {
+ var js, fjs = d.getElementsByTagName(s)[0];
+ if (d.getElementById(id)) return;
+ js = d.createElement(s); js.id = id;
+ js.async = true;
+ js.defer = true;
+ js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=310296819307942";
+ fjs.parentNode.insertBefore(js, fjs);
+}(document, 'script', 'facebook-jssdk'));</script>
<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 }}/lib/main.js?v={{ site.time | date: '%Y%m%d%H%M' }}"></script>
// Media
img,
-embed,
-iframe,
-object,
audio,
video
height: auto
-$footer-background-color: $background !default
+$footer-background-color: $white-bis !default
.footer
background-color: $footer-background-color