Browse code

improved typography and added blog styles for metadata

B Mathis authored on 10/03/2010 at 18:25:35
Showing 3 changed files
... ...
@@ -17,6 +17,8 @@ h1,h2,h3,h4,h5,h6
17 17
   color: #333
18 18
   font-weight: bold
19 19
   +heading-font
20
+
21
+h1,h2,h3,h4
20 22
   letter-spacing: -1px
21 23
 
22 24
 blockquote
... ...
@@ -25,43 +25,35 @@
25 25
   +typography-defaults(!font_size)
26 26
 
27 27
 =set-heading-sizes(!font_size = !base_font_size)
28
-  !h6 = ceil(!font_size*1.3)
29
-  !h5 = ceil(!font_size*1.4)
30
-  !h4 = ceil(!font_size*1.7)
31
-  !h3 = ceil(!font_size*1.9)
32
-  !h2 = ceil(!font_size*2.2)
33
-  !h1 = ceil(!font_size*2.5)
28
+  !h6 = ceil(!font_size*1)
29
+  !h5 = ceil(!font_size*1)
30
+  !h4 = ceil(!font_size*1.2)
31
+  !h3 = ceil(!font_size*1.8)
32
+  !h2 = ceil(!font_size*3)
33
+  !h1 = ceil(!font_size*3.5)
34 34
   h1, h2, h3, h4
35 35
     &:first-child
36 36
       margin-top: 0
37
+  h1,h2,h3,h4,h5,h6
38
+    line-height: 1.1em
39
+    margin-bottom: .7em
40
+    margin-top: .3em
37 41
   h1
38 42
     font-size= !h1
39
-    margin-bottom= !font_size * .765
40
-    line-height= !h1 * 1.625
41 43
   h2
42 44
     font-size= !h2
43
-    margin-bottom= !font_size * .855
44
-    line-height= !h2 * 1.625
45 45
   h3
46 46
     font-size= !h3
47
-    margin-bottom= !font_size * .956
48
-    line-height= !h3 * 1.625
49 47
   h4
50 48
     font-size= !h4
51
-    margin-bottom= !font_size * 1.161
52
-    line-height= !h4 * 1.625
53 49
   h5
54 50
     font-size= !h5
55
-    margin-bottom= !font_size * 1.238
56
-    line-height= !h5 * 1.625
57 51
   h6
58 52
     font-size= !h6
59
-    margin-bottom= !font_size * 1.625
60
-    line-height= !h6 * 1.625
61 53
 
62 54
 =typography-defaults(!font_size = !base_font_size)
63 55
   body
64
-    line-height: 1.625em
56
+    line-height: 1.45em
65 57
     color= !base_font_color
66 58
   p
67 59
     +p-style(!font_size)
... ...
@@ -97,9 +89,6 @@
97 97
   address
98 98
     margin-top= !font_size * 1.625
99 99
     font-style: italic
100
-  pre, code
101
-    margin= !font_size * 1.625 0
102
-    white-space: pre
103 100
   pre, code, tt
104 101
     +fixed-font
105 102
     line-height= !font_size * 1.5
... ...
@@ -109,8 +98,7 @@
109 109
   sub, sup
110 110
     line-height: 0
111 111
   hr
112
-    margin-bottom= !font_size * 1.625
113
-  
112
+    margin-bottom: .2em
114 113
   small, .small
115 114
     font-size= floor(!font_size * .85)
116 115
   big, .big
... ...
@@ -151,7 +139,7 @@
151 151
     margin: 0
152 152
     
153 153
 =p-style(!font_size = !base_font_size)
154
-  padding-bottom= !font_size * 0.8125
154
+  padding-bottom: 1.3em
155 155
   img
156 156
     float: left
157 157
     margin:
... ...
@@ -1,8 +1,24 @@
1 1
 .blog
2
+  h2
3
+    padding-top: 0
4
+    margin-bottom: .1em
5
+  .title
6
+    text-decoration: none
7
+    &:hover
8
+      text-decoration: underline
2 9
   .article
3 10
     padding= !base_font_size * 1.5 0 !base_font_size * 1.5
4 11
     border-bottom= "1px solid" !article_border
5 12
     &:first-child
6 13
       padding-top: 0
7
-  .footer
8
-    padding-top= !base_font_size
9 14
\ No newline at end of file
15
+  #disqus_thread
16
+    padding-top= !base_font_size
17
+  .meta
18
+    +sans-font
19
+    border-bottom: 1px dashed #ddd
20
+    text-transform: uppercase
21
+    color: #777
22
+    padding: 8px 0 5px
23
+    margin-bottom: 1.5em
24
+    font-size: 75%
25
+    letter-spacing: 1px
10 26
\ No newline at end of file