日経Linux ソースコード

application.haml

!!! Strict
%html
  %head
    %title= [@title, "Ruby2.0 blog"].compact.join(" | ")
    = stylesheet_link_tag 'reset', 'application'
    = javascript_include_tag 'jquery', 'application'
    = yield_content :include
  %body
    #header
      %h1 Sample Padrino Blog
      %ul.menu
        %li= link_to 'Blog', url_for(:posts, :index)
    #container
      #main= yield
    

application.sass

body
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif
  font-size: 14px
  background-color: #E6E0D9
  a
    color: #336699
  h2
    padding-bottom: 12px
    font-weight: bold
  h3
    padding-bottom: 10px
  pre
    display: block
    background-color: #F8F8FF
    border: 1px solid #DEDEDE
    color: #444444
    line-height: 1.5em
    margin-bottom: 10px
    padding: 0.5em
  ul.bulleted
    margin-left: 20px
    margin-bottom: 10px
    li
      list-style-type: square
      span
        font-weight: bold

#container
  width: 80%
  margin: 20px auto
  overflow: hidden

#header
  background-color: #900209
  padding: 30px 10px 20px 10px
  border-bottom: 2px solid #EC9A94
  overflow: hidden
  h1
    float: left
    color: #ECEBC3
    font-size: 2.3em
    font-weight: bold
  ul.menu
    margin-left: 80px
    margin-top: 10px
    float: left
    overflow: hidden
    li
      float: left
      margin-right: 20px
      padding-bottom: 5px
      a
        font-size: 1.2em
        color: #DFF6FC
        text-decoration: none
        &:hover
          text-decoration: underline


#main
  float: left
  width: 600px
  padding-top: 20px
  h2
    font-size: 2.1em
  .post
    margin-bottom: 20px
    p
      padding-bottom: 10px
    .title
      font-family: "Georgia,Times New Roman,serif"
      font-size: 2em
      color: #752A26
      a
        color: #752A26
        text-decoration: none
        &:hover
          text-decoration: underline
    .date
      font-size: 1.1em
      color: #999999
      display: block
      margin-bottom: 15px
      margin-top: 2px
    .body
      padding-bottom: 10px
    .details
      border-top: 1px solid #CCCCCC
      margin-bottom: 0.25em
      padding: 5px 0
      overflow: hidden
      .author
        float: left
        padding-right: 5px
        border-right: 1px solid #CCCCCC
  #show
    .author
      border-right: none

#sidebar
  padding: 20px
  margin-left: 20px
  float: left
  height: 650px
  width: 320px
  border: 1px dotted black
  p
    font-weight: bold
    padding-top: 10px
    padding-bottom: 12px


#about
  h2
    font-family: "Georgia,Times New Roman,serif"
    font-size: 2em
    color: #752A26
  h3
    font-family: "Georgia,Times New Roman,serif"
    font-size: 1.5em
    color: #752A26
    padding-bottom: 6px

  p
    padding-bottom: 12px


#footer
  padding: 30px 10px 10px 10px