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 | */ |
---|
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 | } |
---|
45 | |
---|
46 | fieldset, img { |
---|
47 | border: 0 none; |
---|
48 | } |
---|
49 | |
---|
50 | address, caption, cite, code, dfn, th, var { |
---|
51 | font-style: normal; |
---|
52 | font-weight: normal; |
---|
53 | } |
---|
54 | |
---|
55 | caption, th { |
---|
56 | text-align: left; |
---|
57 | } |
---|
58 | |
---|
59 | q:before, q:after { |
---|
60 | content:""; |
---|
61 | } |
---|
62 | |
---|
63 | abbr, acronym { |
---|
64 | border:0; |
---|
65 | } |
---|
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 | */ |
---|
93 | body { |
---|
94 | font: 12px Myriad,Helvetica,Tahoma,Arial,clean,sans-serif; |
---|
95 | *font-size: 75%; |
---|
96 | } |
---|
97 | |
---|
98 | /* Headings */ |
---|
99 | h1 { |
---|
100 | font-size: 1.5em; |
---|
101 | font-weight: normal; |
---|
102 | line-height: 1em; |
---|
103 | margin-top: 1em; |
---|
104 | margin-bottom:0; |
---|
105 | } |
---|
106 | |
---|
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 | } |
---|
114 | |
---|
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 | } |
---|
122 | |
---|
123 | /* paragraphs, quotes and lists */ |
---|
124 | p { |
---|
125 | font-size: 1em; |
---|
126 | margin-top: 1.5em; |
---|
127 | margin-bottom: 1.5em; |
---|
128 | line-height: 1.5em; |
---|
129 | } |
---|
130 | |
---|
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 | } |
---|
140 | |
---|
141 | ol li, ul li { |
---|
142 | font-size: 1em; |
---|
143 | line-height: 1.5em; |
---|
144 | margin: 0; |
---|
145 | } |
---|
146 | |
---|
147 | /* pre and code */ |
---|
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 | } |
---|
155 | |
---|
156 | pre { |
---|
157 | border-width: 1px 0; |
---|
158 | padding: 1.5em; |
---|
159 | } |
---|
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 | */ |
---|
172 | table { font-size:100%; } |
---|
173 | |
---|
174 | .dojoTabular { |
---|
175 | border-collapse: collapse; |
---|
176 | border-spacing: 0; |
---|
177 | border: 1px solid #ccc; |
---|
178 | margin: 0 1.5em; |
---|
179 | } |
---|
180 | |
---|
181 | .dojoTabular th { |
---|
182 | text-align: center; |
---|
183 | font-weight: bold; |
---|
184 | } |
---|
185 | |
---|
186 | .dojoTabular thead, |
---|
187 | .dojoTabular tfoot { |
---|
188 | background-color: #efefef; |
---|
189 | border: 1px solid #ccc; |
---|
190 | border-width: 1px 0; |
---|
191 | } |
---|
192 | |
---|
193 | .dojoTabular th, |
---|
194 | .dojoTabular td { |
---|
195 | padding: 0.25em 0.5em; |
---|
196 | } |
---|