]>
Commit | Line | Data |
---|---|---|
a089699c AD |
1 | /* |
2 | dojo.css | |
3 | Baseline CSS file for general usage. | |
4 | ||
5 | This file is intended to be a "quick and dirty" stylesheet you can use to give | |
6 | a straight-up web page some basic styling without having to do the dirty work | |
7 | yourself. It includes a modified version of YUI's reset.css (we pulled some | |
8 | of the list reset definitions, among other things), and then provides some very | |
9 | basic style rules to be applied to general HTML elements. | |
10 | ||
11 | This stylesheet is NOT intended to serve as the foundation for more complex things-- | |
12 | including the use of a TABLE for layout purposes. The table definitions in this | |
13 | file make the assumption that you will be using tables for thier declared purpose: | |
14 | displaying tabular data. | |
15 | ||
16 | If you are looking for a baseline stylesheet using tables for grid layout, you will | |
17 | need to supply your own layout rules to override the ones in this stylesheet. | |
18 | ||
19 | Applications using Dojo will function correctly without including this | |
20 | file, but it should provide sane defaults for many common things that page | |
21 | authors often need to set up manually. | |
22 | ||
23 | The Dojo Core uses this stylesheet to quickly style HTML-based tests and demos. Feel | |
24 | free to use it as you will. | |
25 | */ | |
26 | ||
27 | /*****************************************************************************************/ | |
28 | ||
29 | /* | |
30 | The below are borrowed from YUI's reset style sheets for pages and fonts. | |
31 | We've verified w/ the YUI development team that these are entirely | |
32 | copyright Yahoo, written entirely by Nate Koechley and Matt Sweeney without | |
33 | external contributions. | |
34 | ||
35 | Copyright (c) 2007, Yahoo! Inc. All rights reserved. | |
36 | Code licensed under the BSD License: | |
37 | http://developer.yahoo.net/yui/license.txt | |
38 | version: 2.2.1 | |
39 | */ | |
2f01fe57 AD |
40 | |
41 | body, div, dl, dt, dd, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { | |
42 | margin: 0; | |
43 | padding: 0; | |
44 | } | |
a089699c | 45 | |
2f01fe57 AD |
46 | fieldset, img { |
47 | border: 0 none; | |
48 | } | |
a089699c | 49 | |
2f01fe57 AD |
50 | address, caption, cite, code, dfn, th, var { |
51 | font-style: normal; | |
52 | font-weight: normal; | |
53 | } | |
a089699c | 54 | |
2f01fe57 AD |
55 | caption, th { |
56 | text-align: left; | |
57 | } | |
a089699c | 58 | |
2f01fe57 AD |
59 | q:before, q:after { |
60 | content:""; | |
61 | } | |
a089699c | 62 | |
2f01fe57 AD |
63 | abbr, acronym { |
64 | border:0; | |
65 | } | |
a089699c AD |
66 | /* End YUI imported code. */ |
67 | ||
68 | /*****************************************************************************************/ | |
69 | ||
70 | /* | |
71 | Begin Dojo additions. | |
72 | ||
73 | Style definitions, based loosely on the Dijit Tundra theme. | |
74 | Relative unit calculations based on "Compose to a Vertical Rhythm", | |
75 | by Richard Rutter (http://24ways.org/2006/compose-to-a-vertical-rhythm) | |
76 | ||
77 | If changing the font size, make sure you do it in both | |
78 | percent and px (% for IE, px for everything else). | |
79 | % value based on default size of 16px (in most browsers). | |
80 | So if you want the default size to be 14px, set the | |
81 | % to 87% (14 / 16 = 0.875). | |
82 | ||
83 | Typical values: | |
84 | 10px: 62.5% | |
85 | 11px: 69% (68.75) | |
86 | 12px: 75% | |
87 | 13px: 81.25% | |
88 | 14px: 87.5% | |
89 | 16px: 100% | |
90 | ||
91 | Default: 12px | |
92 | */ | |
2f01fe57 AD |
93 | body { |
94 | font: 12px Myriad,Helvetica,Tahoma,Arial,clean,sans-serif; | |
95 | *font-size: 75%; | |
96 | } | |
a089699c AD |
97 | |
98 | /* Headings */ | |
2f01fe57 AD |
99 | h1 { |
100 | font-size: 1.5em; | |
101 | font-weight: normal; | |
102 | line-height: 1em; | |
103 | margin-top: 1em; | |
104 | margin-bottom:0; | |
105 | } | |
a089699c | 106 | |
2f01fe57 AD |
107 | h2 { |
108 | font-size: 1.1667em; | |
109 | font-weight: bold; | |
110 | line-height: 1.286em; | |
111 | margin-top: 1.929em; | |
112 | margin-bottom:0.643em; | |
113 | } | |
a089699c | 114 | |
2f01fe57 AD |
115 | h3, h4, h5, h6 { |
116 | font-size: 1em; | |
117 | font-weight: bold; | |
118 | line-height: 1.5em; | |
119 | margin-top: 1.5em; | |
120 | margin-bottom: 0; | |
121 | } | |
a089699c AD |
122 | |
123 | /* paragraphs, quotes and lists */ | |
2f01fe57 AD |
124 | p { |
125 | font-size: 1em; | |
126 | margin-top: 1.5em; | |
127 | margin-bottom: 1.5em; | |
128 | line-height: 1.5em; | |
129 | } | |
a089699c | 130 | |
2f01fe57 AD |
131 | blockquote { |
132 | font-size: 0.916em; | |
133 | margin-top: 3.272em; | |
134 | margin-bottom: 3.272em; | |
135 | line-height: 1.636em; | |
136 | padding: 1.636em; | |
137 | border-top: 1px solid #ccc; | |
138 | border-bottom: 1px solid #ccc; | |
139 | } | |
a089699c | 140 | |
2f01fe57 AD |
141 | ol li, ul li { |
142 | font-size: 1em; | |
143 | line-height: 1.5em; | |
144 | margin: 0; | |
145 | } | |
a089699c AD |
146 | |
147 | /* pre and code */ | |
2f01fe57 AD |
148 | pre, code { |
149 | font-size:115%; | |
150 | *font-size:100%; | |
151 | font-family: Courier, "Courier New"; | |
152 | background-color: #efefef; | |
153 | border: 1px solid #ccc; | |
154 | } | |
a089699c | 155 | |
2f01fe57 AD |
156 | pre { |
157 | border-width: 1px 0; | |
158 | padding: 1.5em; | |
159 | } | |
a089699c AD |
160 | |
161 | /* | |
162 | Tables | |
163 | ||
164 | Note that these table definitions make the assumption that you are using tables | |
165 | to display tabular data, and NOT using tables as layout mechanisms. If you are | |
166 | using tables for layout, you will probably want to override these rules with | |
167 | more specific ones. | |
168 | ||
169 | These definitions make tabular data look presentable, particularly when presented | |
170 | inline with paragraphs. | |
171 | */ | |
2f01fe57 | 172 | table { font-size:100%; } |
a089699c | 173 | |
2f01fe57 AD |
174 | .dojoTabular { |
175 | border-collapse: collapse; | |
176 | border-spacing: 0; | |
177 | border: 1px solid #ccc; | |
178 | margin: 0 1.5em; | |
179 | } | |
a089699c | 180 | |
2f01fe57 AD |
181 | .dojoTabular th { |
182 | text-align: center; | |
183 | font-weight: bold; | |
184 | } | |
a089699c | 185 | |
2f01fe57 AD |
186 | .dojoTabular thead, |
187 | .dojoTabular tfoot { | |
188 | background-color: #efefef; | |
189 | border: 1px solid #ccc; | |
190 | border-width: 1px 0; | |
191 | } | |
a089699c | 192 | |
2f01fe57 AD |
193 | .dojoTabular th, |
194 | .dojoTabular td { | |
195 | padding: 0.25em 0.5em; | |
196 | } |