Refactoring base SASS
This commit is contained in:
Mike Francis
parent
b1534b9a0d
commit
a50d913cc4
|
|
@ -1,93 +0,0 @@
|
|||
// Yaho YUI Reset
|
||||
|
||||
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
fieldset, img {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
address, caption, cite, dfn, th, var {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
caption, th {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-size: 100%;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
q:before, q:after {
|
||||
content: '';
|
||||
}
|
||||
|
||||
abbr, acronym {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
// Normalisation
|
||||
|
||||
html {
|
||||
background-color: $bodyBackgroundColour;
|
||||
color: $color;
|
||||
font-family: $baseFontStack;
|
||||
font-size: ($baseFontSize / 16) * 1em;
|
||||
line-height: $baseLineHeight;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6, p, ul, ol, table, pre, fieldset {
|
||||
margin-bottom: $marginBottom * 1px;
|
||||
}
|
||||
|
||||
ul ul, ol ol {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: ($h1FontSize / $baseFontSize) * 1em;
|
||||
line-height: ($marginBottom / $h1FontSize ) * 1em;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: ($h2FontSize / $baseFontSize) * 1em;
|
||||
line-height: ($marginBottom / $h2FontSize ) * 1em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: ($h3FontSize / $baseFontSize) * 1em;
|
||||
line-height: ($marginBottom / $h3FontSize ) * 1em;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: ($h4FontSize / $baseFontSize) * 1em;
|
||||
line-height: ($marginBottom / $h4FontSize ) * 1em;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: ($h5FontSize / $baseFontSize) * 1em;
|
||||
line-height: ($marginBottom / $h5FontSize ) * 1em;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: ($h6FontSize / $baseFontSize) * 1em;
|
||||
line-height: ($marginBottom / $h6FontSize ) * 1em;
|
||||
}
|
||||
|
||||
ul, ol {
|
||||
margin-left: $listMarginLeft * 1px;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
|
@ -0,0 +1,35 @@
|
|||
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
fieldset, img {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
address, caption, cite, dfn, th, var {
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
caption, th {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-size: 100%;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
q:before, q:after {
|
||||
content: '';
|
||||
}
|
||||
|
||||
abbr, acronym {
|
||||
border: 0;
|
||||
}
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
// Base
|
||||
|
||||
$color: #222;
|
||||
$color: #333;
|
||||
$bodyBackgroundColour: #fff;
|
||||
|
||||
$baseFontStack: 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||
|
|
@ -21,7 +21,7 @@ $listMarginLeft: 24;
|
|||
|
||||
// Scaffolding
|
||||
|
||||
$containerWidth: 1200;
|
||||
$containerWidth: 940;
|
||||
$containerPadding: 40;
|
||||
$columnGutter: 20;
|
||||
$columnCount: 12;
|
||||
|
|
|
|||
|
|
@ -11,7 +11,8 @@ Author: Mike Francis
|
|||
|
||||
// Base
|
||||
|
||||
@import "base";
|
||||
@import "reset";
|
||||
@import "normalise";
|
||||
|
||||
// Main
|
||||
|
||||
|
|
|
|||
30
style.css
30
style.css
|
|
@ -19,7 +19,7 @@ q:before, q:after { content: ''; }
|
|||
|
||||
abbr, acronym { border: 0; }
|
||||
|
||||
html { background-color: white; color: #222222; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 0.875em; line-height: 1.5; }
|
||||
html { background-color: white; color: #333333; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 0.875em; line-height: 1.5; }
|
||||
|
||||
h1, h2, h3, h4, h5, h6, p, ul, ol, table, pre, fieldset { margin-bottom: 21px; }
|
||||
|
||||
|
|
@ -39,8 +39,6 @@ h6 { font-size: 1.14286em; line-height: 1.3125em; }
|
|||
|
||||
ul, ol { margin-left: 24px; }
|
||||
|
||||
a { text-decoration: none; }
|
||||
|
||||
.alignleft { float: left; }
|
||||
|
||||
img.alignleft { margin-right: 20px; }
|
||||
|
|
@ -51,7 +49,7 @@ img.alignright { margin-left: 20px; }
|
|||
|
||||
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
|
||||
|
||||
.container { width: 1200px; margin-left: auto; margin-right: auto; padding: 0 40px; }
|
||||
.container { width: 940px; margin-left: auto; margin-right: auto; padding: 0 40px; }
|
||||
@media (max-width: 767px) { .container { width: auto; } }
|
||||
|
||||
@media (max-width: 767px) { .container-fluid { padding: 0; } }
|
||||
|
|
@ -69,29 +67,29 @@ img.alignright { margin-left: 20px; }
|
|||
.col img { width: 100%; }
|
||||
@media (max-width: 767px) { .col { display: block; float: none; width: 100%; margin-left: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } }
|
||||
|
||||
.col1 { width: 81.66667px; }
|
||||
.col1 { width: 60px; }
|
||||
|
||||
.col2 { width: 183.33333px; }
|
||||
.col2 { width: 140px; }
|
||||
|
||||
.col3 { width: 285px; }
|
||||
.col3 { width: 220px; }
|
||||
|
||||
.col4 { width: 386.66667px; }
|
||||
.col4 { width: 300px; }
|
||||
|
||||
.col5 { width: 488.33333px; }
|
||||
.col5 { width: 380px; }
|
||||
|
||||
.col6 { width: 590px; }
|
||||
.col6 { width: 460px; }
|
||||
|
||||
.col7 { width: 691.66667px; }
|
||||
.col7 { width: 540px; }
|
||||
|
||||
.col8 { width: 793.33333px; }
|
||||
.col8 { width: 620px; }
|
||||
|
||||
.col9 { width: 895px; }
|
||||
.col9 { width: 700px; }
|
||||
|
||||
.col10 { width: 996.66667px; }
|
||||
.col10 { width: 780px; }
|
||||
|
||||
.col11 { width: 1098.33333px; }
|
||||
.col11 { width: 860px; }
|
||||
|
||||
.col12 { width: 1200px; }
|
||||
.col12 { width: 940px; }
|
||||
|
||||
.nav { list-style: none; margin-left: 0; }
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue