Skip to content

Commit

Permalink
Moved navs inline properties to variables.less and customize.html & n…
Browse files Browse the repository at this point in the history 
…av-customize.html
  • Loading branch information
@saas786
saas786 committed Jul 25, 2013
1 parent f8d5a97 commit a06afd8
Show file tree
Hide file tree
Showing 4 changed files with 83 additions and 15 deletions.
1 change: 1 addition & 0 deletions _includes/nav-customize.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@
<li><a href="#variables-form-states">Form states</a></li>
<li><a href="#variables-alerts">Alerts</a></li>
<li><a href="#variables-navbar">Navbar</a></li>
<li><a href="#variables-nav">Nav</a></li>
<li><a href="#variables-tables">Tables</a></li>
<li><a href="#variables-forms">Forms</a></li>
<li><a href="#variables-dropdowns">Dropdowns</a></li>
Expand Down
40 changes: 40 additions & 0 deletions customize.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -771,6 +771,46 @@ <h4>Toggle</h4>
</div>
</div>


<h2 id="variables-nav">Nav</h2>
<div class="row">
<div class="col-lg-6">
<h3>Default nav</h3>
<h4>Basics</h4>
<label>@nav-link-hover-bg</label>
<input type="text" placeholder="@gray-lighter">
<label>@nav-disabled-link-color</label>
<input type="text" placeholder="@gray-light">
<label>@nav-disabled-link-hover-color</label>
<input type="text" placeholder="@gray-light">
<label>@nav-open-link-hover-color</label>
<input type="text" placeholder="#fff">
<label>@nav-open-caret-border-color</label>
<input type="text" placeholder="@fff">
<h4>Tabs</h4>
<label>@nav-tabs-border-color</label>
<input type="text" placeholder="@ddd">
<label>@nav-tabs-link-hover-border-color</label>
<input type="text" placeholder="@gray-lighter">
<label>@nav-tabs-active-link-hover-color</label>
<input type="text" placeholder="@gray">
<label>@nav-tabs-active-link-hover-bg</label>
<input type="text" placeholder="@body-bg">
<label>@nav-tabs-active-link-hover-border-color</label>
<input type="text" placeholder="#ddd">
<label>@nav-tabs-justified-link-border-color</label>
<input type="text" placeholder="#ddd">
<label>@nav-tabs-justified-active-link-border-color</label>
<input type="text" placeholder="@body-bg">
<h4>Pills</h4>
<label>@nav-pills-active-link-hover-color</label>
<input type="text" placeholder="@fff">
<label>@nav-pills-active-link-hover-bg</label>
<input type="text" placeholder="@component-active-bg">
</div>
</div>


<h2 id="variables-tables">Tables</h2>
<div class="row">
<div class="col-lg-6">
Expand Down
30 changes: 15 additions & 15 deletions less/navs.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,17 +23,17 @@
&:hover,
&:focus {
text-decoration: none;
background-color: @gray-lighter;
background-color: @nav-link-hover-bg;
}
}

// Disabled state sets text to gray and nukes hover/tab effects
&.disabled > a {
color: @gray-light;
color: @nav-disabled-link-color;

&:hover,
&:focus {
color: @gray-light;
color: @nav-disabled-link-hover-color;
text-decoration: none;
background-color: transparent;
cursor: not-allowed;
Expand All @@ -51,12 +51,12 @@
&,
&:hover,
&:focus {
color: #fff;
color: @nav-open-link-hover-color;
background-color: @link-color;
border-color: @link-color;
.caret {
border-top-color: #fff;
border-bottom-color: #fff;
border-top-color: @nav-open-caret-border-color;
border-bottom-color: @nav-open-caret-border-color;
}
}
}
Expand All @@ -83,7 +83,7 @@

// Give the tabs something to sit on
.nav-tabs {
border-bottom: 1px solid #ddd;
border-bottom: 1px solid @nav-tabs-border-color;
> li {
float: left;
// Make the list-items overlay the bottom border
Expand All @@ -96,7 +96,7 @@
border: 1px solid transparent;
border-radius: @border-radius-base @border-radius-base 0 0;
&:hover {
border-color: @gray-lighter @gray-lighter #ddd;
border-color: @nav-tabs-link-hover-border-color;
}
}

Expand All @@ -105,9 +105,9 @@
&,
&:hover,
&:focus {
color: @gray;
background-color: @body-bg;
border: 1px solid #ddd;
color: @nav-tabs-active-link-hover-color;
background-color: @nav-tabs-active-link-hover-bg;
border: 1px solid @nav-tabs-active-link-hover-border-color;
border-bottom-color: transparent;
cursor: default;
}
Expand Down Expand Up @@ -142,8 +142,8 @@
&,
&:hover,
&:focus {
color: #fff;
background-color: @component-active-bg;
color: @nav-pills-active-link-hover-color;
background-color: @nav-pills-active-link-hover-bg;
}
}
}
Expand Down Expand Up @@ -183,13 +183,13 @@
.nav-tabs-justified {
border-bottom: 0;
> li > a {
border-bottom: 1px solid #ddd;
border-bottom: 1px solid @nav-tabs-justified-link-border-color;

// Override margin from .nav-tabs
margin-right: 0;
}
> .active > a {
border-bottom-color: @body-bg;
border-bottom-color: @nav-tabs-justified-active-link-border-color;
}

}
Expand Down
27 changes: 27 additions & 0 deletions less/variables.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -234,6 +234,33 @@
@navbar-inverse-toggle-icon-bar-bg: #fff;
@navbar-inverse-toggle-border-color: #333;

// Navs
// -------------------------

@nav-link-hover-bg: @gray-lighter;

@nav-disabled-link-color: @gray-light;
@nav-disabled-link-hover-color: @gray-light;

@nav-open-link-hover-color: #fff;
@nav-open-caret-border-color: #fff;

// Tabs
@nav-tabs-border-color: #ddd;

@nav-tabs-link-hover-border-color: @gray-lighter;

@nav-tabs-active-link-hover-bg: @body-bg;
@nav-tabs-active-link-hover-color: @gray;
@nav-tabs-active-link-hover-border-color: #ddd;

@nav-tabs-justified-link-border-color: #ddd;
@nav-tabs-justified-active-link-border-color: @body-bg;

// Pills
@nav-pills-active-link-hover-bg: @component-active-bg;

@nav-pills-active-link-hover-color: #fff;

// Pagination
// -------------------------
Expand Down

0 comments on commit a06afd8

Please sign in to comment.