library-mirrors/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma.git synced 2024-12-12 13:28:30 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add more page

Browse Source
This commit is contained in:
Jeremy Thomas 2018-04-10 18:22:04 +01:00
parent 67f3e64158
commit a8c0805988
10 changed files with 164 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/_data/global.json
View File

@ -9,7 +9,7 @@
},
{
"id": "expo",
"color": "bd-has-text-star",
"color": "has-text-star",
"fa_type": "fas",
"fa_icon": "fa-star",
"title": "Expo"

15
docs/_data/links.json
View File

@ -330,36 +330,51 @@
"expo": {
"name": "Expo",
"subtitle": "Official Bulma showcase",
"icon": "star",
"color": "star",
"path": "/expo"
},
"love": {
"name": "Love",
"subtitle": "Fans of Bulma around the world",
"color": "danger",
"icon": "heart",
"path": "/love"
},
"bulma-start": {
"name": "Bulma start",
"subtitle": "A tiny npm package to get started",
"icon": "rocket",
"color": "success",
"path": "/bulma-start"
},
"made-with-bulma": {
"name": "Made with Bulma",
"subtitle": "The official community badge",
"icon": "certificate",
"color": "primary",
"path": "/made-with-bulma"
},
"bootstrap": {
"name": "Coming from Bootstrap",
"subtitle": "See how Bulma is an alternative to Bootstrap",
"icon": "exchange-alt",
"color": "bootstrap",
"path": "/alternative-to-bootstrap"
},
"patreon-backers": {
"name": "Patreon backers",
"subtitle": "Everyone who is supporting Bulma",
"icon_brand": "true",
"icon": "patreon",
"color": "patreon",
"path": "/backers"
},
"extensions": {
"name": "Bulma extensions",
"subtitle": "Side projects to enhance Bulma",
"icon": "plug",
"color": "orange",
"path": "/extensions"
}
},

2
docs/_includes/footer/boxes.html
View File

@ -21,7 +21,7 @@
<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">
<span class="icon has-text-star">
<i class="fas fa-star"></i>
</span>
<strong>Expo</strong>

8
docs/_includes/footer/links.html
View File

@ -55,16 +55,18 @@
<p class="bd-footer-link bd-has-subtitle">
<a href="{{ site.url }}{{ link.path }}">
<span>
{{ link.name }}
<span class="bd-footer-link-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>
<strong>
{{ link.name }}
</strong>
<em>
{{ link.subtitle }}
</em>
</a>
</p>
{% endfor %}
</div>
</div>
</div>

18
docs/_includes/footer/support.html
View File

@ -18,6 +18,24 @@
</div>
</div>
<div class="bd-footer-donation column">
<p class="bd-footer-donation-title">
<strong>Visit</strong> our sponsor
</p>
<div class="bd-footer-donation-action">
<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 class="bd-footer-donation column">
<p class="bd-footer-donation-title">
<strong>Monthly</strong> donation

4
docs/_includes/global/footer.html
View File

@ -2,10 +2,6 @@
{% include book/book-banner.html %}
{% include global/sponsors.html %}
<hr class="is-marginless">
{% include global/newsletter.html %}
{% include footer/main.html %}

39
docs/_sass/footer.sass
View File

@ -2,7 +2,7 @@
color: $text-strong
font-size: 1.25rem
line-height: 1.25
margin-bottom: 1rem
margin-bottom: 0.5rem
transition-duration: $speed
transition-property: color
strong
@ -10,7 +10,7 @@
.bd-footer-subtitle
color: $grey-light
margin-top: -1rem
margin-top: -0.5rem
transition-duration: $speed
transition-property: color
@ -26,7 +26,7 @@
.bd-footer-tsp
color: $grey-light
margin-top: 1rem
margin-top: 1.5rem
%bd-footer-box
background-color: $white
@ -36,15 +36,16 @@
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
margin-top: 3rem
padding: 3rem
.bd-footer-title
margin-bottom: 1.5rem
.bd-footer-donations
justify-content: center
@ -61,7 +62,7 @@
.bd-footer-donation-action
@extend %center
min-height: 36px
height: 70px
.paypal-form
height: 30px
img
@ -139,13 +140,20 @@ $star-figure-height: 156px
margin-top: 1.5em
.bd-footer-link
margin-top: 0.25rem
margin-top: 0.5rem
&.bd-is-more
font-size: 0.875rem
a:not(:hover)
color: $grey-light
&.bd-has-subtitle
a
align-items: center
display: flex
justify-content: space-between
strong
flex-grow: 1
flex-shrink: 1
font-weight: unset
em
display: block
font-size: 0.875rem
@ -153,10 +161,19 @@ $star-figure-height: 156px
&:not(:hover)
em
color: $grey-light
+mobile
flex-wrap: wrap
margin-top: 1rem
em
width: 100%
+tablet
align-items: center
display: flex
justify-content: space-between
em
margin-left: 1rem
text-align: right
.bd-footer-link-icon
flex-grow: 0
flex-shrink: 0
margin-right: 0.5em
text-align: center
width: 1em

