mirror of https://github.com/twbs/bootstrap.git
more media query mixins
This commit is contained in:
parent
44f948ad53
commit
47bef3c6a0
|
@ -219,8 +219,7 @@
|
|||
|
||||
|
||||
// Scale up controls for tablets and up
|
||||
@media screen and (min-width: @screen-sm-min) {
|
||||
|
||||
.media-sm({
|
||||
// Scale up the controls a smidge
|
||||
.carousel-control {
|
||||
.icon-prev,
|
||||
|
@ -249,4 +248,4 @@
|
|||
.carousel-indicators {
|
||||
bottom: 20px;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
@ -192,7 +192,7 @@
|
|||
//
|
||||
// Reiterate per navbar.less and the modified component alignment there.
|
||||
|
||||
@media (min-width: @grid-float-breakpoint) {
|
||||
.media-sm({
|
||||
.navbar-right {
|
||||
.dropdown-menu {
|
||||
.dropdown-menu-right();
|
||||
|
@ -203,4 +203,4 @@
|
|||
.dropdown-menu-left();
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
@ -424,7 +424,7 @@ input[type="checkbox"] {
|
|||
.form-inline {
|
||||
|
||||
// Kick in the inline
|
||||
@media (min-width: @screen-sm-min) {
|
||||
.media-sm({
|
||||
// Inline-block all the things for "inline"
|
||||
.form-group {
|
||||
display: inline-block;
|
||||
|
@ -489,7 +489,7 @@ input[type="checkbox"] {
|
|||
.has-feedback .form-control-feedback {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
@ -525,13 +525,13 @@ input[type="checkbox"] {
|
|||
|
||||
// Reset spacing and right align labels, but scope to media queries so that
|
||||
// labels on narrow viewports stack the same as a default form example.
|
||||
@media (min-width: @screen-sm-min) {
|
||||
.media-sm({
|
||||
.control-label {
|
||||
text-align: right;
|
||||
margin-bottom: 0;
|
||||
padding-top: (@padding-base-vertical + 1); // Default padding plus a border
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Validation states
|
||||
//
|
||||
|
|
|
@ -61,24 +61,24 @@
|
|||
// Columns, offsets, pushes, and pulls for the small device range, from phones
|
||||
// to tablets.
|
||||
|
||||
@media (min-width: @screen-sm-min) {
|
||||
.media-sm({
|
||||
.make-grid(sm);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// Medium grid
|
||||
//
|
||||
// Columns, offsets, pushes, and pulls for the desktop device range.
|
||||
|
||||
@media (min-width: @screen-md-min) {
|
||||
.media-md({
|
||||
.make-grid(md);
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
// Large grid
|
||||
//
|
||||
// Columns, offsets, pushes, and pulls for the large desktop device range.
|
||||
|
||||
@media (min-width: @screen-lg-min) {
|
||||
.media-lg({
|
||||
.make-grid(lg);
|
||||
}
|
||||
});
|
||||
|
|
|
@ -27,7 +27,7 @@
|
|||
border-top-color: darken(@jumbotron-bg, 10%);
|
||||
}
|
||||
|
||||
@media (min-width: @screen-sm-min) {
|
||||
.media-sm({
|
||||
.jumbotron {
|
||||
padding: (@jumbotron-padding * 1.6) 0;
|
||||
|
||||
|
@ -41,4 +41,4 @@
|
|||
.jumbotron-heading {
|
||||
font-size: (@font-size-base * 4.5);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
@ -130,7 +130,7 @@
|
|||
}
|
||||
|
||||
// Scale up the modal
|
||||
@media (min-width: @screen-sm-min) {
|
||||
.media-sm({
|
||||
// Automatically set modal's width for larger viewports
|
||||
.modal-dialog {
|
||||
width: @modal-md;
|
||||
|
@ -142,8 +142,8 @@
|
|||
|
||||
// Modal sizes
|
||||
.modal-sm { width: @modal-sm; }
|
||||
}
|
||||
});
|
||||
|
||||
@media (min-width: @screen-md-min) {
|
||||
.media-sm({
|
||||
.modal-lg { width: @modal-lg; }
|
||||
}
|
||||
});
|
||||
|
|
Loading…
Reference in New Issue