Mic92/blog
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

improved layout styling, added about page, added archive page link to footer

Browse Source
This commit is contained in:
B Mathis 2009-10-21 11:39:53 -05:00
parent f17271f6e2
commit 77bb406a93
6 changed files with 103 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
source/_layouts/default.haml
View File

@ -17,10 +17,14 @@ root_url:
#header
.page_width
%a.title(href="/")=page.blog_title
%ul#header_nav.nav
#nav
.page_width
%ul
%li.alpha
%a(href="#{page.root_url}/archives") Archives
%a(href="#{page.root_url}/") Blog
%li.omega
%a(href="#{page.root_url}/about") About
%li.subscribe
%a(href="#{page.root_url}/atom.xml") Subscribe
#page
.page_width
@ -35,4 +39,4 @@ root_url:
#footer
.page_width
= "Copyright © #{Time.now.strftime('%Y')} - #{page.blog_title} | "
%span.credit Powered by <a href="http://github.com/henrik/jekyll">Jekyll</a> & <a href="http://github.com/imathis/octopress/">Octopress</a>
%span.credit Powered by <a href="http://github.com/imathis/octopress/">Octopress</a>

12
source/about.haml Normal file
View File

@ -0,0 +1,12 @@
---
layout: default
title: About Me
---
:markdown
# About Me
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum.
Ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt.
Dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent.

BIN
source/images/rss.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.7 KiB

5
source/index.haml
View File

@ -4,5 +4,8 @@ title: Blog
---
.blog
- site.posts.sort_by(&:date).reverse[0..9].each_with_index do |post,index|
.article
%h2= link_to(post.title, post.url, {:class=>"title"})
.article= post.content
= post.content
.footer
%a(href="/archives.html" title="archives") &laquo; Blog Archives

93
source/stylesheets/partials/main/_layout.sass
View File

@ -1,4 +1,5 @@
!page_width = 560px
!sidebar_width = 0
!pad = 15px
!default_border_radius = 4px
@ -8,23 +9,63 @@ html body
a
color= !link_color
#footer a
color= #ddd
&:hover
color = #fff
#header
background-color= !header_bg
border-bottom= "1px solid" !header_border
padding: 20px 0
padding: 30px 0
a.title
font-size= !h3
font-size= !h1
+heading-font
display: inline-block
color= !header_nav
color= !title_color
text-decoration: none
#header_nav
float: right
#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 #d3d3d3
border-right: 1px solid #f4f4f4
&.alpha
border-left: none
padding-left: 0
&.omega
border-right: 0
&.subscribe
position: absolute
right: 0
//left= !page_width - 25px
border: none
a
color: #ccc
li.alpha a
color: #f2f2f2
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
@ -35,31 +76,27 @@ html body
#page
background-color= !page_bg
border-top= "1px solid" !page_border
padding: 25px 0
.page_width
background-color= !page_bg
padding:
top: 25px
bottom: 25px
background-color= !content_bg
+box-shadow(#ccc)
.article
padding= !base_font_size * 1.5 0 !base_font_size * 1.5
border-bottom= "1px solid" !article_border
&:first-child
padding-top: 0
.blog .footer
padding-top= !base_font_size
#subnav
+clearfix
margin: -25px 0 25px
padding: 10px 0
background-color= !subnav_bg
border-bottom= "1px solid" !subnav_border
font-size: 85%
#account
float: right
a
color= !subnav_logout_color
display: inline-block
padding-left: 10px
margin-left: 8px
border-left= "1px solid" #aaa
#footer
position: relative
z-index: 2
font-size= !base_font_size_small
clear: both
padding: 15px 0
padding= !base_font_size * 1.5 0
color= !footer_color
+h-linear-gradient(darken(!body_bg, 25), !body_bg)
border-top= "4px solid" !footer_bg
border-top= "14px solid" !footer_bg

21
source/stylesheets/partials/main/_theme.sass
View File

@ -1,19 +1,24 @@
// Main Section Colors
!body_color = #333
!body_bg = #323232
!test = darken(!body_bg, 20)
!header_bg = #323232
!header_border = #181818
!header_nav = #ddd
!header_nav_hover = #fff
!title_color = #ddd
!nav_color = #555
!nav_color_hover = #000
!nav_bg = #e8e8e8
!nav_border_top = #fff
!nav_border_bottom = #aaa
!page_border = #fff
!page_bg = #ececec
!page_bg = #f0f0f0
!article_border = #eee
!content_bg = #fff
!footer_color = #999
!footer_bg = #444
!subnav_bg = #fff
!subnav_border = #ccc
!subnav_link_color = #333
!subnav_logout_color = #777
// Link Colors
!link_color = #165B94