www.moparisthebest.com/stylesheets/_layout.sass

106 lines
2.3 KiB
Sass
Raw Normal View History

!page_width = 900px
!sidebar_width = 250px
!sidebar_margin = 30px
!pad = 15px
!default_border_radius = 4px
html body
background-color= !body_bg
color= !body_color
a
color= !link_color
#header
background-color= !header_bg
border-bottom= "1px solid" !header_border
padding: 30px 0
.page_width
position: relative
a.title
font-size= !h1
+heading-font
display: inline-block
color= !title_color
text-decoration: none
#nav
+clearfix
position: relative
z-index: 1
padding: 6px 0
background:
color= !nav_bg
image: -webkit-gradient(linear, left top, left bottom, from(#fcfcfc), to(#ddd), color-stop(0.3, #f4f4f4))
image: -moz-linear-gradient(left top, left bottom, from(#fcfcfc), to(#ddd), color-stop(0.3, #f4f4f4))
border:
top= "1px solid" !nav_border_top
bottom= "1px solid" !nav_border_bottom
ul
position: relative
+horizontal-list
margin: 0 auto
overflow: visible
li
padding: 0 15px
border-left= "1px solid" !nav_border_left
border-right= "1px solid" !nav_border_right
&.alpha
border-left: none
padding-left: 0
&.omega
border-right: 0
&.subscribe
position: absolute
left= !page_width - !sidebar_width - !sidebar_margin/2
border: none
a
display: inline-block
padding-left: 28px
background: url("/images/rss.png") left top no-repeat
a
display: inline-block
color= !nav_color
line-height: 150%
text-decoration: none
&:hover
color= !nav_color_hover
.page_width
width= !page_width
margin: 0 auto
padding:
left: 30px
right: 30px
#page
+clearfix
background-color= !page_bg
.page_width
+clearfix
padding:
top: 25px
bottom: 25px
background-color= !blog_bg
+easy-box-shadow(#ccc)
border:
left= "1px solid" !page_border_sides
right= "1px solid" !page_border_sides
#main
width= !page_width - !sidebar_width - !sidebar_margin
#main
float: left
#footer
position: relative
z-index: 2
font-size= !base_font_size_small
clear: both
padding= !base_font_size * 1.5 0
color= !footer_color
+h-linear-gradient(darken(!body_bg, 25), !body_bg)
border-top= "14px solid" !footer_bg
a
color= #ddd
&:hover
color = #fff