11895c7e30
This solution is somewhat hacky, the @media element really deserves a
Node subclass and it's own parsing rules. What's still missing is LESS
variables in grouped media queries like:
@singleQuery: ~"(max-width: 500px)";
@media screen, @singleQuery {
set { padding: 3 3 3 3; }
}
Fixes #18
42 lines
521 B
CSS
42 lines
521 B
CSS
@media screen,projection {
|
|
html {
|
|
background: #fffef0;
|
|
color: #330000;
|
|
}
|
|
body {
|
|
max-width: 35em;
|
|
margin: 0 auto;
|
|
}
|
|
}
|
|
@media print {
|
|
.class {
|
|
color: blue;
|
|
}
|
|
.class .sub {
|
|
width: 42;
|
|
}
|
|
.top, header > h1 {
|
|
color: #444444;
|
|
}
|
|
}
|
|
@media screen {
|
|
body {
|
|
max-width: 480;
|
|
}
|
|
}
|
|
@media all and (orientation:portrait) {
|
|
aside {
|
|
float: none;
|
|
}
|
|
}
|
|
@media (min-width:768px)and (max-width: 979px) {
|
|
.hidden-desktop {
|
|
display: none !important;
|
|
}
|
|
}
|
|
@media (min-width:12px) {
|
|
body {
|
|
margin: 0 auto;
|
|
}
|
|
}
|