kotovalexarian-likes-github
/
twbs--bootstrap
mirror of https://github.com/twbs/bootstrap.git
1
0
Fork 0
Code Releases Activity

Merge branch '3.0.0-wip' into bs3_homepage 

Conflicts:
	customize.html
	dist/css/bootstrap.min.css
This commit is contained in:
Mark Otto 2013-08-18 20:15:45 -07:00
parent cf09e6a6b5 f584500211
commit a9378a9267
17 changed files with 179 additions and 179 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
_includes/nav-components.html
View File

@ -93,8 +93,7 @@
<li>
<a href="#alerts">Alerts</a>
<ul class="nav">
<li><a href="#alerts-default">Default alert</a></li>
<li><a href="#alerts-alternatives">Contextual alternatives</a></li>
<li><a href="#alerts-examples">Examples</a></li>
<li><a href="#alerts-dismissable">Dismissable alerts</a></li>
<li><a href="#alerts-links">Links in alerts</a></li>
</ul>

2
assets/js/customizer.js
View File

@ -158,6 +158,8 @@ window.onload = function () { // wait for load in a dumb way because B-0
css += __less['variables.less']
if (vars) css += generateCustomCSS(vars)
css += __less['mixins.less']
css += __less['normalize.less']
css += __less['scaffolding.less']
css += $checked
.map(function () { return __less[this.value] })
.toArray()

38
components.html
View File

@ -2167,22 +2167,14 @@ body { padding-bottom: 70px; }
</div>
<p class="lead">Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages. For inline dismissal, use the <a href="../javascript/#js-alerts">alerts jQuery plugin</a>.</p>
<h2 id="alerts-default">Default alert</h2>
<p>Wrap any text and an optional dismiss button in <code>.alert</code> for a basic warning alert message.</p>
<h2 id="alerts-examples">Examples</h2>
<p>Wrap any text and an optional dismiss button in <code>.alert</code> and one of the four contextual classes (e.g., <code>.alert-success</code>) for basic alert messages.</p>
<div class="bs-example">
<div class="alert">
<strong>Warning!</strong> Best check yo self, you're not looking too good.
</div>
<div class="bs-callout bs-callout-info">
<h4>No default class</h4>
<p>Alerts don't have default classes, only base and modifier classes. A default gray alert doesn't make too much sense, so you're required to specify a type via contextual class. Choose from success, info, warning, or danger.</p>
</div>
{% highlight html %}
<div class="alert">
<strong>Warning!</strong> Best check yo self, you're not looking too good.
</div>
{% endhighlight %}
<h2 id="alerts-alternatives">Contextual alternatives</h2>
<p>Add optional classes to change an alert's connotation.</p>
<div class="bs-example">
<div class="alert alert-success">
<strong>Well done!</strong> You successfully read this important alert message.
@ -2190,6 +2182,9 @@ body { padding-bottom: 70px; }
<div class="alert alert-info">
<strong>Heads up!</strong> This alert needs your attention, but it's not super important.
</div>
<div class="alert alert-warning">
<strong>Warning!</strong> Best check yo self, you're not looking too good.
</div>
<div class="alert alert-danger">
<strong>Oh snap!</strong> Change a few things up and try submitting again.
</div>
@ -2197,6 +2192,7 @@ body { padding-bottom: 70px; }
{% highlight html %}
<div class="alert alert-success">...</div>
<div class="alert alert-info">...</div>
<div class="alert alert-warning">...</div>
<div class="alert alert-danger">...</div>
{% endhighlight %}
@ -2634,14 +2630,14 @@ body { padding-bottom: 70px; }
<h3 id="panels-basic">Basic example</h3>
<p>By default, all the <code>.panel</code> does is apply some basic border and padding to contain some content.</p>
<div class="bs-example">
<div class="panel">
<div class="panel panel-default">
<div class="panel-body">
Basic panel example
</div>
</div>
</div>
{% highlight html %}
<div class="panel">
<div class="panel panel-default">
<div class="panel-body">
Basic panel example
</div>
@ -2651,13 +2647,13 @@ body { padding-bottom: 70px; }
<h3 id="panels-heading">Panel with heading</h3>
<p>Easily add a heading container to your panel with <code>.panel-heading</code>. You may also include any <code>&lt;h1&gt;</code>-<code>&lt;h6&gt;</code> with a <code>.panel-title</code> class to add a pre-styled heading.</p>
<div class="bs-example">
<div class="panel">
<div class="panel panel-default">
<div class="panel-heading">Panel heading without title</div>
<div class="panel-body">
Panel content
</div>
</div>
<div class="panel">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
@ -2667,14 +2663,14 @@ body { padding-bottom: 70px; }
</div>
</div>
{% highlight html %}
<div class="panel">
<div class="panel panel-default">
<div class="panel-heading">Panel heading without title</div>
<div class="panel-body">
Panel content
</div>
</div>
<div class="panel">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
@ -2687,7 +2683,7 @@ body { padding-bottom: 70px; }
<h3 id="panels-footer">Panel with footer</h3>
<p>Wrap buttons or secondary text in <code>.panel-footer</code>. Note that panel footers <strong>do not</strong> inherit colors and borders when using contextual variations as they are not meant to be in the foreground.</p>
<div class="bs-example">
<div class="panel">
<div class="panel panel-default">
<div class="panel-body">
Panel content
</div>
@ -2695,7 +2691,7 @@ body { padding-bottom: 70px; }
</div>
</div>
{% highlight html %}
<div class="panel">
<div class="panel panel-default">
<div class="panel-body">
Panel content
</div>

58
customize.html
View File

File diff suppressed because one or more lines are too long

22
dist/css/bootstrap-theme.css vendored
View File

@ -199,16 +199,6 @@
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 2px rgba(0, 0, 0, 0.05);
}
.alert {
background-image: -webkit-gradient(linear, left 0%, left 100%, from(#fcf8e3), to(#f8efc0));
background-image: -webkit-linear-gradient(top, #fcf8e3, 0%, #f8efc0, 100%);
background-image: -moz-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
background-image: linear-gradient(to bottom, #fcf8e3 0%, #f8efc0 100%);
background-repeat: repeat-x;
border-color: #f5e79e;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0);
}
.alert-success {
background-image: -webkit-gradient(linear, left 0%, left 100%, from(#dff0d8), to(#c8e5bc));
background-image: -webkit-linear-gradient(top, #dff0d8, 0%, #c8e5bc, 100%);
@ -229,6 +219,16 @@
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffb9def0', GradientType=0);
}
.alert-warning {
background-image: -webkit-gradient(linear, left 0%, left 100%, from(#fcf8e3), to(#f8efc0));
background-image: -webkit-linear-gradient(top, #fcf8e3, 0%, #f8efc0, 100%);
background-image: -moz-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%);
background-image: linear-gradient(to bottom, #fcf8e3 0%, #f8efc0 100%);
background-repeat: repeat-x;
border-color: #f5e79e;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0);
}
.alert-danger {
background-image: -webkit-gradient(linear, left 0%, left 100%, from(#f2dede), to(#e7c3c3));
background-image: -webkit-linear-gradient(top, #f2dede, 0%, #e7c3c3, 100%);
@ -317,7 +317,7 @@
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}
.panel-heading {
.panel-default > .panel-heading {
background-image: -webkit-gradient(linear, left 0%, left 100%, from(#f5f5f5), to(#e8e8e8));
background-image: -webkit-linear-gradient(top, #f5f5f5, 0%, #e8e8e8, 100%);
background-image: -moz-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%);

2
dist/css/bootstrap-theme.min.css vendored
View File

File diff suppressed because one or more lines are too long

104
dist/css/bootstrap.css vendored
View File

@ -354,6 +354,19 @@ img {
border-radius: 6px;
}
.img-thumbnail {
display: inline-block;
height: auto;
max-width: 100%;
padding: 4px;
line-height: 1.428571429;
background-color: #ffffff;
border: 1px solid #dddddd;
border-radius: 4px;
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.img-circle {
border-radius: 50%;
}
@ -4884,8 +4897,11 @@ a.list-group-item.active > .badge,
}
}
.thumbnail,
.img-thumbnail {
.thumbnail {
display: inline-block;
display: block;
height: auto;
max-width: 100%;
padding: 4px;
line-height: 1.428571429;
background-color: #ffffff;
@ -4895,22 +4911,12 @@ a.list-group-item.active > .badge,
transition: all 0.2s ease-in-out;
}
.thumbnail {
display: block;
}
.thumbnail > img {
display: block;
height: auto;
max-width: 100%;
}
.img-thumbnail {
display: inline-block;
height: auto;
max-width: 100%;
}
a.thumbnail:hover,
a.thumbnail:focus {
border-color: #428bca;
@ -4929,9 +4935,7 @@ a.thumbnail:focus {
.alert {
padding: 15px;
margin-bottom: 20px;
color: #c09853;
background-color: #fcf8e3;
border: 1px solid #fbeed5;
border: 1px solid transparent;
border-radius: 4px;
}
@ -4940,13 +4944,8 @@ a.thumbnail:focus {
color: inherit;
}
.alert hr {
border-top-color: #f8e5be;
}
.alert .alert-link {
font-weight: bold;
color: #a47e3c;
}
.alert > p,
@ -4983,20 +4982,6 @@ a.thumbnail:focus {
color: #356635;
}
.alert-danger {
color: #b94a48;
background-color: #f2dede;
border-color: #eed3d7;
}
.alert-danger hr {
border-top-color: #e6c1c7;
}
.alert-danger .alert-link {
color: #953b39;
}
.alert-info {
color: #3a87ad;
background-color: #d9edf7;
@ -5011,6 +4996,34 @@ a.thumbnail:focus {
color: #2d6987;
}
.alert-warning {
color: #c09853;
background-color: #fcf8e3;
border-color: #fbeed5;
}
.alert-warning hr {
border-top-color: #f8e5be;
}
.alert-warning .alert-link {
color: #a47e3c;
}
.alert-danger {
color: #b94a48;
background-color: #f2dede;
border-color: #eed3d7;
}
.alert-danger hr {
border-top-color: #e6c1c7;
}
.alert-danger .alert-link {
color: #953b39;
}
@-webkit-keyframes progress-bar-stripes {
from {
background-position: 40px 0;
@ -5248,7 +5261,7 @@ a.list-group-item:focus {
.panel {
margin-bottom: 20px;
background-color: #ffffff;
border: 1px solid #dddddd;
border: 1px solid transparent;
border-radius: 4px;
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
@ -5313,8 +5326,7 @@ a.list-group-item:focus {
.panel-heading {
padding: 10px 15px;
background-color: #f5f5f5;
border-bottom: 1px solid #dddddd;
border-bottom: 1px solid transparent;
border-top-right-radius: 3px;
border-top-left-radius: 3px;
}
@ -5363,6 +5375,24 @@ a.list-group-item:focus {
border-bottom: 1px solid #dddddd;
}
.panel-default {
border-color: #dddddd;
}
.panel-default > .panel-heading {
color: #333333;
background-color: #f5f5f5;
border-color: #dddddd;
}
.panel-default > .panel-heading + .panel-collapse .panel-body {
border-top-color: #dddddd;
}
.panel-default > .panel-footer + .panel-collapse .panel-body {
border-bottom-color: #dddddd;
}
.panel-primary {
border-color: #428bca;
}

2
dist/css/bootstrap.min.css vendored
View File

File diff suppressed because one or more lines are too long

8
examples/theme/index.html
View File

@ -219,15 +219,15 @@
<div class="page-header">
<h1>Alerts</h1>
</div>
<div class="alert">
<strong>Warning!</strong> Best check yo self, you're not looking too good.
</div>
<div class="alert alert-success">
<strong>Well done!</strong> You successfully read this important alert message.
</div>
<div class="alert alert-info">
<strong>Heads up!</strong> This alert needs your attention, but it's not super important.
</div>
<div class="alert alert-warning">
<strong>Warning!</strong> Best check yo self, you're not looking too good.
</div>
<div class="alert alert-danger">
<strong>Oh snap!</strong> Change a few things up and try submitting again.
</div>
@ -309,7 +309,7 @@
</div>
<div class="row">
<div class="col-sm-4">
<div class="panel">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>

2
javascript.html
View File

@ -1184,7 +1184,7 @@ $('#myPopover').on('hidden.bs.popover', function () {
<h2 id="alerts-examples">Example alerts</h2>
<p>Add dismiss functionality to all alert messages with this plugin.</p>
<div class="bs-example">
<div class="alert fade in">
<div class="alert alert-warning fade in">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
<strong>Holy guacamole!</strong> Best check yo self, you're not looking too good.
</div>

18
less/alerts.less
View File

@ -9,9 +9,7 @@
.alert {
padding: @alert-padding;
margin-bottom: @line-height-computed;
color: @alert-text;
background-color: @alert-bg;
border: 1px solid @alert-border;
border: 1px solid transparent;
border-radius: @alert-border-radius;
// Headings for larger alerts
@ -20,14 +18,9 @@
// Specified for the h4 to prevent conflicts of changing @headingsColor
color: inherit;
}
// Match the hr to the border of the alert
hr {
border-top-color: darken(@alert-border, 5%);
}
// Provide class for links that match alerts
.alert-link {
font-weight: @alert-link-font-weight;
color: darken(@alert-text, 10%);
}
// Improve alignment and spacing of inner content
@ -63,9 +56,12 @@
.alert-success {
.alert-variant(@alert-success-bg; @alert-success-border; @alert-success-text);
}
.alert-danger {
.alert-variant(@alert-danger-bg; @alert-danger-border; @alert-danger-text);
}
.alert-info {
.alert-variant(@alert-info-bg; @alert-info-border; @alert-info-text);
}
.alert-warning {
.alert-variant(@alert-warning-bg; @alert-warning-border; @alert-warning-text);
}
.alert-danger {
.alert-variant(@alert-danger-bg; @alert-danger-border; @alert-danger-text);
}

2
less/mixins.less
View File

@ -340,7 +340,7 @@
// Panels
// -------------------------
.panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border) {
.panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border;) {
border-color: @border;
& > .panel-heading {
color: @heading-text-color;

14
less/panels.less
View File

@ -7,7 +7,7 @@
.panel {
margin-bottom: @line-height-computed;
background-color: @panel-bg;
border: 1px solid @panel-border;
border: 1px solid transparent;
border-radius: @panel-border-radius;
.box-shadow(0 1px 1px rgba(0,0,0,.05));
}
@ -71,8 +71,7 @@
// Optional heading
.panel-heading {
padding: 10px 15px;
background-color: @panel-heading-bg;
border-bottom: 1px solid @panel-border;
border-bottom: 1px solid transparent;
.border-top-radius(@panel-border-radius - 1);
}
@ -90,7 +89,7 @@
.panel-footer {
padding: 10px 15px;
background-color: @panel-footer-bg;
border-top: 1px solid @panel-border;
border-top: 1px solid @panel-inner-border;
.border-bottom-radius(@panel-border-radius - 1);
}
@ -114,13 +113,13 @@
.panel-heading {
border-bottom: 0;
+ .panel-collapse .panel-body {
border-top: 1px solid @panel-border;
border-top: 1px solid @panel-inner-border;
}
}
.panel-footer {
border-top: 0;
+ .panel-collapse .panel-body {
border-bottom: 1px solid @panel-border;
border-bottom: 1px solid @panel-inner-border;
}
}
@ -132,6 +131,9 @@
// Contextual variations
.panel-default {
.panel-variant(@panel-default-border; @panel-default-text; @panel-default-heading-bg; @panel-default-border);
}
.panel-primary {
.panel-variant(@panel-primary-border; @panel-primary-text; @panel-primary-heading-bg; @panel-primary-border);
}

27
less/scaffolding.less
View File

@ -4,7 +4,6 @@
// Reset the box-sizing
// -------------------------
*,
*:before,
@ -14,7 +13,6 @@
// Body reset
// -------------------------
html {
font-size: 62.5%;
@ -39,7 +37,10 @@ textarea {
line-height: inherit;
}
// Reset unusual Firefox-on-Android default style, see https://github.com/necolas/normalize.css/issues/214
// Reset unusual Firefox-on-Android default style.
//
// See https://github.com/necolas/normalize.css/issues/214
button,
input,
select[multiple],
@ -49,7 +50,6 @@ textarea {
// Links
// -------------------------
a {
color: @link-color;
@ -68,7 +68,6 @@ a {
// Images
// -------------------------
img {
vertical-align: middle;
@ -85,7 +84,19 @@ img {
}
// Image thumbnails
// See thumbnails.less for `.img-thumbnail`
//
// Heads up! This is mixin-ed into thumbnails.less for `.thumbnail`.
.img-thumbnail {
padding: @thumbnail-padding;
line-height: @line-height-base;
background-color: @thumbnail-bg;
border: 1px solid @thumbnail-border;
border-radius: @thumbnail-border-radius;
.transition(all .2s ease-in-out);
// Keep them at most 100% wide
.img-responsive(inline-block);
}
// Perfect circle
.img-circle {
@ -94,7 +105,6 @@ img {
// Horizontal rules
// -------------------------
hr {
margin-top: @line-height-computed;
@ -103,9 +113,10 @@ hr {
border-top: 1px solid @hr-border;
}
// Only display content to screen readers
//
// See: http://a11yproject.com/posts/how-to-hide-content/
// -------------------------
.sr-only {
position: absolute;

4
less/theme.less
View File

@ -148,9 +148,9 @@
}
// Apply the mixin to the alerts
.alert { .alert-styles(@alert-bg); }
.alert-success { .alert-styles(@alert-success-bg); }
.alert-info { .alert-styles(@alert-info-bg); }
.alert-warning { .alert-styles(@alert-warning-bg); }
.alert-danger { .alert-styles(@alert-danger-bg); }
@ -211,7 +211,7 @@
}
// Apply the mixin to the panel headings only
.panel-heading { .panel-heading-styles(@panel-heading-bg); }
.panel-default > .panel-heading { .panel-heading-styles(@panel-default-heading-bg); }
.panel-primary > .panel-heading { .panel-heading-styles(@panel-primary-heading-bg); }
.panel-success > .panel-heading { .panel-heading-styles(@panel-success-heading-bg); }
.panel-info > .panel-heading { .panel-heading-styles(@panel-info-heading-bg); }

29
less/thumbnails.less
View File

@ -3,30 +3,17 @@
// --------------------------------------------------
// Base classes
// For thumbnail block-level composite components and simple image styles
// The actual thumbnailed element
// Can be `a`, `div`, or `img`
.thumbnail,
.img-thumbnail {
padding: @thumbnail-padding;
line-height: @line-height-base;
background-color: @thumbnail-bg;
border: 1px solid @thumbnail-border;
border-radius: @thumbnail-border-radius;
.transition(all .2s ease-in-out);
}
// Mixin and adjust the regular image class
.thumbnail {
display: block;
}
.thumbnail > img {
.img-responsive();
}
.img-thumbnail {
.img-responsive(inline-block);
.img-thumbnail();
display: block; // Override the inline-block from `.img-thumbnail`
> img {
.img-responsive();
}
}
// Add a hover state for linked versions only
a.thumbnail:hover,
a.thumbnail:focus {

23
less/variables.less
View File

@ -439,22 +439,22 @@
@alert-border-radius: @border-radius-base;
@alert-link-font-weight: bold;
@alert-bg: @state-warning-bg;
@alert-text: @state-warning-text;
@alert-border: @state-warning-border;
@alert-success-bg: @state-success-bg;
@alert-success-text: @state-success-text;
@alert-success-border: @state-success-border;
@alert-danger-bg: @state-danger-bg;
@alert-danger-text: @state-danger-text;
@alert-danger-border: @state-danger-border;
@alert-info-bg: @state-info-bg;
@alert-info-text: @state-info-text;
@alert-info-border: @state-info-border;
@alert-warning-bg: @state-warning-bg;
@alert-warning-text: @state-warning-text;
@alert-warning-border: @state-warning-border;
@alert-danger-bg: @state-danger-bg;
@alert-danger-text: @state-danger-text;
@alert-danger-border: @state-danger-border;
// Progress bars
// -------------------------
@ -486,11 +486,14 @@
// Panels
// -------------------------
@panel-bg: #fff;
@panel-border: #ddd;
@panel-inner-border: #ddd;
@panel-border-radius: @border-radius-base;
@panel-heading-bg: #f5f5f5;
@panel-footer-bg: #f5f5f5;
@panel-default-text: @gray-dark;
@panel-default-border: #ddd;
@panel-default-heading-bg: #f5f5f5;
@panel-primary-text: #fff;
@panel-primary-border: @brand-primary;
@panel-primary-heading-bg: @brand-primary;