habitica-self-host/public/css/responsive.styl
2013-09-06 19:19:43 +02:00

61 lines
No EOL
910 B
Stylus

// widths
.full
width: 100%;
.half
width: 50%;
.third
width: 33.3333%;
.two-thirds
width: 66.6666%;
.quarter
width: 25%;
.three-quarters
width: 75%;
.fifth
width: 20%;
.two-fifths
width: 40%;
.three-fifths
width: 60%;
.four-fifths
width: 80%;
.sixth
width: 16.6667%;
.eighth
width: 12.5%;
.tenth
width: 10%;
.twelfth
width: 8.3333%;
.grid
padding: 0 1.5em 1.5em 0
letter-spacing: -4px
.module
display: inline-block
letter-spacing: normal
vertical-align: top
width: 25%
padding: 0 0 1.5em 1.5em
-moz-box-sizing: border-box
box-sizing: border-box
// at 960px when 4 columns really starts to break
@media (max-width: 60em)
.module
width: 50%
.task-column
max-height: 18em
overflow-y: scroll
// at 600px when 2col starts breaking
@media (max-width: 37.5em)
.grid
padding-right: 0
.module
width: 100%
padding-left: 0
.task-column
max-height: none
overflow: visible