Skip to content

Instantly share code, notes, and snippets.

Matt Reedman mattics

Block or report user

Report or block mattics

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@mattics
mattics / media-queries
Last active Dec 11, 2015
A stripped down version of 4563625 which is non specific to bootstrap and easier to understand the concept due to lack of clutter.
View media-queries
@media (min-width: 1200px) {
.makeMyStyles(940px, 15px)
}
@media (max-width: 1199px) {
.makeMyStyles(768px, 12px)
}
.makeMyStyles(@width, @padding) {
.makeHalfWidthColumn() { // just an example mixin
width: @width / 2l
@mattics
mattics / main.css
Last active Dec 11, 2015
A quick bit of LESS to overcome the lack of ability to use makeColumn and makeRow responsively in Twitter Bootstrap. This isn't a true alternative to makeColumn and makeRow but is a workaround so we can use semantic class names and responsive column sizes with only minimal disruption to LESS. Can be used separately or together with Bootstraps re…
View main.css
// Can and should use the variables set in variables.less for different media sizes. i.e. @gridColumnWidth and @gridColumnWidth768 etc
@media (min-width: 1200px) {
.makeResponsiveGrid(60px, 10px, 16)
}
@media (max-width: 1199px) {
.makeResponsiveGrid(48px, 12px, 16)
}
// Can be extended infinitely
.makeResponsiveGrid(@gridColumnWidth, @gridGutterWidth, @columns) {
You can’t perform that action at this time.