Categories page is even better on Nexus 7 (and probably iPad mini)
This commit is contained in:
parent
854d9c8fc6
commit
66616c9574
|
@ -41,17 +41,11 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@mixin portrait {
|
@mixin mobile-portrait { @media only screen and (max-width : 320px) { @content; } }
|
||||||
@media only screen and (max-width : 320px) {
|
@mixin not-mobile-portrait { @media only screen and (min-width : 321px) { @content; } }
|
||||||
@content;
|
@mixin mobile-landscape { @media only screen and (min-width : 321px) and (max-width : 959px) { @content; } }
|
||||||
}
|
@mixin not-tablet-landscape { @media only screen and (max-width : 959px) { @content; } }
|
||||||
}
|
@mixin tablet-landscape { @media only screen and (min-width : 960px) { @content; } }
|
||||||
|
|
||||||
@mixin landscape {
|
|
||||||
@media only screen and (min-width : 321px) {
|
|
||||||
@content;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// CSS3 properties
|
// CSS3 properties
|
||||||
// --------------------------------------------------
|
// --------------------------------------------------
|
||||||
|
|
|
@ -50,7 +50,7 @@
|
||||||
border-top: 1px solid #ddd;
|
border-top: 1px solid #ddd;
|
||||||
border-bottom: 1px solid #ddd;
|
border-bottom: 1px solid #ddd;
|
||||||
|
|
||||||
tbody tr {
|
> tbody > tr {
|
||||||
background-color: $white;
|
background-color: $white;
|
||||||
&:nth-child(even) {
|
&:nth-child(even) {
|
||||||
background-color: darken($white, 4%);
|
background-color: darken($white, 4%);
|
||||||
|
@ -167,19 +167,23 @@
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-top: 1px;
|
margin-top: 1px;
|
||||||
}
|
}
|
||||||
|
.category-description {
|
||||||
|
margin-top: 8px;
|
||||||
|
}
|
||||||
.featured-users {
|
.featured-users {
|
||||||
@include portrait {
|
@include mobile-portrait {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
padding-top: 8px;
|
padding-top: 8px;
|
||||||
clear: left;
|
clear: left;
|
||||||
}
|
}
|
||||||
@include landscape {
|
@include not-mobile-portrait {
|
||||||
float: right;
|
float: right;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.latest {
|
.latest {
|
||||||
@include portrait { width: 150px; }
|
@include mobile-portrait { width: 150px; }
|
||||||
@include landscape { width: 270px; }
|
@include mobile-landscape { width: 270px; }
|
||||||
|
@include tablet-landscape { width: 450px; }
|
||||||
.featured-topic {
|
.featured-topic {
|
||||||
margin: 8px 0;
|
margin: 8px 0;
|
||||||
a.last-posted-at, a.last-posted-at:visited {
|
a.last-posted-at, a.last-posted-at:visited {
|
||||||
|
@ -188,7 +192,22 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.stats {
|
.stats {
|
||||||
display: none;
|
@include not-tablet-landscape { display: none; }
|
||||||
|
@include tablet-landscape { min-width: 80px; }
|
||||||
|
}
|
||||||
|
td.stats {
|
||||||
|
.unit {
|
||||||
|
font-size: 11px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
table.categoryStats {
|
||||||
|
td {
|
||||||
|
padding: 2px;
|
||||||
|
vertical-align: bottom;
|
||||||
|
line-height: 17px;
|
||||||
|
&.value { text-align: right; }
|
||||||
|
&.unit { text-align: left; }
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue