application.css.sass in bhf-0.4.8

- old
+ new

@@ -43,10 +43,11 @@
     padding-top: 25px
     li
       float: left
       font-weight: bold
       margin-right: 20px
+      margin-bottom: 10px
       &.active
         a
           +text-shadow(#fff, -1)
           +bg-gradient(#D5D5D5, #FFFFFF)
           +box-shadow(0, 1, 4)
@@ -741,52 +742,35 @@
   .time
     position: relative
     width: 100%
     height: 100%
     .hour, .separator, .minutes
-      color: #535B6F
-      background: #fff
-      width: 50px
-      font-size: 32px
       position: absolute
-      top: 10px
-      text-align: center
-      padding: 2px
     .hour,
     .minutes
-      +box-shadow(0, 0, 1, #2F4D7B)
-      +text-shadow(#ccc)
-      margin-top: 8px
-      border: none
       left: 15px
+      font-size: 26px
+      height: 48px
+      width: 40px
+      font-weight: bold
+      color: $g3
+      text-align: center
+      @extend .default_input
     .separator
-      background: transparent
-      border: 0px
       width: 10px
+      font-size: 34px
       left: 76px
     .minutes
       left: 95px
     .ok
-      +box-shadow(0, 0, 1, #2F4D7B)
-      +text-shadow(#ccc)
-      color: #535B6F
-      background: #fff
       position: absolute
-      border: none
       cursor: pointer
-      top: 73px
+      top: 46px
       left: 15px
       width: 134px
-      padding: 4px 0
-      font-size: 16px
-      &:hover,
-      &:focus,
-      &:active
-        background-color: #2F4D7B
-        color: #fff
-        +text-shadow(#000)
-        +box-shadow(0, 0, 1, #fff)
+      @extend .alt_button
+      font-size: 20px !important
   .days
     .day
       float: left
       text-align: center
       overflow: hidden
@@ -802,14 +786,16 @@
       &:hover
         +box-shadow(0, 0, 1, #2F4D7B)
         background-color: #fff
         color: #2F4D7B
         +text-shadow(#ccc)
+        +border-radius(2)
         
     .otherMonth
       color: #aaa
     .selected
+      +border-radius(2)
       background-color: #2F4D7B
       color: #fff
       +text-shadow(#000)
       +box-shadow(0, 0, 1, #fff)
   .months
@@ -894,33 +880,26 @@
     top: -4px
     
     
     
   
-#wmd-button-bar 
-  width: 100%
-  background: $w1
-  padding: 0 10px 4px 0
-  margin: 0 -6px 4px -6px
-  @extend .default_input
-#wmd-input 
-  height: 400px
-  width: 100%
+  
 
-#wmd-preview,
-#wmd-output 
+.wmd-preview,
+.wmd-output 
   @extend .default_input
+  width: 500px
   margin: 0 -6px 0 -6px
   background-color: #F5F5F5
-  padding: 3px 5px
+  padding: 3px 5px 2px 5px
   margin-bottom: 10px
   line-height: 22px
 
 .wmd-panel
   width: 700px !important
 
-#wmd-preview
+.wmd-preview
   img
     display: block
   ul,
   ol
     padding-left: 30px
@@ -933,34 +912,37 @@
     text-decoration: underline
     color: $b2
     font-weight: bold
     
 .preview_switch
+  padding-right: 6px
   span
     float: right
     margin-left: 10px
     cursor: pointer
     &.active
       color: $b2
 
-#wmd-output 
+.wmd-output 
   font-size: 12px
   line-height: 16px
   background: $g3
   color: $w2
   code
     font-family: Monaco,Consolas,"Andale Mono WT","Andale Mono","Lucida Console","Courier New",Courier,monospace
     white-space: pre-wrap
 
-#wmd-button-row 
-  position: relative 
-  margin-left: 5px
-  margin-right: 5px
+.wmd-button-row 
+  width: 500px
+  background: $w1
+  padding: 6px 5px 1px 5px
+  @extend .default_input
+  margin-left: -6px
   margin-bottom: 5px
-  margin-top: 10px
-  padding: 0px  
-  height: 20px
+.wmd-input 
+  height: 400px
+  width: 100%
 
 
 .wmd-spacer
   width: 1px 
   height: 20px 
@@ -973,70 +955,57 @@
 .wmd-button
   width: 20px 
   height: 20px 
   margin-left: 5px
   margin-right: 5px
-  position: absolute
+  position: relative
   background-image: url(wmd-buttons.png)
   background-repeat: no-repeat
-  background-position: 0px 0px
-  display: inline-block 
+  display: inline-block
   list-style: none
-  > a
-    width: 20px 
-    height: 20px 
-    margin-left: 5px
-    margin-right: 5px
-    position: absolute
-    display: inline-block 
+  border: 1px solid transparent
+  &:hover
+    border-color: $g2
 
+
+.wmd-spacer
+  width: 1px
+  height: 20px
+  margin-left: 7px
+  margin-right: 7px
+  position: relative
+  background-color: $g2
+  display: inline-block
+  list-style: none
+
 // TODO: style this properly
 
-#wmd-button-bar
-  #wmd-bold-button
-    left: 0px
-    background-position: 0px 0
-  #wmd-italic-button
-    left: 25px
+.wmd-button-row
+  .wmd-bold-button
+    background-position: 0px 0px
+  .wmd-italic-button
     background-position: -20px 0
-  #wmd-spacer1
-    left: 50px
-  #wmd-link-button
-    left: 75px
+  .wmd-link-button
     background-position: -40px 0
-  #wmd-quote-button
-    left: 100px
+  .wmd-quote-button
     background-position: -60px 0
-  #wmd-code-button
-    left: 125px
+  .wmd-code-button
     background-position: -80px 0
-  #wmd-image-button
-    left: 150px
+  .wmd-image-button
     background-position: -100px 0
-  #wmd-spacer2
-    left: 175px
-  #wmd-olist-button
-    left: 200px
+  .wmd-olist-button
     background-position: -120px 0
-  #wmd-ulist-button
-    left: 225px
+  .wmd-ulist-button
     background-position: -140px 0
-  #wmd-heading-button
-    left: 250px
+  .wmd-heading-button
     background-position: -160px 0
-  #wmd-hr-button
-    left: 275px
+  .wmd-hr-button
     background-position: -180px 0
-  #wmd-spacer3
-    left: 300px
-  #wmd-undo-button
-    left: 325px
+  .wmd-undo-button
     background-position: -200px 0
-  #wmd-redo-button
-    left: 350px
+  .wmd-redo-button
     background-position: -220px 0
-  #wmd-help-button
-    right: 0px
+  .wmd-help-button
     background-position: -240px 0
 
 .wmd-prompt-background
   background-color: #000
 
\ No newline at end of file