Use an HTML table instead of CSS for the FlowTable layout.
[online-glom:gwt-glom.git] / src / main / webapp / style.css
1 body
2 {
3         font-size: medium;
4         font-family: sans-serif;
5         margin: 1em;
6 }
7
8 a
9 {
10         font-weight: bold;
11         color: #333;
12         text-decoration: none;
13 }
14
15 a:hover
16 {
17         color: #666;
18         text-decoration: underline;
19 }
20
21 /**
22  * Top and Bottom Navigation Boxes
23  */
24 #headbox, #footbox
25 {
26         background-color: #eee;
27         border: 1px solid #aaa;
28         padding: 0.2em;
29         border-radius: 3px;
30         overflow: hidden;
31 }
32
33 div#document-title
34 {
35         color: #333333;
36         font-weight: bold;
37         font-size: x-large;
38         margin-bottom: 0.5em;
39         margin-left: 0.5em;
40 }
41
42 .backlink
43 {
44         float: right;
45         margin: 0.2em 0.5em;
46 }
47
48 .tablechooser
49 {
50         float: left;
51         margin-left: 0.5em;
52         font-size: 13.3333px;
53         font-family: sans-serif;
54 }
55
56 .records
57 {
58         float: left;
59         margin: 0.2em 0.5em;
60         color: #333;
61 }
62
63 .details-navigation a
64 {
65         padding-right: 1em;
66 }
67
68 table
69 {
70         border-collapse: collapse;
71 }
72
73 /**
74  * List View
75  */
76 table.data-list
77 {
78         width: 100%;
79         margin-top: 1em;
80 }
81
82 table.data-list th
83 {
84         background-color: #ccc;
85         border: 1px solid #000;
86         text-align: left;
87         font-weight: normal;
88         padding: 0.2em;
89         color: #000;
90 }
91
92 table.data-list td
93 {
94         background-color: #fff;
95         border: 1px dotted #aaa;
96         padding: 0.2em;
97         font-size: medium;
98         vertical-align: middle;
99 }
100
101 /* This is for the details column of the List View.
102    Note: Firefox, Chrome, and Safari only support the span and width
103          attributes of the col element.
104  */
105 table.data-list col.details
106 {
107
108 }
109
110 /* TODO: add 'table.data-list td.details' */
111
112 /**
113  * Details View
114  */
115 .group
116 {
117         font-family: sans-serif;
118         font-size: medium;
119         margin: 1em 0;
120         background-color: #eee;
121         padding: 0.8em;
122         border-radius: 7px;
123 }
124
125 .group-contents
126 {
127         padding-left: 0.8em;
128 }
129
130 .subgroup
131 {
132
133 }
134
135 /* Overrides the table settings from the list view */
136 .group table.data-list
137 {
138         margin-top: 0em;
139 }
140
141 .group-column
142 {
143         font-family: sans-serif;
144     font-size: medium;
145 }
146
147 .group-title
148 {
149         font-weight: bold;
150         font-size: 100%;
151         padding: 0;
152         margin: 0;
153         margin-bottom: 0.8em;
154         border-bottom: 1px dashed #000;
155 }
156
157 .subgroup-title
158 {
159         font-weight: bold;
160         font-size: 100%;
161         padding: 0;
162         margin: 0;
163         margin-bottom: 0.6em;
164 }
165
166 group
167 {
168         margin-top: 0;
169         margin-bottom: 0.8em;
170 }
171
172 .details-cell
173 {
174         margin-top: 0;
175         margin-bottom: 0.8em;
176         overflow: hidden;
177 }
178
179 .details-label
180 {
181         padding: 0 0.25em;
182         float: left;
183 }
184
185 .details-data
186 {
187         padding: 0 0.25em;
188         color: #333;
189         float: left;
190 }
191
192 button.details-navigation
193 {
194         margin-left: 0.5em;
195 }
196
197 /*
198  * The Notebook in the Detail View.
199  */
200  .gwt-TabLayoutPanel
201 {
202         margin-bottom: 0.8em;
203 }
204
205 .gwt-TabLayoutPanelContentContainer
206 {
207         border-color: #aaa;
208         border-style: solid;
209         border-width: 2px 1px 1px;
210         border-radius: 3px;
211 }
212
213 .gwt-TabLayoutPanel .gwt-TabLayoutPanelContent
214 {
215         border: 0;
216 }
217
218 .gwt-TabLayoutPanel .gwt-TabLayoutPanelContent .group-contents
219 {
220         padding-left: 0;
221 }
222
223 /* The unselected tabs */
224 .gwt-TabLayoutPanel .gwt-TabLayoutPanelTab
225 {
226         background-color: #aaa;
227         border-radius: 3px 3px 0 0;
228 }
229
230 /* The selected tab */
231 .gwt-TabLayoutPanel .gwt-TabLayoutPanelTab-selected
232 {
233         background-color: #ccc;
234 }
235
236 /* The tab bar */
237 .gwt-TabLayoutPanel .gwt-TabLayoutPanelTabs
238 {
239
240 }