2
docs/_sass/specific.sass
View File

@ -93,7 +93,7 @@
.bd-has-text-rss
color: $rss
.bd-has-text-star
.has-text-star
color: $star
// $navbar-items: ("documentation": $primary, "templates": $info, "videos": $success, "blog": $rss, "expo": $star, "love": $red)

54
docs/css/bulma-docs.css
View File

@ -10654,7 +10654,7 @@ svg {
color: #363636;
font-size: 1.25rem;
line-height: 1.25;
margin-bottom: 1rem;
margin-bottom: 0.5rem;
transition-duration: 86ms;
transition-property: color;
}
@ -10665,7 +10665,7 @@ svg {
.bd-footer-subtitle {
color: #b5b5b5;
margin-top: -1rem;
margin-top: -0.5rem;
transition-duration: 86ms;
transition-property: color;
}
@ -10687,7 +10687,7 @@ svg {
.bd-footer-tsp {
color: #b5b5b5;
margin-top: 1rem;
margin-top: 1.5rem;
}
.bd-footer-support, .bd-footer-star {
@ -10700,13 +10700,16 @@ svg {
.bd-footer-support .bd-footer-title, .bd-footer-star .bd-footer-title {
font-size: 1.5rem;
margin-bottom: 1rem;
}
.bd-footer-support {
margin-bottom: 3rem;
margin-top: 2.25rem;
padding: 2.5rem;
margin-top: 3rem;
padding: 3rem;
}
.bd-footer-support .bd-footer-title {
margin-bottom: 1.5rem;
}
.bd-footer-donations {
@ -10728,7 +10731,7 @@ svg {
}
.bd-footer-donation-action {
min-height: 36px;
height: 70px;
}
.bd-footer-donation-action .paypal-form {
@ -10836,7 +10839,7 @@ svg {
}
.bd-footer-link {
margin-top: 0.25rem;
margin-top: 0.5rem;
}
.bd-footer-link.bd-is-more {
@ -10847,6 +10850,18 @@ svg {
color: #b5b5b5;
}
.bd-footer-link.bd-has-subtitle a {
align-items: center;
display: flex;
justify-content: space-between;
}
.bd-footer-link.bd-has-subtitle a strong {
flex-grow: 1;
flex-shrink: 1;
font-weight: unset;
}
.bd-footer-link.bd-has-subtitle a em {
display: block;
font-size: 0.875rem;
@ -10857,18 +10872,31 @@ svg {
color: #b5b5b5;
}
@media screen and (min-width: 769px), print {
@media screen and (max-width: 768px) {
.bd-footer-link.bd-has-subtitle a {
align-items: center;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-top: 1rem;
}
.bd-footer-link.bd-has-subtitle a em {
width: 100%;
}
}
@media screen and (min-width: 769px), print {
.bd-footer-link.bd-has-subtitle a em {
margin-left: 1rem;
text-align: right;
}
}
.bd-footer-link-icon {
flex-grow: 0;
flex-shrink: 0;
margin-right: 0.5em;
text-align: center;
width: 1em;
}
::-moz-selection {
background-color: #00d1b2;
color: #fff;
@ -11011,7 +11039,7 @@ svg {
color: #f26522;
}
.bd-has-text-star {
.has-text-star {
color: #FFD257;
}

53
docs/more.html Normal file
View File

@ -0,0 +1,53 @@
---
title: More
layout: default
breadcrumb:
- home
- more
---
{% include global/navbar.html id="More" %}
<main class="bd-main">
<div class="bd-main-container container">
<div class="bd-duo">
<div class="bd-lead">
{% include components/breadcrumb.html %}
<header class="bd-header">
<div class="bd-header-titles">
<h1 class="title">
More
</h1>
<p class="subtitle is-4">
Projects and content related to Bulma
</p>
</div>
<div class="bd-header-carbon">
{% include elements/carbon.html %}
</div>
</header>
<div class="bd-content">
<div class="bd-links">
{% for link_id in site.data.links.more %}
{% assign link = site.data.links.by_id[link_id] %}
<a class="bd-link bd-is-post" href="{{ site.url }}{{ link.path }}">
<h2 class="bd-link-name">
<span class="bd-link-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>
{{ link.name }}
</h2>
<p class="bd-link-subtitle">
{{ link.subtitle }}
</p>
</a>
{% endfor %}
</div>
</div>
</div>
</div>
</div>
</main>