kotovalexarian-likes-github/twbs--bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2022-11-09 12:25:43 -05:00
Code Releases Activity
twbs--bootstrap/less/responsive-utilities.less

44 lines
1.2 KiB
Text
Raw Normal View History

standardize top level file comments
2012-06-29 00:46:45 -04:00
//
// Responsive: Utility classes
// --------------------------------------------------
Overhaul the responsive utility classes: 1. Rename file from responsive-utility-classes.less to responsive-utilities.less 2. Add additional help text around the documentation for the classes in Scaffolding 3. Remove unnecessary display values on initial classes 4. Drop block values for inherit for better support on inline and table elements 5. Make use of \!important on every class to avoid classes with more specific selectors (e.g., .span* classes for the grid)
2012-03-25 04:12:51 -04:00
// Hide from screenreaders and browsers
// Credit: HTML5 Boilerplate
.hidden {
display: none;
visibility: hidden;
}
// Visibility utilities
// For desktops
.visible-phone { display: none !important; }
.visible-tablet { display: none !important; }
.visible-desktop { } // Don't set initially
.hidden-phone { }
.hidden-tablet { }
.hidden-desktop { display: none !important; }
reorder media queries
2012-06-25 19:25:50 -04:00
// Tablets & small desktops only
@media (min-width: 768px) and (max-width: 979px) {
Overhaul the responsive utility classes: 1. Rename file from responsive-utility-classes.less to responsive-utilities.less 2. Add additional help text around the documentation for the classes in Scaffolding 3. Remove unnecessary display values on initial classes 4. Drop block values for inherit for better support on inline and table elements 5. Make use of \!important on every class to avoid classes with more specific selectors (e.g., .span* classes for the grid)
2012-03-25 04:12:51 -04:00
// Show
reorder media queries
2012-06-25 19:25:50 -04:00
.visible-tablet { display: inherit !important; }
Overhaul the responsive utility classes: 1. Rename file from responsive-utility-classes.less to responsive-utilities.less 2. Add additional help text around the documentation for the classes in Scaffolding 3. Remove unnecessary display values on initial classes 4. Drop block values for inherit for better support on inline and table elements 5. Make use of \!important on every class to avoid classes with more specific selectors (e.g., .span* classes for the grid)
2012-03-25 04:12:51 -04:00
// Hide
reorder media queries
2012-06-25 19:25:50 -04:00
.hidden-tablet { display: none !important; }
Overhaul the responsive utility classes: 1. Rename file from responsive-utility-classes.less to responsive-utilities.less 2. Add additional help text around the documentation for the classes in Scaffolding 3. Remove unnecessary display values on initial classes 4. Drop block values for inherit for better support on inline and table elements 5. Make use of \!important on every class to avoid classes with more specific selectors (e.g., .span* classes for the grid)
2012-03-25 04:12:51 -04:00
// Hide everything else
.hidden-desktop { display: inherit !important; }
reorder media queries
2012-06-25 19:25:50 -04:00
.visible-desktop { display: none !important ; }
Overhaul the responsive utility classes: 1. Rename file from responsive-utility-classes.less to responsive-utilities.less 2. Add additional help text around the documentation for the classes in Scaffolding 3. Remove unnecessary display values on initial classes 4. Drop block values for inherit for better support on inline and table elements 5. Make use of \!important on every class to avoid classes with more specific selectors (e.g., .span* classes for the grid)
2012-03-25 04:12:51 -04:00
}
reorder media queries
2012-06-25 19:25:50 -04:00
// Phones only
@media (max-width: 767px) {
Overhaul the responsive utility classes: 1. Rename file from responsive-utility-classes.less to responsive-utilities.less 2. Add additional help text around the documentation for the classes in Scaffolding 3. Remove unnecessary display values on initial classes 4. Drop block values for inherit for better support on inline and table elements 5. Make use of \!important on every class to avoid classes with more specific selectors (e.g., .span* classes for the grid)
2012-03-25 04:12:51 -04:00
// Show
reorder media queries
2012-06-25 19:25:50 -04:00
.visible-phone { display: inherit !important; } // Use inherit to restore previous behavior
Overhaul the responsive utility classes: 1. Rename file from responsive-utility-classes.less to responsive-utilities.less 2. Add additional help text around the documentation for the classes in Scaffolding 3. Remove unnecessary display values on initial classes 4. Drop block values for inherit for better support on inline and table elements 5. Make use of \!important on every class to avoid classes with more specific selectors (e.g., .span* classes for the grid)
2012-03-25 04:12:51 -04:00
// Hide
reorder media queries
2012-06-25 19:25:50 -04:00
.hidden-phone { display: none !important; }
Overhaul the responsive utility classes: 1. Rename file from responsive-utility-classes.less to responsive-utilities.less 2. Add additional help text around the documentation for the classes in Scaffolding 3. Remove unnecessary display values on initial classes 4. Drop block values for inherit for better support on inline and table elements 5. Make use of \!important on every class to avoid classes with more specific selectors (e.g., .span* classes for the grid)
2012-03-25 04:12:51 -04:00
// Hide everything else
.hidden-desktop { display: inherit !important; }
reorder media queries
2012-06-25 19:25:50 -04:00
.visible-desktop { display: none !important; }
Overhaul the responsive utility classes: 1. Rename file from responsive-utility-classes.less to responsive-utilities.less 2. Add additional help text around the documentation for the classes in Scaffolding 3. Remove unnecessary display values on initial classes 4. Drop block values for inherit for better support on inline and table elements 5. Make use of \!important on every class to avoid classes with more specific selectors (e.g., .span* classes for the grid)
2012-03-25 04:12:51 -04:00
}
Copy permalink