rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-17 09:52:29 +01:00
Code Issues Actions Packages Releases Activity

rename media-breakpoint-{min,max} => media-breakpoint-{up,down}

Browse Source
This commit is contained in:
Chris Rebert 2014-12-29 13:37:20 -08:00
parent ff9c07f4aa
commit 746e09f8ae
4 changed files with 13 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
scss/_grid.scss
View File

@ -12,7 +12,7 @@
// For each breakpoint, define the maximum width of the container in a media query
@each $breakpoint, $container-max-width in $container-max-widths {
@include media-breakpoint-min($breakpoint) {
@include media-breakpoint-up($breakpoint) {
max-width: $container-max-width;
}
}

11
scss/mixins/_breakpoints.scss
View File

@ -39,7 +39,8 @@
}
// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.
@mixin media-breakpoint-min($name, $breakpoints: $grid-breakpoints) {
// Makes the @content apply to the given breakpoint and wider.
@mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {
$min: breakpoint-min($name, $breakpoints);
@if $min {
@media (min-width: $min) {
@ -51,7 +52,8 @@
}
// Media of at most the maximum breakpoint width. No query for the largest breakpoint.
@mixin media-breakpoint-max($name, $breakpoints: $grid-breakpoints) {
// Makes the @content apply to the given breakpoint and narrower.
@mixin media-breakpoint-down($name, $breakpoints: $grid-breakpoints) {
$max: breakpoint-max($name, $breakpoints);
@if $max {
@media (max-width: $max) {
@ -64,6 +66,7 @@
// Media between the breakpoint's minimum and maximum widths.
// No minimum for the smallest breakpoint, and no maximum for the largest one.
// Makes the @content apply only to the given breakpoint, not viewports any wider or narrower.
@mixin media-breakpoint-only($name, $breakpoints: $grid-breakpoints) {
// Nested media query combination does not work in libsass yet
// https://github.com/sass/libsass/issues/185
@ -76,8 +79,8 @@
}
} @else {
// One of min or max is a no-op, so this branch is not affected by libsass#185
@include media-breakpoint-min($name, $breakpoints) {
@include media-breakpoint-max($name, $breakpoints) {
@include media-breakpoint-up($name, $breakpoints) {
@include media-breakpoint-down($name, $breakpoints) {
@content;
}
}

2
scss/mixins/_grid-framework.scss
View File

@ -19,7 +19,7 @@
@extend %grid-column;
}
}
@include media-breakpoint-min($breakpoint) {
@include media-breakpoint-up($breakpoint) {
// Work around cross-media @extend (https://github.com/sass/sass/issues/1050)
%grid-column-float-#{$breakpoint} {
float: left;

8
scss/mixins/_media-queries.scss
View File

@ -1,11 +1,11 @@
// Media query mixins for default breakpoints
@mixin media-xs() {
@include media-breakpoint-max(xs) { @content }
@include media-breakpoint-down(xs) { @content }
}
@mixin media-sm() {
@include media-breakpoint-min(sm) { @content }
@include media-breakpoint-up(sm) { @content }
}
@mixin media-sm-max() {
@ -13,7 +13,7 @@
}
@mixin media-md() {
@include media-breakpoint-min(md) { @content }
@include media-breakpoint-up(md) { @content }
}
@mixin media-md-max() {
@ -21,5 +21,5 @@
}
@mixin media-lg() {
@include media-breakpoint-min(lg) { @content }
@include media-breakpoint-up(lg) { @content }
}