Move all files from tab to space
This commit is contained in:
CJ Patoilo
parent
9a63e760df
commit
aa55a7a169
|
|
@ -6,19 +6,19 @@
|
||||||
*,
|
*,
|
||||||
*:after,
|
*:after,
|
||||||
*:before
|
*:before
|
||||||
box-sizing: inherit
|
box-sizing: inherit
|
||||||
|
|
||||||
// The base font-size is set at 62.5% for having the convenience
|
// The base font-size is set at 62.5% for having the convenience
|
||||||
// of sizing rems in a way that is similar to using px: 1.6rem = 16px
|
// of sizing rems in a way that is similar to using px: 1.6rem = 16px
|
||||||
html
|
html
|
||||||
box-sizing: border-box
|
box-sizing: border-box
|
||||||
font-size: 62.5%
|
font-size: 62.5%
|
||||||
|
|
||||||
// Default body styles
|
// Default body styles
|
||||||
body
|
body
|
||||||
color: $color-secondary
|
color: $color-secondary
|
||||||
font-family: 'Roboto', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif
|
font-family: 'Roboto', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif
|
||||||
font-size: 1.6em // Currently ems cause chrome bug misinterpreting rems on body element
|
font-size: 1.6em // Currently ems cause chrome bug misinterpreting rems on body element
|
||||||
font-weight: 300
|
font-weight: 300
|
||||||
letter-spacing: .01em
|
letter-spacing: .01em
|
||||||
line-height: 1.6
|
line-height: 1.6
|
||||||
|
|
|
||||||
|
|
@ -3,10 +3,10 @@
|
||||||
// ––––––––––––––––––––––––––––––––––––––––––––––––––
|
// ––––––––––––––––––––––––––––––––––––––––––––––––––
|
||||||
|
|
||||||
blockquote
|
blockquote
|
||||||
border-left: .3rem solid $color-quaternary
|
border-left: .3rem solid $color-quaternary
|
||||||
margin-left: 0
|
margin-left: 0
|
||||||
margin-right: 0
|
margin-right: 0
|
||||||
padding: 1rem 1.5rem
|
padding: 1rem 1.5rem
|
||||||
|
|
||||||
*:last-child
|
*:last-child
|
||||||
margin-bottom: 0
|
margin-bottom: 0
|
||||||
|
|
|
||||||
110
src/_Button.sass
110
src/_Button.sass
|
|
@ -7,69 +7,69 @@ button,
|
||||||
input[type='button'],
|
input[type='button'],
|
||||||
input[type='reset'],
|
input[type='reset'],
|
||||||
input[type='submit']
|
input[type='submit']
|
||||||
background-color: $color-primary
|
background-color: $color-primary
|
||||||
border: .1rem solid $color-primary
|
border: .1rem solid $color-primary
|
||||||
border-radius: .4rem
|
border-radius: .4rem
|
||||||
color: $color-initial
|
color: $color-initial
|
||||||
cursor: pointer
|
cursor: pointer
|
||||||
display: inline-block
|
display: inline-block
|
||||||
font-size: 1.1rem
|
font-size: 1.1rem
|
||||||
font-weight: 700
|
font-weight: 700
|
||||||
height: 3.8rem
|
height: 3.8rem
|
||||||
letter-spacing: .1rem
|
letter-spacing: .1rem
|
||||||
line-height: 3.8rem
|
line-height: 3.8rem
|
||||||
padding: 0 3.0rem
|
padding: 0 3.0rem
|
||||||
text-align: center
|
text-align: center
|
||||||
text-decoration: none
|
text-decoration: none
|
||||||
text-transform: uppercase
|
text-transform: uppercase
|
||||||
white-space: nowrap
|
white-space: nowrap
|
||||||
|
|
||||||
&:focus,
|
&:focus,
|
||||||
&:hover
|
&:hover
|
||||||
background-color: $color-secondary
|
background-color: $color-secondary
|
||||||
border-color: $color-secondary
|
border-color: $color-secondary
|
||||||
color: $color-initial
|
color: $color-initial
|
||||||
outline: 0
|
outline: 0
|
||||||
|
|
||||||
&[disabled]
|
&[disabled]
|
||||||
cursor: default
|
cursor: default
|
||||||
opacity: .5
|
opacity: .5
|
||||||
|
|
||||||
&:focus,
|
&:focus,
|
||||||
&:hover
|
&:hover
|
||||||
background-color: $color-primary
|
background-color: $color-primary
|
||||||
border-color: $color-primary
|
border-color: $color-primary
|
||||||
|
|
||||||
&.button-outline
|
&.button-outline
|
||||||
background-color: transparent
|
background-color: transparent
|
||||||
color: $color-primary
|
color: $color-primary
|
||||||
|
|
||||||
&:focus,
|
&:focus,
|
||||||
&:hover
|
&:hover
|
||||||
background-color: transparent
|
background-color: transparent
|
||||||
border-color: $color-secondary
|
border-color: $color-secondary
|
||||||
color: $color-secondary
|
color: $color-secondary
|
||||||
|
|
||||||
&[disabled]
|
&[disabled]
|
||||||
|
|
||||||
&:focus,
|
&:focus,
|
||||||
&:hover
|
&:hover
|
||||||
border-color: inherit
|
border-color: inherit
|
||||||
color: $color-primary
|
color: $color-primary
|
||||||
|
|
||||||
&.button-clear
|
&.button-clear
|
||||||
background-color: transparent
|
background-color: transparent
|
||||||
border-color: transparent
|
border-color: transparent
|
||||||
color: $color-primary
|
color: $color-primary
|
||||||
|
|
||||||
&:focus,
|
&:focus,
|
||||||
&:hover
|
&:hover
|
||||||
background-color: transparent
|
background-color: transparent
|
||||||
border-color: transparent
|
border-color: transparent
|
||||||
color: $color-secondary
|
color: $color-secondary
|
||||||
|
|
||||||
&[disabled]
|
&[disabled]
|
||||||
|
|
||||||
&:focus,
|
&:focus,
|
||||||
&:hover
|
&:hover
|
||||||
color: $color-primary
|
color: $color-primary
|
||||||
|
|
|
||||||
|
|
@ -3,20 +3,20 @@
|
||||||
// ––––––––––––––––––––––––––––––––––––––––––––––––––
|
// ––––––––––––––––––––––––––––––––––––––––––––––––––
|
||||||
|
|
||||||
code
|
code
|
||||||
background: $color-tertiary
|
background: $color-tertiary
|
||||||
border-radius: .4rem
|
border-radius: .4rem
|
||||||
font-size: 86%
|
font-size: 86%
|
||||||
margin: 0 .2rem
|
margin: 0 .2rem
|
||||||
padding: .2rem .5rem
|
padding: .2rem .5rem
|
||||||
white-space: nowrap
|
white-space: nowrap
|
||||||
|
|
||||||
pre
|
pre
|
||||||
background: $color-tertiary
|
background: $color-tertiary
|
||||||
border-left: .3rem solid $color-primary
|
border-left: .3rem solid $color-primary
|
||||||
overflow-y: hidden
|
overflow-y: hidden
|
||||||
|
|
||||||
& > code
|
& > code
|
||||||
border-radius: 0
|
border-radius: 0
|
||||||
display: block
|
display: block
|
||||||
padding: 1rem 1.5rem
|
padding: 1rem 1.5rem
|
||||||
white-space: pre
|
white-space: pre
|
||||||
|
|
|
||||||
|
|
@ -3,6 +3,6 @@
|
||||||
// ––––––––––––––––––––––––––––––––––––––––––––––––––
|
// ––––––––––––––––––––––––––––––––––––––––––––––––––
|
||||||
|
|
||||||
hr
|
hr
|
||||||
border: 0
|
border: 0
|
||||||
border-top: .1rem solid $color-tertiary
|
border-top: .1rem solid $color-tertiary
|
||||||
margin: 3.0rem 0
|
margin: 3.0rem 0
|
||||||
|
|
|
||||||
|
|
@ -2,62 +2,62 @@
|
||||||
// Form
|
// Form
|
||||||
// ––––––––––––––––––––––––––––––––––––––––––––––––––
|
// ––––––––––––––––––––––––––––––––––––––––––––––––––
|
||||||
|
|
||||||
input[type=color],
|
input[type='color'],
|
||||||
input[type=date],
|
input[type='date'],
|
||||||
input[type=datetime],
|
input[type='datetime'],
|
||||||
input[type=datetime-local],
|
input[type='datetime-local'],
|
||||||
input[type=email],
|
input[type='email'],
|
||||||
input[type=month],
|
input[type='month'],
|
||||||
input[type=number],
|
input[type='number'],
|
||||||
input[type=password],
|
input[type='password'],
|
||||||
input[type=search],
|
input[type='search'],
|
||||||
input[type=tel],
|
input[type='tel'],
|
||||||
input[type=text],
|
input[type='text'],
|
||||||
input[type=url],
|
input[type='url'],
|
||||||
input[type=week],
|
input[type='week'],
|
||||||
input:not([type]),
|
input:not([type]),
|
||||||
textarea,
|
textarea,
|
||||||
select
|
select
|
||||||
appearance: none // Removes awkward default styles on some inputs for iOS
|
appearance: none // Removes awkward default styles on some inputs for iOS
|
||||||
background-color: transparent
|
background-color: transparent
|
||||||
border: .1rem solid $color-quaternary
|
border: .1rem solid $color-quaternary
|
||||||
border-radius: .4rem
|
border-radius: .4rem
|
||||||
box-shadow: none
|
box-shadow: none
|
||||||
box-sizing: inherit // Forced to replace inherit values of the normalize.css
|
box-sizing: inherit // Forced to replace inherit values of the normalize.css
|
||||||
height: 3.8rem
|
height: 3.8rem
|
||||||
padding: .6rem 1.0rem // The .6rem vertically centers text on FF, ignored by Webkit
|
padding: .6rem 1.0rem // The .6rem vertically centers text on FF, ignored by Webkit
|
||||||
width: 100%
|
width: 100%
|
||||||
|
|
||||||
&:focus
|
&:focus
|
||||||
border-color: $color-primary
|
border-color: $color-primary
|
||||||
outline: 0
|
outline: 0
|
||||||
|
|
||||||
select
|
select
|
||||||
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="14" viewBox="0 0 29 14" width="29"><path fill="%23d1d1d1" d="M9.37727 3.625l5.08154 6.93523L19.54036 3.625"/></svg>') center right no-repeat
|
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="14" viewBox="0 0 29 14" width="29"><path fill="%23d1d1d1" d="M9.37727 3.625l5.08154 6.93523L19.54036 3.625"/></svg>') center right no-repeat
|
||||||
padding-right: 3.0rem
|
padding-right: 3.0rem
|
||||||
|
|
||||||
&:focus
|
&:focus
|
||||||
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="14" viewBox="0 0 29 14" width="29"><path fill="%239b4dca" d="M9.37727 3.625l5.08154 6.93523L19.54036 3.625"/></svg>')
|
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" height="14" viewBox="0 0 29 14" width="29"><path fill="%239b4dca" d="M9.37727 3.625l5.08154 6.93523L19.54036 3.625"/></svg>')
|
||||||
|
|
||||||
textarea
|
textarea
|
||||||
min-height: 6.5rem
|
min-height: 6.5rem
|
||||||
|
|
||||||
label,
|
label,
|
||||||
legend
|
legend
|
||||||
display: block
|
display: block
|
||||||
font-size: 1.6rem
|
font-size: 1.6rem
|
||||||
font-weight: 700
|
font-weight: 700
|
||||||
margin-bottom: .5rem
|
margin-bottom: .5rem
|
||||||
|
|
||||||
fieldset
|
fieldset
|
||||||
border-width: 0
|
border-width: 0
|
||||||
padding: 0
|
padding: 0
|
||||||
|
|
||||||
input[type='checkbox'],
|
input[type='checkbox'],
|
||||||
input[type='radio']
|
input[type='radio']
|
||||||
display: inline
|
display: inline
|
||||||
|
|
||||||
.label-inline
|
.label-inline
|
||||||
display: inline-block
|
display: inline-block
|
||||||
font-weight: normal
|
font-weight: normal
|
||||||
margin-left: .5rem
|
margin-left: .5rem
|
||||||
|
|
|
||||||
216
src/_Grid.sass
216
src/_Grid.sass
|
|
@ -4,11 +4,11 @@
|
||||||
|
|
||||||
// .container is main centered wrapper with a max width of 112.0rem (1120px)
|
// .container is main centered wrapper with a max width of 112.0rem (1120px)
|
||||||
.container
|
.container
|
||||||
margin: 0 auto
|
margin: 0 auto
|
||||||
max-width: 112.0rem
|
max-width: 112.0rem
|
||||||
padding: 0 2.0rem
|
padding: 0 2.0rem
|
||||||
position: relative
|
position: relative
|
||||||
width: 100%
|
width: 100%
|
||||||
|
|
||||||
// Using flexbox for the grid, inspired by Philip Walton:
|
// Using flexbox for the grid, inspired by Philip Walton:
|
||||||
// http://philipwalton.github.io/solved-by-flexbox/demos/grids/
|
// http://philipwalton.github.io/solved-by-flexbox/demos/grids/
|
||||||
|
|
@ -16,143 +16,143 @@
|
||||||
// available width, and the height of each .column with take
|
// available width, and the height of each .column with take
|
||||||
// up the height of the tallest .column in the same .row
|
// up the height of the tallest .column in the same .row
|
||||||
.row
|
.row
|
||||||
display: flex
|
display: flex
|
||||||
flex-direction: column
|
flex-direction: column
|
||||||
padding: 0
|
padding: 0
|
||||||
width: 100%
|
width: 100%
|
||||||
|
|
||||||
&.row-no-padding
|
&.row-no-padding
|
||||||
padding: 0
|
padding: 0
|
||||||
|
|
||||||
&> .column
|
&> .column
|
||||||
padding: 0
|
padding: 0
|
||||||
|
|
||||||
&.row-wrap
|
&.row-wrap
|
||||||
flex-wrap: wrap
|
flex-wrap: wrap
|
||||||
|
|
||||||
// Vertically Align Columns
|
// Vertically Align Columns
|
||||||
// .row-* vertically aligns every .col in the .row
|
// .row-* vertically aligns every .col in the .row
|
||||||
&.row-top
|
&.row-top
|
||||||
align-items: flex-start
|
align-items: flex-start
|
||||||
|
|
||||||
&.row-bottom
|
&.row-bottom
|
||||||
align-items: flex-end
|
align-items: flex-end
|
||||||
|
|
||||||
&.row-center
|
&.row-center
|
||||||
align-items: center
|
align-items: center
|
||||||
|
|
||||||
&.row-stretch
|
&.row-stretch
|
||||||
align-items: stretch
|
align-items: stretch
|
||||||
|
|
||||||
&.row-baseline
|
&.row-baseline
|
||||||
align-items: baseline
|
align-items: baseline
|
||||||
|
|
||||||
.column
|
.column
|
||||||
display: block
|
display: block
|
||||||
// IE 11 required specifying the flex-basis otherwise it breaks mobile
|
// IE 11 required specifying the flex-basis otherwise it breaks mobile
|
||||||
flex: 1 1 auto
|
flex: 1 1 auto
|
||||||
margin-left: 0
|
margin-left: 0
|
||||||
max-width: 100%
|
max-width: 100%
|
||||||
width: 100%
|
width: 100%
|
||||||
|
|
||||||
// Column Offsets
|
// Column Offsets
|
||||||
&.column-offset-10
|
&.column-offset-10
|
||||||
margin-left: 10%
|
margin-left: 10%
|
||||||
|
|
||||||
&.column-offset-20
|
&.column-offset-20
|
||||||
margin-left: 20%
|
margin-left: 20%
|
||||||
|
|
||||||
&.column-offset-25
|
&.column-offset-25
|
||||||
margin-left: 25%
|
margin-left: 25%
|
||||||
|
|
||||||
&.column-offset-33,
|
&.column-offset-33,
|
||||||
&.column-offset-34
|
&.column-offset-34
|
||||||
margin-left: 33.3333%
|
margin-left: 33.3333%
|
||||||
|
|
||||||
&.column-offset-50
|
&.column-offset-50
|
||||||
margin-left: 50%
|
margin-left: 50%
|
||||||
|
|
||||||
&.column-offset-66,
|
&.column-offset-66,
|
||||||
&.column-offset-67
|
&.column-offset-67
|
||||||
margin-left: 66.6666%
|
margin-left: 66.6666%
|
||||||
|
|
||||||
&.column-offset-75
|
&.column-offset-75
|
||||||
margin-left: 75%
|
margin-left: 75%
|
||||||
|
|
||||||
&.column-offset-80
|
&.column-offset-80
|
||||||
margin-left: 80%
|
margin-left: 80%
|
||||||
|
|
||||||
&.column-offset-90
|
&.column-offset-90
|
||||||
margin-left: 90%
|
margin-left: 90%
|
||||||
|
|
||||||
// Explicit Column Percent Sizes
|
// Explicit Column Percent Sizes
|
||||||
// By default each grid column will evenly distribute
|
// By default each grid column will evenly distribute
|
||||||
// across the grid. However, you can specify individual
|
// across the grid. However, you can specify individual
|
||||||
// columns to take up a certain size of the available area
|
// columns to take up a certain size of the available area
|
||||||
&.column-10
|
&.column-10
|
||||||
flex: 0 0 10%
|
flex: 0 0 10%
|
||||||
max-width: 10%
|
max-width: 10%
|
||||||
|
|
||||||
&.column-20
|
&.column-20
|
||||||
flex: 0 0 20%
|
flex: 0 0 20%
|
||||||
max-width: 20%
|
max-width: 20%
|
||||||
|
|
||||||
&.column-25
|
&.column-25
|
||||||
flex: 0 0 25%
|
flex: 0 0 25%
|
||||||
max-width: 25%
|
max-width: 25%
|
||||||
|
|
||||||
&.column-33,
|
&.column-33,
|
||||||
&.column-34
|
&.column-34
|
||||||
flex: 0 0 33.3333%
|
flex: 0 0 33.3333%
|
||||||
max-width: 33.3333%
|
max-width: 33.3333%
|
||||||
|
|
||||||
&.column-40
|
&.column-40
|
||||||
flex: 0 0 40%
|
flex: 0 0 40%
|
||||||
max-width: 40%
|
max-width: 40%
|
||||||
|
|
||||||
&.column-50
|
&.column-50
|
||||||
flex: 0 0 50%
|
flex: 0 0 50%
|
||||||
max-width: 50%
|
max-width: 50%
|
||||||
|
|
||||||
&.column-60
|
&.column-60
|
||||||
flex: 0 0 60%
|
flex: 0 0 60%
|
||||||
max-width: 60%
|
max-width: 60%
|
||||||
|
|
||||||
&.column-66,
|
&.column-66,
|
||||||
&.column-67
|
&.column-67
|
||||||
flex: 0 0 66.6666%
|
flex: 0 0 66.6666%
|
||||||
max-width: 66.6666%
|
max-width: 66.6666%
|
||||||
|
|
||||||
&.column-75
|
&.column-75
|
||||||
flex: 0 0 75%
|
flex: 0 0 75%
|
||||||
max-width: 75%
|
max-width: 75%
|
||||||
|
|
||||||
&.column-80
|
&.column-80
|
||||||
flex: 0 0 80%
|
flex: 0 0 80%
|
||||||
max-width: 80%
|
max-width: 80%
|
||||||
|
|
||||||
&.column-90
|
&.column-90
|
||||||
flex: 0 0 90%
|
flex: 0 0 90%
|
||||||
max-width: 90%
|
max-width: 90%
|
||||||
|
|
||||||
// .column-* vertically aligns an individual .column
|
// .column-* vertically aligns an individual .column
|
||||||
.column-top
|
.column-top
|
||||||
align-self: flex-start
|
align-self: flex-start
|
||||||
|
|
||||||
.column-bottom
|
.column-bottom
|
||||||
align-self: flex-end
|
align-self: flex-end
|
||||||
|
|
||||||
.column-center
|
.column-center
|
||||||
align-self: center
|
align-self: center
|
||||||
|
|
||||||
// Larger than mobile screen
|
// Larger than mobile screen
|
||||||
@media (min-width: 40.0rem) // Safari desktop has a bug using `rem`, but Safari mobile works
|
@media (min-width: 40.0rem) // Safari desktop has a bug using `rem`, but Safari mobile works
|
||||||
|
|
||||||
.row
|
.row
|
||||||
flex-direction: row
|
flex-direction: row
|
||||||
margin-left: -1.0rem
|
margin-left: -1.0rem
|
||||||
width: calc(100% + 2.0rem)
|
width: calc(100% + 2.0rem)
|
||||||
|
|
||||||
.column
|
.column
|
||||||
margin-bottom: inherit
|
margin-bottom: inherit
|
||||||
padding: 0 1.0rem
|
padding: 0 1.0rem
|
||||||
|
|
|
||||||
|
|
@ -3,4 +3,4 @@
|
||||||
// ––––––––––––––––––––––––––––––––––––––––––––––––––
|
// ––––––––––––––––––––––––––––––––––––––––––––––––––
|
||||||
|
|
||||||
img
|
img
|
||||||
max-width: 100%
|
max-width: 100%
|
||||||
|
|
|
||||||
|
|
@ -3,9 +3,9 @@
|
||||||
// ––––––––––––––––––––––––––––––––––––––––––––––––––
|
// ––––––––––––––––––––––––––––––––––––––––––––––––––
|
||||||
|
|
||||||
a
|
a
|
||||||
color: $color-primary
|
color: $color-primary
|
||||||
text-decoration: none
|
text-decoration: none
|
||||||
|
|
||||||
&:focus,
|
&:focus,
|
||||||
&:hover
|
&:hover
|
||||||
color: $color-secondary
|
color: $color-secondary
|
||||||
|
|
|
||||||
|
|
@ -5,18 +5,18 @@
|
||||||
dl,
|
dl,
|
||||||
ol,
|
ol,
|
||||||
ul
|
ul
|
||||||
list-style: none
|
list-style: none
|
||||||
margin-top: 0
|
margin-top: 0
|
||||||
padding-left: 0
|
padding-left: 0
|
||||||
|
|
||||||
dl,
|
dl,
|
||||||
ol,
|
ol,
|
||||||
ul
|
ul
|
||||||
font-size: 90%
|
font-size: 90%
|
||||||
margin: 1.5rem 0 1.5rem 3.0rem
|
margin: 1.5rem 0 1.5rem 3.0rem
|
||||||
|
|
||||||
ol
|
ol
|
||||||
list-style: decimal inside
|
list-style: decimal inside
|
||||||
|
|
||||||
ul
|
ul
|
||||||
list-style: circle inside
|
list-style: circle inside
|
||||||
|
|
|
||||||
|
|
@ -7,13 +7,13 @@ button,
|
||||||
dd,
|
dd,
|
||||||
dt,
|
dt,
|
||||||
li
|
li
|
||||||
margin-bottom: 1.0rem
|
margin-bottom: 1.0rem
|
||||||
|
|
||||||
fieldset,
|
fieldset,
|
||||||
input,
|
input,
|
||||||
select,
|
select,
|
||||||
textarea
|
textarea
|
||||||
margin-bottom: 1.5rem
|
margin-bottom: 1.5rem
|
||||||
|
|
||||||
blockquote,
|
blockquote,
|
||||||
dl,
|
dl,
|
||||||
|
|
@ -24,4 +24,4 @@ p,
|
||||||
pre,
|
pre,
|
||||||
table,
|
table,
|
||||||
ul
|
ul
|
||||||
margin-bottom: 2.5rem
|
margin-bottom: 2.5rem
|
||||||
|
|
|
||||||
|
|
@ -3,17 +3,17 @@
|
||||||
// ––––––––––––––––––––––––––––––––––––––––––––––––––
|
// ––––––––––––––––––––––––––––––––––––––––––––––––––
|
||||||
|
|
||||||
table
|
table
|
||||||
border-spacing: 0
|
border-spacing: 0
|
||||||
width: 100%
|
width: 100%
|
||||||
|
|
||||||
td,
|
td,
|
||||||
th
|
th
|
||||||
border-bottom: .1rem solid $color-quinary
|
border-bottom: .1rem solid $color-quinary
|
||||||
padding: 1.2rem 1.5rem
|
padding: 1.2rem 1.5rem
|
||||||
text-align: left
|
text-align: left
|
||||||
|
|
||||||
&:first-child
|
&:first-child
|
||||||
padding-left: 0
|
padding-left: 0
|
||||||
|
|
||||||
&:last-child
|
&:last-child
|
||||||
padding-right: 0
|
padding-right: 0
|
||||||
|
|
|
||||||
|
|
@ -4,10 +4,10 @@
|
||||||
|
|
||||||
b,
|
b,
|
||||||
strong
|
strong
|
||||||
font-weight: bold
|
font-weight: bold
|
||||||
|
|
||||||
p
|
p
|
||||||
margin-top: 0
|
margin-top: 0
|
||||||
|
|
||||||
h1,
|
h1,
|
||||||
h2,
|
h2,
|
||||||
|
|
@ -15,34 +15,34 @@ h3,
|
||||||
h4,
|
h4,
|
||||||
h5,
|
h5,
|
||||||
h6
|
h6
|
||||||
font-weight: 300
|
font-weight: 300
|
||||||
letter-spacing: -.1rem
|
letter-spacing: -.1rem
|
||||||
margin-bottom: 2.0rem
|
margin-bottom: 2.0rem
|
||||||
margin-top: 0
|
margin-top: 0
|
||||||
|
|
||||||
h1
|
h1
|
||||||
font-size: 4.6rem
|
font-size: 4.6rem
|
||||||
line-height: 1.2
|
line-height: 1.2
|
||||||
|
|
||||||
h2
|
h2
|
||||||
font-size: 3.6rem
|
font-size: 3.6rem
|
||||||
line-height: 1.25
|
line-height: 1.25
|
||||||
|
|
||||||
h3
|
h3
|
||||||
font-size: 2.8rem
|
font-size: 2.8rem
|
||||||
line-height: 1.3
|
line-height: 1.3
|
||||||
|
|
||||||
h4
|
h4
|
||||||
font-size: 2.2rem
|
font-size: 2.2rem
|
||||||
letter-spacing: -.08rem
|
letter-spacing: -.08rem
|
||||||
line-height: 1.35
|
line-height: 1.35
|
||||||
|
|
||||||
h5
|
h5
|
||||||
font-size: 1.8rem
|
font-size: 1.8rem
|
||||||
letter-spacing: -.05rem
|
letter-spacing: -.05rem
|
||||||
line-height: 1.5
|
line-height: 1.5
|
||||||
|
|
||||||
h6
|
h6
|
||||||
font-size: 1.6rem
|
font-size: 1.6rem
|
||||||
letter-spacing: 0
|
letter-spacing: 0
|
||||||
line-height: 1.4
|
line-height: 1.4
|
||||||
|
|
|
||||||
|
|
@ -5,14 +5,14 @@
|
||||||
// Clear a float with .clearfix
|
// Clear a float with .clearfix
|
||||||
.clearfix
|
.clearfix
|
||||||
|
|
||||||
&:after
|
&:after
|
||||||
clear: both
|
clear: both
|
||||||
content: ' ' // The space content is one way to avoid an Opera bug.
|
content: ' ' // The space content is one way to avoid an Opera bug.
|
||||||
display: table
|
display: table
|
||||||
|
|
||||||
// Float either direction
|
// Float either direction
|
||||||
.float-left
|
.float-left
|
||||||
float: left
|
float: left
|
||||||
|
|
||||||
.float-right
|
.float-right
|
||||||
float: right
|
float: right
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue