website: lots of tweaking around code styling

This commit is contained in:
Mitchell Hashimoto 2013-06-20 22:19:49 -07:00
parent 40a9356b9f
commit dcf34b6578
4 changed files with 167 additions and 199 deletions

View File

@ -1,10 +1,10 @@
.hero { .hero {
height: $hero-height; height: $hero-height;
background: #000000 url(/images/hero_image.jpg) no-repeat 35px -50px; background: #000000 url(/images/hero_image.jpg) no-repeat 35px -40px;
background-size: 960px 467px; background-size: 960px 467px;
h2 { h2 {
margin-top: 60px; margin-top: 70px;
} }
} }
@ -125,10 +125,6 @@
.docs-wrapper { .docs-wrapper {
clear: right; clear: right;
@include respond-to(mobile) {
margin-right: -20px;
margin-left: -20px;
}
.docs-body { .docs-body {
float: left; float: left;
@ -136,25 +132,27 @@
max-width: 760px; max-width: 760px;
display: block; display: block;
@extend .white-background; @extend .white-background;
@include respond-to(mobile) {
width: 100%;
}
.docs-content { .docs-content {
max-width: 600px;
padding: $docs-top-margin 80px; padding: $docs-top-margin 80px;
display: block; display: block;
@include respond-to(mobile) {
padding: 0; pre {
width: 91%; margin-left: -80px;
margin-left: 5%; margin-right: -80px;
padding-top: 40px;
padding-bottom: 40px;
padding-left: 80px;
padding-right: 80px;
border-radius: 0;
} }
} }
.docs-background { .docs-background {
@extend .white-background; @extend .white-background;
height: 100%; height: 100%;
width: 760px; width: 70%;
max-width: 760px;
position: fixed; position: fixed;
top: 0; top: 0;
left: $sidebar-width; left: $sidebar-width;
@ -165,17 +163,6 @@
margin-top: $docs-top-margin; margin-top: $docs-top-margin;
} }
h1,
h2,
h3,
p {
@include respond-to(mobile) {
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
}
}
h1 { h1 {
font-size: 40px; font-size: 40px;
line-height: (25/20); line-height: (25/20);
@ -192,18 +179,6 @@
text-transform: capitalize; text-transform: capitalize;
} }
} }
pre {
@include respond-to(mobile) {
margin: $baseline 0 $baseline 0;
padding: $baseline 0 0 $baseline;
width: 80%;
background-color: transparent;
border: none;
color: $black;
}
}
} }
.pagination { .pagination {

View File

@ -33,14 +33,14 @@ $button-height: 60px;
// components // components
$nav-height: 100px; $nav-height: 100px;
$hero-height: 440px; $hero-height: 460px;
$docs-top-margin: 60px; $docs-top-margin: 60px;
$sidebar-background-color: $dark-background; $sidebar-background-color: $dark-background;
$sidebar-width: 250px; $sidebar-width: 250px;
//typography //typography
$serif: 'tk-ff-tisa-web-pro', 'ff-tisa-web-pro-1', 'ff-tisa-web-pro-2', 'tisa ot', helvetica, Georgia, serif; $serif: 'prenton', helvetica, Georgia, serif;
$sans: 'HeimatStencil-SemiBold', 'Avenir', 'Helvetica Neue', Helvetica, Arial, sans-serif; $sans: 'HeimatStencil-SemiBold', 'Avenir', 'Helvetica Neue', Helvetica, Arial, sans-serif;
$mono: 'Inconsolata', 'courier new', courier, mono-space; $mono: 'Inconsolata', 'courier new', courier, mono-space;

View File

@ -7,18 +7,11 @@
float: left; float: left;
background-color: $sidebar-background-color; background-color: $sidebar-background-color;
height: 100%; height: 100%;
@include respond-to(mobile) {
width: 100%;
}
h2 { h2 {
color: $green; color: $green;
text-transform: uppercase; text-transform: uppercase;
padding: $docs-top-margin 20px 0; padding: $docs-top-margin 20px 0;
@include respond-to(mobile) {
padding: $baseline;
}
} }
h4 { h4 {
@ -28,7 +21,6 @@
} }
ul { ul {
@extend .padded-sm; @extend .padded-sm;
li { li {
@ -43,9 +35,6 @@
display: block; display: block;
width: 100%; width: 100%;
} }
} }
.sidebar-background { .sidebar-background {
@ -57,5 +46,4 @@
left: 0; left: 0;
z-index: -9999; z-index: -9999;
} }
} }

View File

@ -176,8 +176,13 @@ pre {
background-color: $black; background-color: $black;
color: $white; color: $white;
margin: ($baseline * 2) 0; margin: ($baseline * 2) 0;
padding-top: $baseline; margin-left: -80px;
padding-bottom: 0; margin-right: -80px;
padding-top: 40px;
padding-bottom: 40px;
padding-left: 80px;
padding-right: 80px;
border-radius: 0;
} }
table { table {