Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
Bootstrap
bootstrap
Commits
94a3d4eb
Commit
94a3d4eb
authored
12 years ago
by
Mark Otto
Browse files
Options
Download
Email Patches
Plain Diff
reorder media queries
parent
8c2db7d7
Changes
4
Expand all
Hide whitespace changes
Inline
Side-by-side
Showing
4 changed files
docs/assets/css/bootstrap-responsive.css
+351
-351
docs/assets/css/bootstrap-responsive.css
less/responsive-767px-max.less
+67
-67
less/responsive-767px-max.less
less/responsive-utilities.less
+10
-10
less/responsive-utilities.less
less/responsive.less
+4
-4
less/responsive.less
with
432 additions
and
432 deletions
+432
-432
docs/assets/css/bootstrap-responsive.css
+
351
-
351
View file @
94a3d4eb
This diff is collapsed.
Click to expand it.
less/responsive-767px-max.less
+
67
-
67
View file @
94a3d4eb
// UP TO LANDSCAPE PHONE
// ---------------------
@media (max-width: 480px) {
// Smooth out the collapsing/expanding nav
.nav-collapse {
-webkit-transform: translate3d(0, 0, 0); // activate the GPU
}
// Block level the page header small tag for readability
.page-header h1 small {
display: block;
line-height: @baseLineHeight;
}
// Update checkboxes for iOS
input[type="checkbox"],
input[type="radio"] {
border: 1px solid #ccc;
}
// Remove the horizontal form styles
.form-horizontal .control-group > label {
float: none;
width: auto;
padding-top: 0;
text-align: left;
}
// Move over all input controls and content
.form-horizontal .controls {
margin-left: 0;
}
// Move the options list down to align with labels
.form-horizontal .control-list {
padding-top: 0; // has to be padding because margin collaspes
}
// Move over buttons in .form-actions to align with .controls
.form-horizontal .form-actions {
padding-left: 10px;
padding-right: 10px;
}
// Modals
.modal {
position: fixed;
top: 10px;
left: 10px;
right: 10px;
width: auto;
margin: 0;
&.fade.in { top: auto; }
}
.modal-header .close {
padding: 10px;
margin: -10px;
}
// Carousel
.carousel-caption {
position: static;
}
}
// LANDSCAPE PHONE TO SMALL DESKTOP & PORTRAIT TABLET
// --------------------------------------------------
...
...
@@ -147,3 +80,70 @@
}
}
// UP TO LANDSCAPE PHONE
// ---------------------
@media (max-width: 480px) {
// Smooth out the collapsing/expanding nav
.nav-collapse {
-webkit-transform: translate3d(0, 0, 0); // activate the GPU
}
// Block level the page header small tag for readability
.page-header h1 small {
display: block;
line-height: @baseLineHeight;
}
// Update checkboxes for iOS
input[type="checkbox"],
input[type="radio"] {
border: 1px solid #ccc;
}
// Remove the horizontal form styles
.form-horizontal .control-group > label {
float: none;
width: auto;
padding-top: 0;
text-align: left;
}
// Move over all input controls and content
.form-horizontal .controls {
margin-left: 0;
}
// Move the options list down to align with labels
.form-horizontal .control-list {
padding-top: 0; // has to be padding because margin collaspes
}
// Move over buttons in .form-actions to align with .controls
.form-horizontal .form-actions {
padding-left: 10px;
padding-right: 10px;
}
// Modals
.modal {
position: fixed;
top: 10px;
left: 10px;
right: 10px;
width: auto;
margin: 0;
&.fade.in { top: auto; }
}
.modal-header .close {
padding: 10px;
margin: -10px;
}
// Carousel
.carousel-caption {
position: static;
}
}
This diff is collapsed.
Click to expand it.
less/responsive-utilities.less
+
10
-
10
View file @
94a3d4eb
...
...
@@ -18,24 +18,24 @@
.hidden-tablet { }
.hidden-desktop { display: none !important; }
//
Phone
s only
@media (max-width:
767
px) {
//
Tablets & small desktop
s only
@media
(min-width: 768px) and
(max-width:
979
px) {
// Show
.visible-
phone
{ display: inherit !important; }
// Use inherit to restore previous behavior
.visible-
tablet
{ display: inherit !important; }
// Hide
.hidden-
phone
{ display: none !important; }
.hidden-
tablet
{ display: none !important; }
// Hide everything else
.hidden-desktop { display: inherit !important; }
.visible-desktop { display: none !important; }
.visible-desktop { display: none !important
; }
}
//
Tablets & small desktop
s only
@media (m
in
-width: 76
8px) and (max-width: 979
px) {
//
Phone
s only
@media (m
ax
-width: 76
7
px) {
// Show
.visible-
tablet
{ display: inherit !important; }
.visible-
phone
{ display: inherit !important; }
// Use inherit to restore previous behavior
// Hide
.hidden-
tablet
{ display: none !important; }
.hidden-
phone
{ display: none !important; }
// Hide everything else
.hidden-desktop { display: inherit !important; }
.visible-desktop { display: none !important
; }
.visible-desktop { display: none !important; }
}
This diff is collapsed.
Click to expand it.
less/responsive.less
+
4
-
4
View file @
94a3d4eb
...
...
@@ -31,14 +31,14 @@
// MEDIA QUERIES
// ------------------
//
Phones to portrait tablets and narrow
desktops
@import "responsive-
767
px-m
ax
.less";
//
Large
desktops
@import "responsive-
1200
px-m
in
.less";
// Tablets to regular desktops
@import "responsive-768px-979px.less";
//
Large
desktops
@import "responsive-
1200
px-m
in
.less";
//
Phones to portrait tablets and narrow
desktops
@import "responsive-
767
px-m
ax
.less";
// RESPONSIVE NAVBAR
...
...
This diff is collapsed.
Click to expand it.
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment