Browse files

some mobile optimizations for docs

  • Loading branch information...
1 parent cc6ffa5 commit b79b33de3acfd4edeb9fde3a2a97e0009c992706 Rob Fletcher committed Oct 11, 2012
Showing with 32 additions and 8 deletions.
  1. +1 −1 src/docs/stylesheets/betamax.css
  2. +31 −7 src/docs/stylesheets/betamax.less
View
2 src/docs/stylesheets/betamax.css
1 addition, 1 deletion not shown because the diff is too large. Please use a local Git client to view these changes.
View
38 src/docs/stylesheets/betamax.less
@@ -92,7 +92,25 @@ pre.prettyprint, code.prettyprint {
}
dl {
+ dt, dt code {
+ font-weight: bold;
+ }
.dl-horizontal;
+ @media (max-width: @phoneMax) {
+ dt {
+ float: none;
+ clear: none;
+ width: auto;
+ text-align: left;
+ margin: 8px 0 4px;
+ &:first-child {
+ margin-top: 0;
+ }
+ }
+ dd {
+ margin-left: 0;
+ }
+ }
}
.affix, .affix-bottom {
@@ -222,24 +240,24 @@ dl {
}
h2 {
- background-image: url("../images/stripes-bg.png");
- background-position: top right;
- background-repeat: repeat-y;
border-bottom: 1px solid @headingsColor;
- font-size: 48px;
+ font-size: 28px;
text-transform: uppercase;
margin: 48px 0 24px;
padding-top: 9px; // I hate doing this but Vollkorn renders with a lot of space below the characters
text-indent: 20px;
&:first-child {
margin-top: 0;
}
- @media (max-width: 499px) {
- font-size: 28px;
- }
@media (min-width: 500px) and (max-width: @phoneMax) {
font-size: 36px;
}
+ @media (min-width: @tabletMin) {
+ background-image: url("../images/stripes-bg.png");
+ background-position: top right;
+ background-repeat: repeat-y;
+ font-size: 48px;
+ }
}
.navbar {
@@ -306,6 +324,12 @@ header {
}
}
+ p {
+ @media (min-width: @desktopMin) {
+ font-size: 22px;
+ }
+ }
+
.hero-unit {
padding: 30px 450px 30px 48px;
@media (max-width: @tabletMax) {

0 comments on commit b79b33d

Please sign in to comment.