mirror of
https://github.com/jgthms/bulma.git
synced 2024-12-26 14:34:22 +00:00
Fix navbar link color
This commit is contained in:
parent
7b6755ea72
commit
befa6b68b0
@ -126,6 +126,10 @@
|
|||||||
margin-left: 0
|
margin-left: 0
|
||||||
margin-right: 0
|
margin-right: 0
|
||||||
text-align: left
|
text-align: left
|
||||||
|
&:not(:first-child)
|
||||||
|
margin-top: 1em
|
||||||
|
&:not(:last-child)
|
||||||
|
margin-bottom: 1em
|
||||||
|
|
||||||
.content li .highlight
|
.content li .highlight
|
||||||
margin-top: 0.5em
|
margin-top: 0.5em
|
||||||
|
@ -1,4 +1,7 @@
|
|||||||
.content
|
.content
|
||||||
|
.bd-spaced
|
||||||
|
li + li
|
||||||
|
margin-top: 1em
|
||||||
.highlighter-rouge
|
.highlighter-rouge
|
||||||
&:not(:last-child)
|
&:not(:last-child)
|
||||||
margin-bottom: 1.5rem
|
margin-bottom: 1.5rem
|
||||||
|
@ -6556,10 +6556,10 @@ html.has-navbar-fixed-bottom {
|
|||||||
}
|
}
|
||||||
|
|
||||||
a.navbar-item:hover, a.navbar-item.is-active,
|
a.navbar-item:hover, a.navbar-item.is-active,
|
||||||
.navbar-link:hover,
|
a.navbar-link:hover,
|
||||||
.navbar-link.is-active {
|
a.navbar-link.is-active {
|
||||||
background-color: whitesmoke;
|
background-color: whitesmoke;
|
||||||
color: #0a0a0a;
|
color: #3273dc;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-item {
|
.navbar-item {
|
||||||
@ -6675,8 +6675,8 @@ a.navbar-item:hover, a.navbar-item.is-active,
|
|||||||
min-height: 3.25rem;
|
min-height: 3.25rem;
|
||||||
}
|
}
|
||||||
.navbar.is-transparent a.navbar-item:hover, .navbar.is-transparent a.navbar-item.is-active,
|
.navbar.is-transparent a.navbar-item:hover, .navbar.is-transparent a.navbar-item.is-active,
|
||||||
.navbar.is-transparent .navbar-link:hover,
|
.navbar.is-transparent a.navbar-link:hover,
|
||||||
.navbar.is-transparent .navbar-link.is-active {
|
.navbar.is-transparent a.navbar-link.is-active {
|
||||||
background-color: transparent !important;
|
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 {
|
.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;
|
padding-bottom: 3.25rem;
|
||||||
}
|
}
|
||||||
a.navbar-item.is-active,
|
a.navbar-item.is-active,
|
||||||
.navbar-link.is-active {
|
a.navbar-link.is-active {
|
||||||
color: #0a0a0a;
|
color: #0a0a0a;
|
||||||
}
|
}
|
||||||
a.navbar-item.is-active:not(:hover),
|
a.navbar-item.is-active:not(:hover),
|
||||||
.navbar-link.is-active:not(:hover) {
|
a.navbar-link.is-active:not(:hover) {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
}
|
}
|
||||||
.navbar-item.has-dropdown:hover .navbar-link, .navbar-item.has-dropdown.is-active .navbar-link {
|
.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;
|
text-align: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.content .highlight:not(:first-child) {
|
||||||
|
margin-top: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content .highlight:not(:last-child) {
|
||||||
|
margin-bottom: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
.content li .highlight {
|
.content li .highlight {
|
||||||
margin-top: 0.5em;
|
margin-top: 0.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.content .bd-spaced li + li {
|
||||||
|
margin-top: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
.content .highlighter-rouge:not(:last-child) {
|
.content .highlighter-rouge:not(:last-child) {
|
||||||
margin-bottom: 1.5rem;
|
margin-bottom: 1.5rem;
|
||||||
}
|
}
|
||||||
|
@ -746,7 +746,7 @@ document.addEventListener('DOMContentLoaded', function () {
|
|||||||
<p>
|
<p>
|
||||||
A <code>navbar-item</code> is a repeatable element that can be:
|
A <code>navbar-item</code> is a repeatable element that can be:
|
||||||
</p>
|
</p>
|
||||||
<ul>
|
<ul class="bd-spaced">
|
||||||
<li>
|
<li>
|
||||||
a navigation <strong>link</strong>
|
a navigation <strong>link</strong>
|
||||||
{% highlight html %}{{ navbar_item_link_example }}{% endhighlight %}
|
{% highlight html %}{{ navbar_item_link_example }}{% endhighlight %}
|
||||||
@ -813,7 +813,7 @@ document.addEventListener('DOMContentLoaded', function () {
|
|||||||
<p>
|
<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:
|
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>
|
</p>
|
||||||
<ul>
|
<ul class="bd-spaced">
|
||||||
<li>
|
<li>
|
||||||
Add either <code>is-fixed-top</code> or <code>is-fixed-bottom</code> to the <code>navbar</code> component
|
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 %}
|
{% highlight html %}<nav class="navbar is-fixed-top">{% endhighlight %}
|
||||||
@ -832,13 +832,13 @@ document.addEventListener('DOMContentLoaded', function () {
|
|||||||
<span class="icon">
|
<span class="icon">
|
||||||
<i class="fa fa-square-o"></i>
|
<i class="fa fa-square-o"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>Fix top navbar</span>
|
<span>Fix <strong>top</strong> navbar</span>
|
||||||
</a>
|
</a>
|
||||||
<a id="navbarFixBottom" class="button is-link">
|
<a id="navbarFixBottom" class="button is-link">
|
||||||
<span class="icon">
|
<span class="icon">
|
||||||
<i class="fa fa-square-o"></i>
|
<i class="fa fa-square-o"></i>
|
||||||
</span>
|
</span>
|
||||||
<span>Show bottom navbar</span>
|
<span>Show <strong>bottom</strong> navbar</span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -3,7 +3,7 @@ $navbar-height: 3.25rem !default
|
|||||||
$navbar-fixed-z: 30 !default
|
$navbar-fixed-z: 30 !default
|
||||||
|
|
||||||
$navbar-item-color: $grey-dark !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-hover-background-color: $background !default
|
||||||
$navbar-item-active-color: $black !default
|
$navbar-item-active-color: $black !default
|
||||||
$navbar-item-active-background-color: transparent !default
|
$navbar-item-active-background-color: transparent !default
|
||||||
@ -144,7 +144,7 @@ html.has-navbar-fixed-bottom
|
|||||||
position: relative
|
position: relative
|
||||||
|
|
||||||
a.navbar-item,
|
a.navbar-item,
|
||||||
.navbar-link
|
a.navbar-link
|
||||||
&:hover,
|
&:hover,
|
||||||
&.is-active
|
&.is-active
|
||||||
background-color: $navbar-item-hover-background-color
|
background-color: $navbar-item-hover-background-color
|
||||||
@ -238,7 +238,7 @@ a.navbar-item,
|
|||||||
min-height: $navbar-height
|
min-height: $navbar-height
|
||||||
&.is-transparent
|
&.is-transparent
|
||||||
a.navbar-item,
|
a.navbar-item,
|
||||||
.navbar-link
|
a.navbar-link
|
||||||
&:hover,
|
&:hover,
|
||||||
&.is-active
|
&.is-active
|
||||||
background-color: transparent !important
|
background-color: transparent !important
|
||||||
@ -360,7 +360,7 @@ a.navbar-item,
|
|||||||
padding-bottom: $navbar-height
|
padding-bottom: $navbar-height
|
||||||
// Hover/Active states
|
// Hover/Active states
|
||||||
a.navbar-item,
|
a.navbar-item,
|
||||||
.navbar-link
|
a.navbar-link
|
||||||
&.is-active
|
&.is-active
|
||||||
color: $navbar-item-active-color
|
color: $navbar-item-active-color
|
||||||
&.is-active:not(:hover)
|
&.is-active:not(:hover)
|
||||||
|
Loading…
Reference in New Issue
Block a user