Skip to content

Instantly share code, notes, and snippets.

@tommymarshall
Last active December 20, 2015 13:59
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save tommymarshall/6143042 to your computer and use it in GitHub Desktop.
Save tommymarshall/6143042 to your computer and use it in GitHub Desktop.
Responsive breakpoints as a body pseudo-element. Just add the `responder` class to your `<body>` and you're good to go.
/* @group Responsive Tooltip */
body.responder:after {
display: block;
background: #f00;
top: 5px;
color: #000;
font-size: 36px;
position: fixed;
right: 5px;
height: 50px;
text-align: center;
text-transform: uppercase;
width: 200px;
z-index: 99;
@include respond-to($mobile) {
content: "Mobile";
}
@include respond-to($tablet) {
content: "Tablet";
}
@include respond-to($notebook) {
content: "Notebook";
}
@include respond-to($desktop) {
content: "Desktop";
}
@include respond-to($cinema) {
content: "Cinema";
}
}
/* @end */
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment