Skip to content

B
bootstrap
Commit 8a594a25 authored by Mark Otto's avatar Mark Otto
Browse files
Options

Merge branch '3.0.0-wip' into gh-pages

parents 1174e777 f4b744e6
Expand all Show whitespace changes
Inline Side-by-side
Showing with 817 additions and 710 deletions
Gruntfile.js
View file @ 8a594a25
......@@ -166,10 +166,10 @@ module.exports = function(grunt) {
grunt.loadNpmTasks('browserstack-runner');
// Docs HTML validation task
grunt.registerTask('validate-docs', ['jekyll', 'validation']);
grunt.registerTask('validate-html', ['jekyll', 'validation']);
// Test task.
var testSubtasks = ['jshint', 'qunit', 'validate-docs'];
var testSubtasks = ['dist-css', 'jshint', 'qunit', 'validate-html'];
// Only run BrowserStack tests under Travis
if (process.env.TRAVIS) {
// Only run BrowserStack tests if this is a mainline commit in twbs/bootstrap, or you have your own BrowserStack key
......
_layouts/home.html
View file @ 8a594a25
......@@ -25,7 +25,7 @@
<a href="{{ site.repo }}" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'GitHub project']);">GitHub project</a>
</li>
<li>
<a href="{{ page.base_url }}getting-started#/examples" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Examples']);">Examples</a>
<a href="{{ page.base_url }}getting-started/#examples" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Examples']);">Examples</a>
</li>
<li>
<a href="{{ page.base_url }}components/#glyphicons" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Glyphicons']);">Glyphicons</a>
......
assets/ico/favicon.png
View replaced file @ 1174e777 View file @ 8a594a25
assets/ico/favicon.png

1.87 KB | W: | H:

assets/ico/favicon.png

889 Bytes | W: | H:

assets/ico/favicon.png
assets/ico/favicon.png
assets/ico/favicon.png
assets/ico/favicon.png
  • 2-up
  • Swipe
  • Onion skin
components.html
View file @ 8a594a25
This diff is collapsed.
customize.html
View file @ 8a594a25
......@@ -710,41 +710,41 @@ base_url: "../"
<input type="text" class="form-control" placeholder="50px" data-var="@navbar-height">
<label>@navbar-margin-bottom</label>
<input type="text" class="form-control" placeholder="@line-height-computed" data-var="@navbar-margin-bottom">
<label>@navbar-color</label>
<input type="text" class="form-control" placeholder="#777" data-var="@navbar-color">
<label>@navbar-bg</label>
<input type="text" class="form-control" placeholder="#eee" data-var="@navbar-bg">
<label>@navbar-default-color</label>
<input type="text" class="form-control" placeholder="#777" data-var="@navbar-default-color">
<label>@navbar-default-bg</label>
<input type="text" class="form-control" placeholder="#eee" data-var="@navbar-default-bg">
<label>@navbar-border-radius</label>
<input type="text" class="form-control" placeholder="@border-radius-base" data-var="@navbar-border-radius">
<h4>Links</h4>
<label>@navbar-link-color</label>
<input type="text" class="form-control" placeholder="#777" data-var="@navbar-link-color">
<label>@navbar-link-hover-color</label>
<input type="text" class="form-control" placeholder="#333" data-var="@navbar-link-hover-color">
<label>@navbar-link-hover-bg</label>
<input type="text" class="form-control" placeholder="transparent" data-var="@navbar-link-hover-bg">
<label>@navbar-link-active-color</label>
<input type="text" class="form-control" placeholder="#555" data-var="@navbar-link-active-color">
<label>@navbar-link-active-bg</label>
<input type="text" class="form-control" placeholder="darken(@navbar-bg, 10%)" data-var="@navbar-link-active-bg">
<label>@navbar-link-disabled-color</label>
<input type="text" class="form-control" placeholder="#ccc" data-var="@navbar-link-disabled-color">
<label>@navbar-link-disabled-bg</label>
<input type="text" class="form-control" placeholder="transparent" data-var="@navbar-link-disabled-bg">
<label>@navbar-default-link-color</label>
<input type="text" class="form-control" placeholder="#777" data-var="@navbar-default-link-color">
<label>@navbar-default-link-hover-color</label>
<input type="text" class="form-control" placeholder="#333" data-var="@navbar-default-link-hover-color">
<label>@navbar-default-link-hover-bg</label>
<input type="text" class="form-control" placeholder="transparent" data-var="@navbar-default-link-hover-bg">
<label>@navbar-default-link-active-color</label>
<input type="text" class="form-control" placeholder="#555" data-var="@navbar-default-link-active-color">
<label>@navbar-default-link-active-bg</label>
<input type="text" class="form-control" placeholder="darken(@navbar-bg, 10%)" data-var="@navbar-default-link-active-bg">
<label>@navbar-default-link-disabled-color</label>
<input type="text" class="form-control" placeholder="#ccc" data-var="@navbar-default-link-disabled-color">
<label>@navbar-default-link-disabled-bg</label>
<input type="text" class="form-control" placeholder="transparent" data-var="@navbar-default-link-disabled-bg">
<h4>Brand</h4>
<label>@navbar-brand-color</label>
<input type="text" class="form-control" placeholder="@navbar-link-color" data-var="@navbar-brand-color">
<label>@navbar-brand-hover-color</label>
<input type="text" class="form-control" placeholder="darken(@navbar-link-color, 10%)" data-var="@navbar-brand-hover-color">
<label>@navbar-brand-hover-bg</label>
<input type="text" class="form-control" placeholder="transparent" data-var="@navbar-brand-hover-bg">
<label>@navbar-default-brand-color</label>
<input type="text" class="form-control" placeholder="@navbar-link-color" data-var="@navbar-default-brand-color">
<label>@navbar-default-brand-hover-color</label>
<input type="text" class="form-control" placeholder="darken(@navbar-link-color, 10%)" data-var="@navbar-default-brand-hover-color">
<label>@navbar-default-brand-hover-bg</label>
<input type="text" class="form-control" placeholder="transparent" data-var="@navbar-default-brand-hover-bg">
<h4>Toggle</h4>
<label>@navbar-toggle-hover-bg</label>
<input type="text" class="form-control" placeholder="#ddd" data-var="@navbar-toggle-hover-bg">
<label>@navbar-toggle-icon-bar-bg</label>
<input type="text" class="form-control" placeholder="#ccc" data-var="@navbar-toggle-icon-bar-bg">
<label>@navbar-toggle-border-color</label>
<input type="text" class="form-control" placeholder="#ddd" data-var="@navbar-toggle-border-color">
<label>@navbar-default-toggle-hover-bg</label>
<input type="text" class="form-control" placeholder="#ddd" data-var="@navbar-default-toggle-hover-bg">
<label>@navbar-default-toggle-icon-bar-bg</label>
<input type="text" class="form-control" placeholder="#ccc" data-var="@navbar-default-toggle-icon-bar-bg">
<label>@navbar-default-toggle-border-color</label>
<input type="text" class="form-control" placeholder="#ddd" data-var="@navbar-default-toggle-border-color">
</div>
<div class="col-lg-6">
<h3>Inverted navbar</h3>
......
dist/css/bootstrap.css
View file @ 8a594a25
This diff is collapsed.
dist/css/bootstrap.min.css
View file @ 8a594a25
This source diff could not be displayed because it is too large. You can view the blob instead.
examples/jumbotron/index.html
View file @ 8a594a25
......@@ -59,7 +59,7 @@
<div class="form-group">
<input type="password" placeholder="Password" class="form-control">
</div>
<button type="submit" class="btn">Sign in</button>
<button type="submit" class="btn btn-success">Sign in</button>
</form>
</div><!--/.navbar-collapse -->
</div>
......
examples/navbar-fixed-top/index.html
View file @ 8a594a25
......@@ -25,7 +25,7 @@
<body>
<!-- Fixed navbar -->
<div class="navbar navbar-fixed-top">
<div class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
......
examples/navbar-static-top/index.html
View file @ 8a594a25
......@@ -25,7 +25,7 @@
<body>
<!-- Static navbar -->
<div class="navbar navbar-static-top">
<div class="navbar navbar-default navbar-static-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
......
examples/navbar/index.html
View file @ 8a594a25
......@@ -27,7 +27,7 @@
<div class="container">
<!-- Static navbar -->
<div class="navbar">
<div class="navbar navbar-default">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
......
examples/sticky-footer-navbar/index.html
View file @ 8a594a25
......@@ -28,7 +28,7 @@
<div id="wrap">
<!-- Fixed navbar -->
<div class="navbar navbar-fixed-top">
<div class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
......
examples/theme/index.html
View file @ 8a594a25
......@@ -140,7 +140,7 @@
<h1>Navbars</h1>
</div>
<div class="navbar">
<div class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
......
javascript.html
View file @ 8a594a25
......@@ -355,7 +355,7 @@ $('#myModal').on('hidden.bs.modal', function () {
<h3>Within a navbar</h3>
<div class="bs-example">
<nav id="navbar-example" class="navbar navbar-static" role="navigation">
<nav id="navbar-example" class="navbar navbar-default navbar-static" role="navigation">
<div class="navbar-header">
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-js-navbar-collapse">
<span class="sr-only">Toggle navigation</span>
......@@ -526,7 +526,7 @@ $('#myDropdown').on('show.bs.dropdown', function () {
<h2 id="scrollspy-examples">Example in navbar</h2>
<p>The ScrollSpy plugin is for automatically updating nav targets based on scroll position. Scroll the area below the navbar and watch the active class change. The dropdown sub items will be highlighted as well.</p>
<div class="bs-example">
<nav id="navbar-example2" class="navbar navbar-static" role="navigation">
<nav id="navbar-example2" class="navbar navbar-default navbar-static" role="navigation">
<div class="navbar-header">
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-js-navbar-scrollspy">
<span class="sr-only">Toggle navigation</span>
......
less/button-groups.less
View file @ 8a594a25
......@@ -22,11 +22,11 @@
& .btn-default .caret {
border-bottom-color: @btn-default-color;
}
& .btn-primary,
& .btn-success,
& .btn-warning,
& .btn-danger,
& .btn-info {
.btn-primary,
.btn-success,
.btn-warning,
.btn-danger,
.btn-info {
.caret {
border-bottom-color: #fff;
}
......
less/forms.less
View file @ 8a594a25
......@@ -326,21 +326,28 @@ input[type="checkbox"],
// Horizontal forms are built on grid classes and allow you to create forms with
// labels on the left and inputs on the right.
.form-horizontal .control-label,
.form-horizontal .radio-inline,
.form-horizontal .checkbox-inline {
padding-top: @padding-base-vertical;
}
.form-horizontal {
// Consistent vertical alignment of labels, radios, and checkboxes
.control-label,
.radio,
.checkbox,
.radio-inline,
.checkbox-inline {
margin-top: 0;
margin-bottom: 0;
padding-top: (@padding-base-vertical + 1); // Default padding plus a border
}
// Make form groups behave like rows
.form-group {
.make-row();
}
}
// Only right align form labels here when the columns stop stacking
@media (min-width: @screen-tablet) {
.form-horizontal .control-label {
// Only right align form labels here when the columns stop stacking
@media (min-width: @screen-tablet) {
.control-label {
text-align: right;
}
}
}
less/glyphicons.less
View file @ 8a594a25
This diff is collapsed.
less/navbar.less
View file @ 8a594a25
......@@ -12,8 +12,7 @@
position: relative;
min-height: @navbar-height; // Ensure a navbar always shows (e.g., without a .navbar-brand in collapsed mode)
margin-bottom: @navbar-margin-bottom;
background-color: @navbar-bg;
border: 1px solid @navbar-border;
border: 1px solid transparent;
// Prevent floats from breaking the navbar
.clearfix();
......@@ -53,7 +52,7 @@
overflow-x: visible;
padding-right: @navbar-padding-horizontal;
padding-left: @navbar-padding-horizontal;
border-top: 1px solid darken(@navbar-bg, 7%);
border-top: 1px solid transparent;
box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
.clearfix();
-webkit-overflow-scrolling: touch;
......@@ -145,12 +144,9 @@
padding: @navbar-padding-vertical @navbar-padding-horizontal;
font-size: @font-size-large;
line-height: @line-height-computed;
color: @navbar-brand-color;
&:hover,
&:focus {
color: @navbar-brand-hover-color;
text-decoration: none;
background-color: @navbar-brand-hover-bg;
}
@media (min-width: @grid-float-breakpoint) {
......@@ -173,20 +169,14 @@
padding: 9px 10px;
.navbar-vertical-align(34px);
background-color: transparent;
border: 1px solid @navbar-toggle-border-color;
border: 1px solid transparent;
border-radius: @border-radius-base;
&:hover,
&:focus {
background-color: @navbar-toggle-hover-bg;
}
// Bars
.icon-bar {
display: block;
width: 22px;
height: 2px;
background-color: @navbar-toggle-icon-bar-bg;
border-radius: 1px;
}
.icon-bar + .icon-bar {
......@@ -210,29 +200,7 @@
> li > a {
padding-top: 10px;
padding-bottom: 10px;
color: @navbar-link-color;
line-height: @line-height-computed;
&:hover,
&:focus {
color: @navbar-link-hover-color;
background-color: @navbar-link-hover-bg;
}
}
> .active > a {
&,
&:hover,
&:focus {
color: @navbar-link-active-color;
background-color: @navbar-link-active-bg;
}
}
> .disabled > a {
&,
&:hover,
&:focus {
color: @navbar-link-disabled-color;
background-color: @navbar-link-disabled-bg;
}
}
@media (max-width: @screen-xs-max) {
......@@ -250,31 +218,12 @@
padding: 5px 15px 5px 25px;
}
> li > a {
color: @navbar-link-color;
line-height: @line-height-computed;
&:hover,
&:focus {
color: @navbar-link-hover-color;
background-color: @navbar-link-hover-bg;
background-image: none;
}
}
> .active > a {
&,
&:hover,
&:focus {
color: @navbar-link-active-color;
background-color: @navbar-link-active-bg;
}
}
> .disabled > a {
&,
&:hover,
&:focus {
color: @navbar-link-disabled-color;
background-color: @navbar-link-disabled-bg;
}
}
}
}
......@@ -321,8 +270,8 @@
margin-left: -@navbar-padding-horizontal;
margin-right: -@navbar-padding-horizontal;
padding: 10px @navbar-padding-horizontal;
border-top: 1px solid darken(@navbar-bg, 7%);
border-bottom: 1px solid darken(@navbar-bg, 7%);
border-top: 1px solid transparent;
border-bottom: 1px solid transparent;
@shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
.box-shadow(@shadow);
......@@ -363,34 +312,6 @@
.border-bottom-radius(0);
}
// Dropdown menu items and carets
.navbar-nav {
// Caret should match text color on hover
> .dropdown > a:hover .caret,
> .dropdown > a:focus .caret {
border-top-color: @navbar-link-hover-color;
border-bottom-color: @navbar-link-hover-color;
}
// Remove background color from open dropdown
> .open > a {
&,
&:hover,
&:focus {
background-color: @navbar-link-active-bg;
color: @navbar-link-active-color;
.caret {
border-top-color: @navbar-link-active-color;
border-bottom-color: @navbar-link-active-color;
}
}
}
> .dropdown > a .caret {
border-top-color: @navbar-link-color;
border-bottom-color: @navbar-link-color;
}
}
// Right aligned menus need alt position
.navbar-nav.pull-right > li > .dropdown-menu,
.navbar-nav > li > .dropdown-menu.pull-right {
......@@ -414,7 +335,6 @@
.navbar-text {
float: left;
color: @navbar-color;
.navbar-vertical-align(@line-height-computed);
@media (min-width: @grid-float-breakpoint) {
......@@ -423,22 +343,145 @@
}
}
// Alternate navbars
// --------------------------------------------------
// Default navbar
.navbar-default {
background-color: @navbar-default-bg;
border-color: @navbar-default-border;
.navbar-brand {
color: @navbar-default-brand-color;
&:hover,
&:focus {
color: @navbar-default-brand-hover-color;
background-color: @navbar-default-brand-hover-bg;
}
}
.navbar-text {
color: @navbar-default-color;
}
.navbar-nav {
> li > a {
color: @navbar-default-link-color;
&:hover,
&:focus {
color: @navbar-default-link-hover-color;
background-color: @navbar-default-link-hover-bg;
}
}
> .active > a {
&,
&:hover,
&:focus {
color: @navbar-default-link-active-color;
background-color: @navbar-default-link-active-bg;
}
}
> .disabled > a {
&,
&:hover,
&:focus {
color: @navbar-default-link-disabled-color;
background-color: @navbar-default-link-disabled-bg;
}
}
}
.navbar-toggle {
border-color: @navbar-default-toggle-border-color;
&:hover,
&:focus {
background-color: @navbar-default-toggle-hover-bg;
}
.icon-bar {
background-color: @navbar-default-toggle-icon-bar-bg;
}
}
.navbar-collapse,
.navbar-form {
border-color: darken(@navbar-default-bg, 7%);
}
// Dropdown menu items and carets
.navbar-nav {
// Caret should match text color on hover
> .dropdown > a:hover .caret,
> .dropdown > a:focus .caret {
border-top-color: @navbar-default-link-hover-color;
border-bottom-color: @navbar-default-link-hover-color;
}
// Remove background color from open dropdown
> .open > a {
&,
&:hover,
&:focus {
background-color: @navbar-default-link-active-bg;
color: @navbar-default-link-active-color;
.caret {
border-top-color: @navbar-default-link-active-color;
border-bottom-color: @navbar-default-link-active-color;
}
}
}
> .dropdown > a .caret {
border-top-color: @navbar-default-link-color;
border-bottom-color: @navbar-default-link-color;
}
@media (max-width: @screen-xs-max) {
// Dropdowns get custom display when collapsed
.open .dropdown-menu {
> li > a {
color: @navbar-default-link-color;
&:hover,
&:focus {
color: @navbar-default-link-hover-color;
background-color: @navbar-default-link-hover-bg;
}
}
> .active > a {
&,
&:hover,
&:focus {
color: @navbar-default-link-active-color;
background-color: @navbar-default-link-active-bg;
}
}
> .disabled > a {
&,
&:hover,
&:focus {
color: @navbar-default-link-disabled-color;
background-color: @navbar-default-link-disabled-bg;
}
}
}
}
}
// Links in navbars
//
// Add a class to ensure links outside the navbar nav are colored correctly.
// Default navbar variables
.navbar-link {
color: @navbar-link-color;
// Links in navbars
//
// Add a class to ensure links outside the navbar nav are colored correctly.
.navbar-link {
color: @navbar-default-link-color;
&:hover {
color: @navbar-link-hover-color;
color: @navbar-default-link-hover-color;
}
}
}
}
// Inverse navbar
// --------------------------------------------------
.navbar-inverse {
background-color: @navbar-inverse-bg;
......
less/scaffolding.less
View file @ 8a594a25
......@@ -54,14 +54,16 @@ textarea {
a {
color: @link-color;
text-decoration: none;
}
a:hover,
a:focus {
&:hover,
&:focus {
color: @link-hover-color;
text-decoration: underline;
}
a:focus {
}
&:focus {
.tab-focus();
}
}
......
less/theme.less
View file @ 8a594a25
......@@ -93,13 +93,13 @@
// Basic navbar
.navbar {
#gradient > .vertical(@start-color: lighten(@navbar-bg, 10%); @end-color: @navbar-bg;);
#gradient > .vertical(@start-color: lighten(@navbar-default-bg, 10%); @end-color: @navbar-default-bg;);
border-radius: @navbar-border-radius;
@shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 5px rgba(0,0,0,.075);
.box-shadow(@shadow);
.navbar-nav > .active > a {
background-color: @navbar-bg;
background-color: @navbar-default-bg;
}
}
.navbar-brand,
......
less/variables.less
View file @ 8a594a25
......@@ -237,31 +237,31 @@
// Basics of a navbar
@navbar-height: 50px;
@navbar-margin-bottom: @line-height-computed;
@navbar-color: #777;
@navbar-bg: #f8f8f8;
@navbar-border: darken(@navbar-bg, 6.5%);
@navbar-default-color: #777;
@navbar-default-bg: #f8f8f8;
@navbar-default-border: darken(@navbar-default-bg, 6.5%);
@navbar-border-radius: @border-radius-base;
@navbar-padding-horizontal: floor(@grid-gutter-width / 2);
@navbar-padding-vertical: ((@navbar-height - @line-height-computed) / 2);
// Navbar links
@navbar-link-color: #777;
@navbar-link-hover-color: #333;
@navbar-link-hover-bg: transparent;
@navbar-link-active-color: #555;
@navbar-link-active-bg: darken(@navbar-bg, 6.5%);
@navbar-link-disabled-color: #ccc;
@navbar-link-disabled-bg: transparent;
@navbar-default-link-color: #777;
@navbar-default-link-hover-color: #333;
@navbar-default-link-hover-bg: transparent;
@navbar-default-link-active-color: #555;
@navbar-default-link-active-bg: darken(@navbar-default-bg, 6.5%);
@navbar-default-link-disabled-color: #ccc;
@navbar-default-link-disabled-bg: transparent;
// Navbar brand label
@navbar-brand-color: @navbar-link-color;
@navbar-brand-hover-color: darken(@navbar-link-color, 10%);
@navbar-brand-hover-bg: transparent;
@navbar-default-brand-color: @navbar-default-link-color;
@navbar-default-brand-hover-color: darken(@navbar-default-link-color, 10%);
@navbar-default-brand-hover-bg: transparent;
// Navbar toggle
@navbar-toggle-hover-bg: #ddd;
@navbar-toggle-icon-bar-bg: #ccc;
@navbar-toggle-border-color: #ddd;
@navbar-default-toggle-hover-bg: #ddd;
@navbar-default-toggle-icon-bar-bg: #ccc;
@navbar-default-toggle-border-color: #ddd;
// Inverted navbar
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment