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

Fix navbar link color

Browse Source
This commit is contained in:
Jeremy Thomas 2017-10-26 17:54:26 +01:00
parent 7b6755ea72
commit befa6b68b0
5 changed files with 34 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
docs/_sass/highlight.sass
View File

@ -126,6 +126,10 @@
margin-left: 0
margin-right: 0
text-align: left
&:not(:first-child)
margin-top: 1em
&:not(:last-child)
margin-bottom: 1em
.content li .highlight
margin-top: 0.5em

3
docs/_sass/override.sass
View File

@ -1,4 +1,7 @@
.content
.bd-spaced
li + li
margin-top: 1em
.highlighter-rouge
&:not(:last-child)
margin-bottom: 1.5rem

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

@ -6556,10 +6556,10 @@ html.has-navbar-fixed-bottom {
}
a.navbar-item:hover, a.navbar-item.is-active,
.navbar-link:hover,
.navbar-link.is-active {
a.navbar-link:hover,
a.navbar-link.is-active {
background-color: whitesmoke;
color: #0a0a0a;
color: #3273dc;
}
.navbar-item {
@ -6675,8 +6675,8 @@ a.navbar-item:hover, a.navbar-item.is-active,
min-height: 3.25rem;
}
.navbar.is-transparent a.navbar-item:hover, .navbar.is-transparent a.navbar-item.is-active,
.navbar.is-transparent .navbar-link:hover,
.navbar.is-transparent .navbar-link.is-active {
.navbar.is-transparent a.navbar-link:hover,
.navbar.is-transparent a.navbar-link.is-active {
background-color: transparent !important;
}
.navbar.is-transparent .navbar-item.has-dropdown.is-active .navbar-link, .navbar.is-transparent .navbar-item.has-dropdown.is-hoverable:hover .navbar-link {
@ -6826,11 +6826,11 @@ a.navbar-item:hover, a.navbar-item.is-active,
padding-bottom: 3.25rem;
}
a.navbar-item.is-active,
.navbar-link.is-active {
a.navbar-link.is-active {
color: #0a0a0a;
}
a.navbar-item.is-active:not(:hover),
.navbar-link.is-active:not(:hover) {
a.navbar-link.is-active:not(:hover) {
background-color: transparent;
}
.navbar-item.has-dropdown:hover .navbar-link, .navbar-item.has-dropdown.is-active .navbar-link {
@ -9800,10 +9800,22 @@ label.panel-block:hover {
text-align: left;
}
.content .highlight:not(:first-child) {
margin-top: 1em;
}
.content .highlight:not(:last-child) {
margin-bottom: 1em;
}
.content li .highlight {
margin-top: 0.5em;
}
.content .bd-spaced li + li {
margin-top: 1em;
}
.content .highlighter-rouge:not(:last-child) {
margin-bottom: 1.5rem;
}

8
docs/documentation/components/navbar.html
View File

@ -746,7 +746,7 @@ document.addEventListener('DOMContentLoaded', function () {
<p>
A <code>navbar-item</code> is a repeatable element that can be:
</p>
<ul>
<ul class="bd-spaced">
<li>
a navigation <strong>link</strong>
{% highlight html %}{{ navbar_item_link_example }}{% endhighlight %}
@ -813,7 +813,7 @@ document.addEventListener('DOMContentLoaded', function () {
<p>
You can now <strong>fix</strong> the navbar to either the <strong>top</strong> or <strong>bottom</strong> of the page. This is a 2-step process:
</p>
<ul>
<ul class="bd-spaced">
<li>
Add either <code>is-fixed-top</code> or <code>is-fixed-bottom</code> to the <code>navbar</code> component
{% highlight html %}<nav class="navbar is-fixed-top">{% endhighlight %}
@ -832,13 +832,13 @@ document.addEventListener('DOMContentLoaded', function () {
<span class="icon">
<i class="fa fa-square-o"></i>
</span>
<span>Fix top navbar</span>
<span>Fix <strong>top</strong> navbar</span>
</a>
<a id="navbarFixBottom" class="button is-link">
<span class="icon">
<i class="fa fa-square-o"></i>
</span>
<span>Show bottom navbar</span>
<span>Show <strong>bottom</strong> navbar</span>
</a>
</div>

8
sass/components/navbar.sass
View File

@ -3,7 +3,7 @@ $navbar-height: 3.25rem !default
$navbar-fixed-z: 30 !default
$navbar-item-color: $grey-dark !default
$navbar-item-hover-color: $black !default
$navbar-item-hover-color: $link !default
$navbar-item-hover-background-color: $background !default
$navbar-item-active-color: $black !default
$navbar-item-active-background-color: transparent !default
@ -144,7 +144,7 @@ html.has-navbar-fixed-bottom
position: relative
a.navbar-item,
.navbar-link
a.navbar-link
&:hover,
&.is-active
background-color: $navbar-item-hover-background-color
@ -238,7 +238,7 @@ a.navbar-item,
min-height: $navbar-height
&.is-transparent
a.navbar-item,
.navbar-link
a.navbar-link
&:hover,
&.is-active
background-color: transparent !important
@ -360,7 +360,7 @@ a.navbar-item,
padding-bottom: $navbar-height
// Hover/Active states
a.navbar-item,
.navbar-link
a.navbar-link
&.is-active
color: $navbar-item-active-color
&.is-active:not(:hover)