Browse Source

use media queries to only show font-weight 100 on retina screens.

pull/351/head
connors 11 years ago
parent
commit
0dcaa1adb2
  1. 23
      docs/assets/css/docs.css
  2. 32
      sass/docs.scss

23
docs/assets/css/docs.css

@ -93,12 +93,17 @@ body {
left: 50%;
margin-bottom: 0;
font-size: 22px;
font-weight: 100;
font-weight: 300;
z-index: 20;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
.docs-title {
font-weight: 100;
}
}
.docs-nav .docs-nav-trigger {
color: #fff;
@ -125,9 +130,13 @@ body {
.docs-nav .docs-nav-item {
display: block;
padding: 20px 15px;
font-weight: 100;
font-size: 22px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
.docs-nav .docs-nav-item {
font-weight: 100;
}
}
.docs-jump-menu,
.docs-component-group {
@ -378,7 +387,13 @@ body {
.docs-sub-content .page-description {
margin-top: 0;
margin-bottom: 0;
font-weight: 300;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
.docs-sub-content .page-title,
.docs-sub-content .page-description {
font-weight: 100;
}
}
.docs-sub-content .page-title {
font-size: 40px;
@ -415,7 +430,11 @@ body {
.section-lead {
font-size: 18px;
color: #777;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
.section-lead {
font-weight: 100;
}
}
@media screen and (min-width: 768px) {

32
sass/docs.scss

@ -93,9 +93,16 @@ body {
left: 50%;
margin-bottom: 0;
font-size: 22px;
font-weight: 100;
font-weight: 300;
z-index: 20;
@include transform(translateX(-50%));
// Use a thinner weight on retina
@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
font-weight: 100;
}
}
.docs-nav {
.docs-nav-trigger {
@ -125,12 +132,18 @@ body {
.docs-nav-item {
display: block;
padding: 20px 15px;
font-weight: 100;
font-size: 22px;
// Use a thinner weight on retina
@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
font-weight: 100;
}
}
}
.docs-jump-menu,
.docs-component-group{
.docs-component-group {
display: none;
}
.docs-title a,
@ -377,8 +390,15 @@ body {
.page-description {
margin-top: 0;
margin-bottom: 0;
font-weight: 300;
// Use a thinner weight on retina
@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
font-weight: 100;
}
}
.page-title {
font-size: 40px;
margin-bottom: 5px;
@ -418,7 +438,13 @@ body {
.section-lead {
font-size: 18px;
color: #777;
// Use a thinner weight on retina
@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
font-weight: 100;
}
}
// Desktop: Section headings

Loading…
Cancel
Save