Mercurial > hg-website
comparison static/css/styles.css @ 248:53a5e100b497
Convert the frontpage, except for the download button.
author | Steve Losh <steve@stevelosh.com> |
---|---|
date | Wed, 23 Sep 2009 20:34:42 -0400 |
parents | |
children | 8121534f8781 |
comparison
equal
deleted
inserted
replaced
247:3e6869f76b8d | 248:53a5e100b497 |
---|---|
1 /* | |
2 * Reset | |
3 */ | |
4 body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin: 0; padding: 0; } | |
5 fieldset, img { border: none; vertical-align: middle; } | |
6 hr { display: none; } | |
7 | |
8 /* | |
9 * Margins | |
10 */ | |
11 p, ul, ol, dl, table { margin: 0 0 1em 0; } | |
12 | |
13 /* | |
14 * Hyperlinks | |
15 */ | |
16 a { color: #00b5f1; text-decoration: underline; overflow: hidden; } | |
17 a:hover, a:focus { text-decoration: none; } | |
18 | |
19 /* | |
20 * General Document Settings | |
21 */ | |
22 body { font: .875em/1.4285em "Helvetica Neue", Helvetica, Verdana, Arial, sans-serif; color: #111; width: 900px; margin: 0 auto; position: relative; } | |
23 | |
24 /* | |
25 * Headings | |
26 */ | |
27 h1, h2, h3 { font-size: 1em; font-family: Optimer, Helvetica, Arial, sans-serif; margin: 0 0 .5em 0; font-weight: normal; } | |
28 h4, h5, h6 { font-size: 1em; margin: 0 0 .5em 0; } | |
29 h1 { font-size: 2em; } | |
30 h2 { font-size: 1.6em; } | |
31 h3 { font-size: 1.3em; } | |
32 | |
33 /* | |
34 * Lists | |
35 */ | |
36 ul { margin-left: 2.2em; line-height: 1.5em; } | |
37 li ul, li ol { margin-top: 0; margin-bottom: 0; } | |
38 li { margin: .3em 0; } | |
39 ol { margin-left: 2.2em; } | |
40 ol li { list-style-type: decimal; } | |
41 ol li ol li { list-style-type: lower-alpha; } | |
42 ol li ol li ol li { list-style-type: upper-roman; } | |
43 | |
44 dt { font-weight: bold; margin-top: 10px; } | |
45 dt em { font-style: normal; display: block; font-weight: normal; } | |
46 dd { background: url(../images/bullet.gif) no-repeat 10px .5em; padding-left: 20px; } | |
47 | |
48 /* | |
49 * Forms | |
50 */ | |
51 input, textarea, select { font-family: Helvetica, Arial, sans-serif; font-size: .8571em; vertical-align: top; } | |
52 textarea { overflow: auto; width: 220px; height: 90px; } | |
53 form ol { margin: 0; } | |
54 form ol li { list-style: none; margin: 0 0 10px 0; display: inline-block; overflow: hidden; } | |
55 form ol li { display: block; } | |
56 label { float: left; width: 100px; padding-right: 10px; text-align: right; } | |
57 .submit { margin-left: 110px; } | |
58 | |
59 /* | |
60 * Table | |
61 */ | |
62 table { border-collapse: separate; border-spacing: 0; font-size: 90% } | |
63 caption, th, td { text-align: left; font-weight: normal; } | |
64 td, th { padding: 6px 8px; } | |
65 .latest thead td, .latest thead th { background: #00B5F1; color: #fff; font-weight: bold; } | |
66 thead td, thead th { background: #999; color: #fff; font-weight: bold; } | |
67 tbody td { border-bottom: 1px solid #ccc; } | |
68 | |
69 /* | |
70 * Quotes | |
71 */ | |
72 blockquote:before, blockquote:after, q:before, q:after { content: ""; } | |
73 blockquote, q { quotes: "" ""; } | |
74 | |
75 /* | |
76 * Layout | |
77 */ | |
78 .row { display: inline-block; overflow: hidden; border-bottom: 1px solid #ccc; } | |
79 .row { display: block; } | |
80 .col { float: right; display: inline; width: 270px; margin: 25px; } | |
81 .big { float: left; width: 470px; } | |
82 .quote { float: right; width: 740px; text-align: right; margin-right: 25px; } | |
83 .big h2 { margin-top: 20px; } | |
84 | |
85 /* | |
86 * Logo | |
87 */ | |
88 #logo { border-bottom: 1px solid #ccc; margin: 0 0 15px 0; } | |
89 #logo a { display: block; width: 184px; height: 61px; background: url(../images/mercurial-logo.png) no-repeat 0 0; text-indent: -9999px; } | |
90 | |
91 /* | |
92 * Nav | |
93 */ | |
94 #nav { position: absolute; top: 17px; right: 0; background: #999; height: 42px; margin: 0; width: 665px; font-size: 1.1428em; *font-size: 16px; line-height: 42px; font-family: Optimer, Helvetica, Arial, sans-serif; overflow: hidden; } | |
95 #nav li { float: left; margin: 0; padding: 0; list-style: none; } | |
96 #nav a { float: left; color: #fff; text-decoration: none; padding: 0 16px; *padding: 0 14px; } | |
97 #nav a:hover, #nav a:focus, #nav .active a { background: #00b5f1; } | |
98 | |
99 /* | |
100 * Search | |
101 */ | |
102 #search { position: absolute; right: 15px; top: 26px; color: #fff; width: 183px; height: 23px; background: url(../images/search.png) no-repeat 0 0; } | |
103 #search legend { display: none; } | |
104 #search label { position: absolute; left: -9999px; } | |
105 #search .text { width: 150px; background: none; border: none; margin: 0 0 0 5px; position: relative; top: 5px; color: #666; outline:0; } | |
106 #search .submit { width: 23px; height: 23px; background: none; border: none; cursor: pointer; text-indent: -9999px; color: #10B8F0; *color: #fff; font-size: 1px; } | |
107 | |
108 /* | |
109 * Download button | |
110 */ | |
111 .download { display: block; width: 175px; height: 59px; padding: 14px 80px 14px 30px; background: #12baf2 url(../images/download.png) no-repeat 0 0; color: #fff; text-decoration: none; font-family: Verdana, Arial, sans-serif; } | |
112 .download strong { display: block; font-size: 1.2857em; margin-bottom: 4px; } | |
113 .download em { font-style: normal; font-weight: bold; } | |
114 .download span { display: block; font-size: .7142em; } | |
115 | |
116 /* | |
117 * Homepage | |
118 */ | |
119 #home #logo { margin-bottom: 0 !important; } | |
120 #home dl { margin: 0 30px; font-family: Verdana, Helvetica, Arial, sans-serif; font-size: .80em; line-height: 1.4em; } | |
121 #home h1 { font-size: 48px; line-height: 1em; margin: 0 0 20px 0; font-weight: normal; } | |
122 #home h2, #home h3 { font-size: 22px; line-height: 1.2em; margin-bottom: 20px; font-weight: normal; } | |
123 #home h4 { font-weight: normal; margin: 0; } | |
124 #home h4 a { text-decoration: none; } | |
125 #home h4 a:hover, #home h4 a:focus { text-decoration: underline; } | |
126 #home ol { margin: 0; } | |
127 #home ol li { list-style: none; background: url(../images/bullet-big-1.png) no-repeat 0 0; padding-left: 60px; min-height: 43px; _height: 43px; margin-bottom: 1.7em } | |
128 #home ol .i-2 { background-image: url(../images/bullet-big-2.png); } | |
129 #home ol .i-3 { background-image: url(../images/bullet-big-3.png); } | |
130 #home ol a { text-decoration: none; } | |
131 #home ol a:hover { text-decoration: underline; } | |
132 | |
133 /* | |
134 * Footer | |
135 */ | |
136 #footer { font-family: Verdana, Helvetica, Arial, sans-serif; font-size: .6428em; display: inline-block; overflow: hidden; text-align: right; padding: 10px 25px; } | |
137 #footer { display: block; } | |
138 #footer div { float: left; } | |
139 #footer a { text-decoration: none; } | |
140 | |
141 /* | |
142 * Mercurial commands interspersed in text | |
143 */ | |
144 | |
145 #home hg { text-decoration: italic; } | |
146 | |
147 /* | |
148 * Lists without big bullet type... | |
149 */ | |
150 | |
151 #home .undecorated_list li { list-style:decimal outside; background: none; padding-left: 0px; min-height: 0px; margin-bottom: 1.7em} #home .undecorated_list li li { list-style: circle outside } |