mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-05 16:42:29 +03:00
Code Activity

new navbar ideas

Browse Source
This commit is contained in:
Mark Otto
2014-07-13 23:33:54 -07:00
parent b831dc06af
commit 3e896193ab
14 changed files with 988 additions and 856 deletions
Download Patch File Download Diff File Expand all files Collapse all files
less/buttons.less
+1 -1
View File
@@ -15,7 +15,7 @@
touch-action: manipulation;
cursor: pointer;
background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214
border: 1px solid transparent;
border: @border-width solid transparent;
white-space: nowrap;
.button-size(@padding-base-vertical; @padding-base-horizontal; @font-size-base; @line-height-base; @border-radius-base);
user-select: none;
less/navbar.less
+53 -6
View File
@@ -10,9 +10,10 @@
.navbar {
position: relative;
min-height: @navbar-height; // Ensure a navbar always shows (e.g., without a .navbar-brand in collapsed mode)
padding: @spacer;
/*min-height: @navbar-height; // Ensure a navbar always shows (e.g., without a .navbar-brand in collapsed mode)*/
margin-bottom: @navbar-margin-bottom;
border: 1px solid transparent;
/*border: 1px solid transparent;*/
// Prevent floats from breaking the navbar
&:extend(.clearfix all);
@@ -163,13 +164,15 @@
.navbar-brand {
float: left;
padding: @navbar-padding-vertical @navbar-padding-horizontal;
padding: .55rem .75rem;
margin-right: @spacer;
margin-bottom: 0; // For headings
font-size: @font-size-large;
line-height: @line-height-computed;
height: @navbar-height;
/*height: @navbar-height;*/
&:hover,
&:focus {
> a:hover,
> a:focus {
text-decoration: none;
}
@@ -177,14 +180,34 @@
display: block;
}
/*
@media (min-width: @grid-float-breakpoint) {
.navbar > .container &,
.navbar > .container-fluid & {
margin-left: -@navbar-padding-horizontal;
}
}
*/
}
// New hotness
.navbar-toggler {
float: left;
padding: .55rem .75rem;
margin-right: @spacer;
margin-bottom: 0; // For headings
font-size: @font-size-large;
line-height: @line-height-computed;
background: none;
border: 0;
&:hover,
&:focus {
text-decoration: none;
}
}
// Navbar toggle
//
@@ -225,6 +248,7 @@
}
// Navbar nav links
//
// Builds on top of the `.nav` components with its own modifier class to make
@@ -524,6 +548,29 @@
background-color: @navbar-inverse-bg;
border-color: @navbar-inverse-border;
.navbar-brand > a,
.nav-pills > .nav-item > .nav-link {
color: @navbar-inverse-link-color;
&:hover,
&:focus {
color: @navbar-inverse-link-hover-color;
}
}
.nav-pills > .nav-item > .nav-link {
&:hover,
&:focus {
color: @navbar-inverse-link-active-color;
background-color: @navbar-inverse-link-active-bg;
}
}
.nav-pills > .active > .nav-link,
.nav-pills > .nav-link.active {
color: @navbar-inverse-link-active-color;
background-color: @navbar-inverse-link-active-bg;
}
.navbar-brand {
color: @navbar-inverse-brand-color;
&:hover,
less/navs.less
+1 -3
View File
@@ -3,6 +3,7 @@
// --------------------------------------------------
.nav {
margin-bottom: 0;
.list-unstyled();
&:extend(.clearfix all);
}
@@ -44,7 +45,6 @@
//
.nav-tabs {
margin-bottom: @line-height-computed;
border-bottom: 1px solid @nav-tabs-border-color;
.nav-item {
@@ -99,8 +99,6 @@
//
.nav-pills {
margin-bottom: @line-height-computed;
.nav-item {
float: left;
less/type.less
+1 -2
View File
@@ -8,6 +8,7 @@
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
margin-top: 0;
font-family: @headings-font-family;
font-weight: @headings-font-weight;
line-height: @headings-line-height;
@@ -24,7 +25,6 @@ h1, h2, h3, h4, h5, h6,
h1, .h1,
h2, .h2,
h3, .h3 {
margin-top: @line-height-computed;
margin-bottom: (@line-height-computed / 2);
small,
@@ -35,7 +35,6 @@ h3, .h3 {
h4, .h4,
h5, .h5,
h6, .h6 {
margin-top: (@line-height-computed / 2);
margin-bottom: (@line-height-computed / 2);
small,
less/variables.less
+11 -9
View File
@@ -45,6 +45,8 @@
@enable-gradients: true;
@enable-transitions: true;
@spacer: 1rem;
@border-width: .05rem;
//== Typography
//
@@ -88,7 +90,7 @@
//## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).
@padding-base-vertical: .5rem;
@padding-base-horizontal: 1rem;
@padding-base-horizontal: .75rem;
@padding-large-vertical: .75rem;
@padding-large-horizontal: 1.5rem;
@@ -102,7 +104,7 @@
@line-height-large: 1.33;
@line-height-small: 1.5;
@border-radius-base: .2rem;
@border-radius-base: .25rem;
@border-radius-large: .3rem;
@border-radius-small: .2rem;
@@ -122,7 +124,7 @@
//## Customizes the `.table` component with basic values, each used across all table variations.
//** Padding for `<th>`s and `<td>`s.
@table-cell-padding: .6rem;
@table-cell-padding: .5rem;
//** Padding for cells in `.table-condensed`.
@table-condensed-cell-padding: .3rem;
@@ -135,7 +137,7 @@
@table-bg-active: @table-bg-hover;
//** Border color for table and cell borders.
@table-border-color: #ddd;
@table-border-color: @gray-lighter;
//== Buttons
@@ -194,11 +196,11 @@
@input-color-placeholder: #999;
//** Default `.form-control` height
@input-height-base: ((@font-size-base * @line-height-base) + (@padding-base-vertical * 2) + .2);
@input-height-base: ((@font-size-base * @line-height-base) + (@padding-base-vertical * 2) + (@border-width * 2));
//** Large `.form-control` height
@input-height-large: ((@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + .2);
@input-height-large: ((@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + (@border-width * 2));
//** Small `.form-control` height
@input-height-small: ((@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + .2);
@input-height-small: ((@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + (@border-width * 2));
@legend-color: @gray-dark;
@legend-border-color: #e5e5e5;
@@ -342,7 +344,7 @@
// Inverted navbar
// Reset inverted navbar basics
@navbar-inverse-color: lighten(@gray-light, 12%);
@navbar-inverse-bg: #222;
@navbar-inverse-bg: #373a3c;
@navbar-inverse-border: darken(@navbar-inverse-bg, 10%);
// Inverted navbar links
@@ -370,7 +372,7 @@
//##
//=== Shared nav styles
@nav-link-padding: .5em 1em;
@nav-link-padding: .6em 1em;
@nav-link-hover-bg: @gray-lighter;
@nav-disabled-link-color: @gray-light;