added compass yui fonts; fixed font-size, line-height throughout the …

…site

app/stylesheets/partials/_account.sass

@@ -1,44 +1,55 @@
 ul#accepted_cards
   +horizontal-list
   li
-    :width 31px
-    :height 25px
-    :text-indent -9999px
-    :margin-right 5px
-    &.visa
-      :background transparent url(../../images/accepted_card_types.png) no-repeat 0 0
+    width: 39px
+    height: 25px
+    text-indent: -9999px
+    margin-right: 5px
+    padding: 0
+    background: transparent url(../../images/accepted_card_types.png) no-repeat 0 0
     &.mastercard                                                 
-      :background transparent url(../../images/accepted_card_types.png) no-repeat -39px 0
+      background-position: -39px 0
     &.amex                                                       
-      :background transparent url(../../images/accepted_card_types.png) no-repeat -78px 0
+      background-position: -78px 0
     &.discover                                                   
-      :background transparent url(../../images/accepted_card_types.png) no-repeat -117px 0
+      background-position: -117px 0
     &.jcb                                                        
-      :background transparent url(../../images/accepted_card_types.png) no-repeat -156px 0
+      background-position: -156px 0
     &.dinners                                                    
-      :background transparent url(../../images/accepted_card_types.png) no-repeat -195px 0
+      background-position: -195px 0
 
 #errorExplanation
-  :margin-bottom 10px
+  margin-bottom: 10px
   ul
     +no-bullets
     li
-      :padding-left 10px
-      :color #8A1F11
+      padding-left: 10px
+      color: #8A1F11
 
-.card-info, #plan-info, .transactions-info
+#card-info, #card-form
+  +column(12, true)
+
+#plan-info
+  +column(12)
+
+#transactions-info
+  +column(24, true)
+  margin-top: 10px
+  border-top: 1px solid #ddd
+
+#card-info, #plan-info, #transactions-info
+  h3
+    :padding-left 5px
+    +strong
+    +font-size(14px)
   table
     th, td
       :padding 3px 5px
     th
       :font-weight bold
-
-.transactions-info
+      +right
+
+#transactions-info
   table
-    td
-      :border-top 1px solid #ddd
-  h3
-    :padding-left 5px
-    :font
-      :size 14px
-      :weight bold
+    th
+      +left

app/stylesheets/partials/_brands.sass

@@ -1,36 +1,30 @@
 div
   &.brands
     h3
-      font-size: 14px
+      +font-size(14px)
       padding: 0px
-
     div
       &.brand
-        padding: 5px 10px
-        padding-left: 5px
+        padding: 5px 10px 5px 7px
         border-bottom: solid 1px rgb(230,230,230)
-
       &.odd
         background: rgb(245,245,245)
-
       &.actions
-        font-size: 11px
+        +font-size(11px)
         float: right
-
         a
           color: rgb(180,180,180)
-
           &:hover
             color: rgb(255,255,255)
-
           &.delete:hover
             background: rgb(255,0,0)
+
   &.box
     :margin-bottom 10px
     :padding 10px
     +clearfix
     h3
-      font-size: 15px
+      +font-size(15px)
       margin: 0
       padding: 0 0 10px 0
     .left

app/stylesheets/partials/_comments.sass

@@ -1,13 +1,13 @@
 .comments
   .comment
     +clearfix
-    :border-bottom 1px dotted #ccc
-    :padding-bottom 5px
-    :margin-bottom 5px
+    border-bottom: 1px dotted #ccc
+    padding-bottom: 5px
+    margin-bottom: 5px
     img
-      :float left
-      :margin 0 10px 5px 0
+      float: left
+      margin: 0 10px 5px 0
     p
-      :margin-bottom 5px
+      margin-bottom: 5px
   form.comment
-    :border-bottom none
+    border-bottom: none

app/stylesheets/partials/_dashboard.sass

@@ -1,45 +1,42 @@
 .dashboard
+  .content
+    +column(16)
+  .sidebar
+    +column(8, true)
+    border-left: 1px solid #ccc
+    padding: 0 0 0 9px
   .results
-    :margin-bottom 40px
+    margin-bottom: 40px
     a.view_all
-      :font-size 11px
-  .results, .comments
-    h2
-      :margin-bottom 5px
-  .logs
-    :border-left 1px solid #ccc
-    :padding-left 9px
+      +font-size(11px)
 
-div
-  &.updates
+  .updates
     h3
       border-bottom: solid 1px rgb(170,184,190)
-      font-weight: normal
-      font-size: 11px
-      padding: 4px 0px
-      padding-bottom: 3px
+      +font-size(11px)
+      padding: 4px 0px 3px 0
       margin: 10px 0px 5px 0
-
       span
         background: rgb(230,230,230)
-        padding: 4px 10px
-        padding-bottom: 3px
+        padding: 4px 10px 3px 10px
   .log
-    :border-bottom 1px dotted #ccc
-    :padding-bottom 5px
-    :margin-bottom 10px
+    border-bottom: 1px dotted #ccc
+    padding-bottom: 5px
+    margin-bottom: 10px
     +clearfix
     span
-      :display block
-      :float left
-      :font-size 11px
+      display: block
+      float: left
+      +font-size(11px)
       &.status
         .tag
-          :width 65px
-          :text-align right
-          :margin-right 10px
-      &.description
-        :clear both
-        :font-size 12px
+          +right
+          width: 65px
+          margin-right: 10px
+          +font-size(11px, 11px)
+          padding: 3px 5px 3px 0px
       &.time
-        :padding 2px 0
+        padding: 4px 0
+      &.description
+        clear: both
+        margin-top: 3px

app/stylesheets/partials/_flash.sass

@@ -6,9 +6,8 @@
   :border
     :style solid none
     :width 2px
-  :font
-    :weight bold
-    :size 14px
+  +strong
+  +font-size(14px)
   &#error
     :background #C00 url(../../images/exclamation.png) no-repeat scroll 6px 50%
     :border-color #C99

app/stylesheets/partials/_footer.sass

@@ -5,13 +5,13 @@ div.footer
 
   p
     position: relative
-    font-size: 12px
+    +font-size(12px)
     color: rgb(60,60,60)
     margin: 0px
     padding: 0px
-    text-align: center
+    +center
   a
-    font-size: 12px
+    +font-size(12px)
     color: rgb(60,60,60)
 
     &:hover

app/stylesheets/partials/_general.sass

@@ -1,19 +1,4 @@
-!general_font_color = #000000
-!general_link_color = #0000FF
-
-!follow_up_color = #C87800
-!done_color = #0000FF
-!rejected_color = #FF0000
-!comment_color = #6492AC
-!negative_color = #FF0000
-!positive_color = #009966
-!neutral_color = #333333
-
-= general_font(!size=13px)
-  :font
-    :size= !size
-    :weight normal
-    :family Arial, Tahoma, Verdana, sans-serif
++yui-base-fonts
 
 html
   margin: 0px
@@ -24,7 +9,6 @@ body
   padding: 0px
   background: rgb(146,146,146)
   :color = !general_font_color
-  +general_font
 
 h1, h2, h3, h4
   font-family: 'Lucida Grande', Verdana, Arial, sans-serif
@@ -46,9 +30,8 @@ h3
   margin: 0px
 
 p
-  +general_font
   margin: 0px
-  line-height: 1.4em
+  +font-size(13px)
 
 a
   :color = !general_link_color
@@ -102,24 +85,21 @@ div
             background: rgb(0,0,255)
             text-decoration: none
   &.main-content
-    font-size: 14px
     padding: 10px
     clear: both
     +clearfix
     :min-height 500px
 
   &.content
-    &.results
-      float: right
-      width: 760px
     &.account
       h3
 
 
   &.buttons
     padding: 10px
     +clearfix
-
+    a
+      outline: none
     .add
       display: block
       float: right

app/stylesheets/partials/_header.sass

@@ -11,7 +11,7 @@ div
       :padding 0px
       h1
         display: block
-        font-size: 17px
+        +font-size(17px)
         font-weight: normal
         :color #FFFFFF
         :float left
@@ -70,7 +70,7 @@ div
     a
       display: block
       float: left
-      font-size: 12px
+      +font-size(12px)
       background: url(../../images/navigation_a_bg.jpg) no-repeat left top
       color: rgb(255,255,255)
       text-decoration: none

app/stylesheets/partials/_login.sass

@@ -2,6 +2,9 @@ div
   &.login
     .main-content
       :min-height 100px
+    .content
+      p
+        margin-bottom: 20px
     .header .top, .content_wrap, .footer, .navigation
       :width 700px
     .header

app/stylesheets/partials/_pagination.sass

@@ -1,9 +1,9 @@
 .pagination
-  text-align: right
+  +right
   padding: 5px
 
   a, span
-    font-size: 12px
+    +font-size(12px)
     padding: 2px 3px
 
     &.active