Commit 407c9667 authored by Zac Wasielewski's avatar Zac Wasielewski

Make visibility utility classes responsive when used as LESS mixins

parent c587114f
...@@ -35,70 +35,58 @@ ...@@ -35,70 +35,58 @@
// Visibility utilities // Visibility utilities
// For Phones
.visible-sm { .visible-sm {
.responsive-visibility(); .responsive-visibility();
} @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
.visible-md {
.responsive-invisibility(); .responsive-invisibility();
} }
.visible-lg { @media (min-width: @screen-desktop) {
.responsive-invisibility(); .responsive-invisibility();
}
} }
.visible-md {
.hidden-sm {
.responsive-invisibility(); .responsive-invisibility();
} @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
.hidden-md {
.responsive-visibility(); .responsive-visibility();
}
.hidden-lg {
.responsive-visibility();
}
// Tablets & small desktops only
@media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
.visible-sm {
.responsive-invisibility();
} }
.visible-md { @media (min-width: @screen-desktop) {
.responsive-visibility();
}
.visible-lg {
.responsive-invisibility(); .responsive-invisibility();
} }
}
.hidden-sm { .visible-lg {
.responsive-visibility(); .responsive-invisibility();
} @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
.hidden-md {
.responsive-invisibility(); .responsive-invisibility();
} }
.hidden-lg { @media (min-width: @screen-desktop) {
.responsive-visibility(); .responsive-visibility();
} }
} }
// For desktops .hidden-sm {
@media (min-width: @screen-desktop) {
.visible-sm {
.responsive-invisibility(); .responsive-invisibility();
@media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
.responsive-visibility();
} }
.visible-md { @media (min-width: @screen-desktop) {
.responsive-invisibility(); .responsive-visibility();
} }
.visible-lg { }
.hidden-md {
.responsive-visibility(); .responsive-visibility();
@media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
.responsive-invisibility();
} }
@media (min-width: @screen-desktop) {
.hidden-sm {
.responsive-visibility(); .responsive-visibility();
} }
.hidden-md { }
.hidden-lg {
.responsive-visibility();
@media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
.responsive-visibility(); .responsive-visibility();
} }
.hidden-lg { @media (min-width: @screen-desktop) {
.responsive-invisibility(); .responsive-invisibility();
} }
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment