93 lines
1.5 KiB
Stylus
93 lines
1.5 KiB
Stylus
|
/*
|
||
|
* Import nib
|
||
|
*/
|
||
|
@import 'nib'
|
||
|
|
||
|
/*
|
||
|
* Grab a custom font from Google
|
||
|
*/
|
||
|
@import url('http://fonts.googleapis.com/css?family=Quicksand')
|
||
|
|
||
|
/*
|
||
|
* Nib provides a CSS reset
|
||
|
*/
|
||
|
global-reset()
|
||
|
|
||
|
/*
|
||
|
* Store the main color and
|
||
|
* background color as variables
|
||
|
*/
|
||
|
main-color = #fa5b4d
|
||
|
background-color = #faf9f0
|
||
|
|
||
|
body
|
||
|
font-family 'Georgia'
|
||
|
background-color background-color
|
||
|
color #444
|
||
|
|
||
|
header
|
||
|
font-family 'Quicksand'
|
||
|
padding 50px 10px
|
||
|
color #fff
|
||
|
font-size 25px
|
||
|
text-align center
|
||
|
|
||
|
/*
|
||
|
* Note the use of the `main-color`
|
||
|
* variable and the `darken` function
|
||
|
*/
|
||
|
background-color main-color
|
||
|
border-bottom 1px solid darken(main-color, 30%)
|
||
|
text-shadow 0px -1px 0px darken(main-color, 30%)
|
||
|
|
||
|
.container
|
||
|
width 500px
|
||
|
margin 50px auto
|
||
|
overflow hidden
|
||
|
|
||
|
.main-content
|
||
|
float left
|
||
|
width 300px
|
||
|
|
||
|
p
|
||
|
margin-bottom 20px
|
||
|
|
||
|
.sidebar
|
||
|
float left
|
||
|
width 200px
|
||
|
|
||
|
.widget
|
||
|
|
||
|
/*
|
||
|
* Note the lack of vendor
|
||
|
* prefixes here. Nib will
|
||
|
* add them for us
|
||
|
*/
|
||
|
border-radius 3px
|
||
|
border 1px solid #ccc
|
||
|
margin-left 20px
|
||
|
background-color background-color
|
||
|
box-shadow inset 0px 0px 0px 3px rgba(#fff, 0.8), 0px 3px 0px -2px rgba(#000, 0.1)
|
||
|
|
||
|
h1
|
||
|
font-family 'Quicksand'
|
||
|
margin 13px 10px 4px
|
||
|
padding-bottom 10px
|
||
|
border-bottom 1px dotted #ddd
|
||
|
border-radius 2px 2px 0px 0px
|
||
|
margin-bottom 10px
|
||
|
|
||
|
p
|
||
|
font-size 13px
|
||
|
padding 0px 10px
|
||
|
margin-bottom 10px
|
||
|
|
||
|
p
|
||
|
line-height 1.8
|
||
|
|
||
|
footer
|
||
|
width 500px
|
||
|
margin 50px auto
|
||
|
border-top 1px dotted #ccc
|
||
|
padding-top 5px
|
||
|
font-size 13px
|