Adding variables for container sizes
This commit is contained in:
parent
2b088ef44e
commit
6fda25b4c1
|
@ -39,21 +39,21 @@
|
||||||
// Responsive: Tablets and up
|
// Responsive: Tablets and up
|
||||||
@media screen and (min-width: @screen-tablet) {
|
@media screen and (min-width: @screen-tablet) {
|
||||||
.container {
|
.container {
|
||||||
max-width: (@screen-tablet - 40);
|
max-width: @container-tablet;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Responsive: Desktops and up
|
// Responsive: Desktops and up
|
||||||
@media screen and (min-width: @screen-desktop) {
|
@media screen and (min-width: @screen-desktop) {
|
||||||
.container {
|
.container {
|
||||||
max-width: (@screen-desktop - 52);
|
max-width: @container-desktop;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Responsive: Large desktops and up
|
// Responsive: Large desktops and up
|
||||||
@media screen and (min-width: @screen-large-desktop) {
|
@media screen and (min-width: @screen-large-desktop) {
|
||||||
.container {
|
.container {
|
||||||
max-width: (@screen-large-desktop - @grid-gutter-width);
|
max-width: @container-large-desktop;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -405,6 +405,19 @@
|
||||||
@screen-large-desktop: @screen-large;
|
@screen-large-desktop: @screen-large;
|
||||||
|
|
||||||
|
|
||||||
|
// Container sizes
|
||||||
|
// --------------------------------------------------
|
||||||
|
|
||||||
|
// Small screen / tablet
|
||||||
|
@container-tablet: 728px;
|
||||||
|
|
||||||
|
// Medium screen / desktop
|
||||||
|
@container-desktop: 940px;
|
||||||
|
|
||||||
|
// Large screen / wide desktop
|
||||||
|
@container-large-desktop: 1170px;
|
||||||
|
|
||||||
|
|
||||||
// Grid system
|
// Grid system
|
||||||
// --------------------------------------------------
|
// --------------------------------------------------
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue