mirror of
https://github.com/jgthms/bulma.git
synced 2024-11-14 11:14:24 +00:00
Fix variables component, Fix doc tabs
This commit is contained in:
parent
291c437ab5
commit
9f89f7252c
@ -1,5 +1,4 @@
|
||||
{% capture content %}
|
||||
|
||||
{% assign anchor_name = include.anchor_name | default: 'Variables' %}
|
||||
{% assign tab = include.tab | default: page.doc-tab %}
|
||||
{% assign subtab = include.subtab | default: page.doc-subtab %}
|
||||
@ -25,49 +24,53 @@
|
||||
|
||||
You can use {{ variables_link | strip }} to <strong>customize</strong> this {{ type }}. Simply set one or multiple of these variables <em>before</em> importing Bulma. <a href="{{ site.url }}/documentation/overview/customize/">Learn how</a>.
|
||||
{% endif %}
|
||||
|
||||
{% endcapture %}
|
||||
|
||||
{% unless include.hide_anchor %}
|
||||
{% include elements/anchor.html name=anchor_name %}
|
||||
{% endunless %}
|
||||
{% capture variables_size %}{{ variables | size }}{% endcapture %}
|
||||
{% capture variables_keys_size %}{{ include.variables_keys | size }}{% endcapture %}
|
||||
|
||||
{% unless include.hide_content %}
|
||||
<div class="content">
|
||||
<p>{{ content | strip }}</p>
|
||||
{% if variables_size != '0' or variables_keys_size != '0' %}
|
||||
{% unless include.hide_anchor %}
|
||||
{% include elements/anchor.html name=anchor_name %}
|
||||
{% endunless %}
|
||||
|
||||
{% unless include.hide_content %}
|
||||
<div class="content">
|
||||
<p>{{ content | strip }}</p>
|
||||
</div>
|
||||
{% endunless %}
|
||||
|
||||
<div class="table-container">
|
||||
<table class="table {{ table_class }}">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Type</th>
|
||||
<th>Default value</th>
|
||||
<th>Computed value</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Type</th>
|
||||
<th>Default value</th>
|
||||
<th>Computed value</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
{% if include.variables_keys %}
|
||||
{% for key in include.variables_keys %}
|
||||
{% assign variable = site.data.variables[include.folder][include.file].by_name[key] %}
|
||||
{% include elements/variable-row.html variable=variable %}
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
{% for variable_name in variables %}
|
||||
{% assign variable = data.by_name[variable_name] %}
|
||||
{% include elements/variable-row.html variable=variable %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
{% endunless %}
|
||||
|
||||
<div class="table-container">
|
||||
<table class="table {{ table_class }}">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Type</th>
|
||||
<th>Default value</th>
|
||||
<th>Computed value</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Type</th>
|
||||
<th>Default value</th>
|
||||
<th>Computed value</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
{% if include.variables_keys %}
|
||||
{% for key in include.variables_keys %}
|
||||
{% assign variable = site.data.variables[include.folder][include.file].by_name[key] %}
|
||||
{% include elements/variable-row.html variable=variable %}
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
{% for variable_name in variables %}
|
||||
{% assign variable = data.by_name[variable_name] %}
|
||||
{% include elements/variable-row.html variable=variable %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
@ -72,19 +72,30 @@
|
||||
|
||||
.bd-tabs
|
||||
margin-bottom: $main-spacing
|
||||
.tabs
|
||||
overflow: visible
|
||||
ul,
|
||||
a
|
||||
border-bottom-color: $white-ter
|
||||
border-bottom-width: 2px
|
||||
ul
|
||||
flex-wrap: wrap
|
||||
max-width: 100%
|
||||
a
|
||||
margin-bottom: -2px
|
||||
li:not(.is-active) a:hover
|
||||
border-bottom-color: $border
|
||||
|
||||
+mobile
|
||||
.bd-tabs
|
||||
margin-left: -1.5rem
|
||||
margin-right: -1.5rem
|
||||
.tabs
|
||||
ul
|
||||
flex-wrap: nowrap
|
||||
|
||||
+tablet
|
||||
.bd-tabs
|
||||
.tabs
|
||||
overflow: visible
|
||||
ul,
|
||||
a
|
||||
border-bottom-color: $white-ter
|
||||
border-bottom-width: 2px
|
||||
a
|
||||
margin-bottom: -2px
|
||||
li:not(.is-active) a:hover
|
||||
border-bottom-color: $border
|
||||
ul
|
||||
flex-wrap: wrap
|
||||
max-width: 100%
|
||||
|
||||
.bd-content
|
||||
hr:first-child
|
||||
|
@ -4204,54 +4204,13 @@ a.box:active {
|
||||
}
|
||||
|
||||
.control {
|
||||
box-sizing: border-box;
|
||||
clear: both;
|
||||
font-size: 1rem;
|
||||
position: relative;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.control.has-icon .icon {
|
||||
color: #dbdbdb;
|
||||
height: 2.25em;
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 2.25em;
|
||||
z-index: 4;
|
||||
}
|
||||
|
||||
.control.has-icon .input:focus + .icon {
|
||||
color: #7a7a7a;
|
||||
}
|
||||
|
||||
.control.has-icon .input.is-small + .icon {
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.control.has-icon .input.is-medium + .icon {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
.control.has-icon .input.is-large + .icon {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.control.has-icon:not(.has-icon-right) .icon {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.control.has-icon:not(.has-icon-right) .input {
|
||||
padding-left: 2.25em;
|
||||
}
|
||||
|
||||
.control.has-icon.has-icon-right .icon {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.control.has-icon.has-icon-right .input {
|
||||
padding-right: 2.25em;
|
||||
}
|
||||
|
||||
.control.has-icons-left .input:focus ~ .icon,
|
||||
.control.has-icons-left .select:focus ~ .icon, .control.has-icons-right .input:focus ~ .icon,
|
||||
.control.has-icons-right .select:focus ~ .icon {
|
||||
@ -10404,27 +10363,35 @@ label.panel-block:hover {
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.bd-tabs .tabs {
|
||||
overflow: visible;
|
||||
@media screen and (max-width: 768px) {
|
||||
.bd-tabs {
|
||||
margin-left: -1.5rem;
|
||||
margin-right: -1.5rem;
|
||||
}
|
||||
.bd-tabs .tabs ul {
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.bd-tabs .tabs ul,
|
||||
.bd-tabs .tabs a {
|
||||
border-bottom-color: whitesmoke;
|
||||
border-bottom-width: 2px;
|
||||
}
|
||||
|
||||
.bd-tabs .tabs ul {
|
||||
flex-wrap: wrap;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.bd-tabs .tabs a {
|
||||
margin-bottom: -2px;
|
||||
}
|
||||
|
||||
.bd-tabs .tabs li:not(.is-active) a:hover {
|
||||
border-bottom-color: #dbdbdb;
|
||||
@media screen and (min-width: 769px), print {
|
||||
.bd-tabs .tabs {
|
||||
overflow: visible;
|
||||
}
|
||||
.bd-tabs .tabs ul,
|
||||
.bd-tabs .tabs a {
|
||||
border-bottom-color: whitesmoke;
|
||||
border-bottom-width: 2px;
|
||||
}
|
||||
.bd-tabs .tabs a {
|
||||
margin-bottom: -2px;
|
||||
}
|
||||
.bd-tabs .tabs li:not(.is-active) a:hover {
|
||||
border-bottom-color: #dbdbdb;
|
||||
}
|
||||
.bd-tabs .tabs ul {
|
||||
flex-wrap: wrap;
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.bd-content hr:first-child {
|
||||
|
2
docs/css/bulma-docs.min.css
vendored
2
docs/css/bulma-docs.min.css
vendored
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue
Block a user