patternfly-sass 2.0.0 → 2.1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (34) hide show
  1. checksums.yaml +4 -4
  2. data/.gitignore +1 -1
  3. data/.travis.yml +10 -2
  4. data/Gemfile +1 -0
  5. data/Rakefile +2 -4
  6. data/assets/stylesheets/_patternfly.scss +4 -4
  7. data/assets/stylesheets/patternfly/_bootstrap-datepicker.scss +21 -1
  8. data/assets/stylesheets/patternfly/_cards.scss +80 -2
  9. data/assets/stylesheets/patternfly/{_bootstrap-combobox-css.scss → _ext-bootstrap-combobox.scss} +0 -0
  10. data/assets/stylesheets/patternfly/{_bootstrap-datepicker-css.scss → _ext-bootstrap-datepicker.scss} +0 -0
  11. data/assets/stylesheets/patternfly/{_bootstrap-select-css.scss → _ext-bootstrap-select.scss} +7 -8
  12. data/assets/stylesheets/patternfly/{_c3-css.scss → _ext-c3.scss} +0 -0
  13. data/assets/stylesheets/patternfly/_variables.scss +1 -0
  14. data/bower.json +20 -4
  15. data/lib/patternfly-sass/version.rb +2 -2
  16. data/patternfly-sass.gemspec +12 -0
  17. data/spec/compare_spec.rb +2 -3
  18. data/spec/html/basic.html +171 -171
  19. data/spec/html/bootstrap-datepicker.html +26 -7
  20. data/spec/html/cards.html +32 -24
  21. data/spec/html/datatables-columns.html +171 -171
  22. data/spec/html/datatables.html +171 -171
  23. data/spec/html/dist/css/patternfly-additions.css +110 -2
  24. data/spec/html/dist/css/patternfly-additions.css.map +1 -1
  25. data/spec/html/dist/css/patternfly-additions.min.css +1 -1
  26. data/spec/html/dist/css/patternfly-additions.min.css.map +1 -1
  27. data/spec/html/dist/css/patternfly.css.map +1 -1
  28. data/spec/html/dist/css/patternfly.min.css.map +1 -1
  29. data/spec/html/main.html +16 -0
  30. data/spec/html/spinner.html +1 -1
  31. data/spec/html/tab.html +171 -171
  32. data/tasks/converter.rb +16 -28
  33. metadata +174 -33
  34. data/.bowerrc +0 -3
@@ -39,19 +39,38 @@
39
39
  These examples are included for development testing purposes. For official documentation, see <a href="https://www.patternfly.org" class="alert-link">https://www.patternfly.org</a>, <a href="http://getbootstrap.com" class="alert-link">http://getbootstrap.com</a>, and <a href="http://bootstrap-datepicker.readthedocs.org/en/latest/">http://bootstrap-datepicker.readthedocs.org/en/latest/</a>.
40
40
  </div>
41
41
  <hr>
42
- <h2>Text Input</h2>
42
+ <h2>Readonly Inputs</h2>
43
+ <p><span class="text-success">Recommended.</span> To prevent invalid dates, setting the inputs to readonly only allows a date to be input via the date picker widget.</p>
44
+ <h3>Text Input</h3>
45
+ <input type="text" class="form-control bootstrap-datepicker" readonly>
46
+ <h3>Component</h3>
47
+ <div class="input-group date">
48
+ <input type="text" class="form-control bootstrap-datepicker" readonly><span class="input-group-addon"><span class="fa fa-calendar"></span></span>
49
+ </div>
50
+ <h3>Inline</h3>
51
+ <div class="bootstrap-datepicker-inline"></div>
52
+ <h3>Range <small>Do not use. PatternFly-approved design coming in a future update.</small></h3>
53
+ <div class="input-daterange input-group">
54
+ <input type="text" class="form-control bootstrap-datepicker" name="start" readonly>
55
+ <span class="input-group-addon">to</span>
56
+ <input type="text" class="form-control bootstrap-datepicker" name="end" readonly>
57
+ </div>
58
+ <hr>
59
+ <h2>Normal Inputs</h2>
60
+ <p><span class="text-warning">Not recommended.</span> For comparison only.</p>
61
+ <h3>Text Input</h3>
43
62
  <input type="text" class="form-control bootstrap-datepicker">
44
- <h2>Component</h2>
63
+ <h3>Component</h3>
45
64
  <div class="input-group date">
46
- <input type="text" class="form-control"><span class="input-group-addon"><span class="fa fa-calendar"></span></span>
65
+ <input type="text" class="form-control bootstrap-datepicker"><span class="input-group-addon"><span class="fa fa-calendar"></span></span>
47
66
  </div>
48
- <h2>Inline</h2>
67
+ <h3>Inline</h3>
49
68
  <div class="bootstrap-datepicker-inline"></div>
50
- <h2>Range <small>Do not use. PatternFly-approved design coming in a future update.</small></h2>
69
+ <h3>Range <small>Do not use. PatternFly-approved design coming in a future update.</small></h3>
51
70
  <div class="input-daterange input-group">
52
- <input type="text" class="form-control" name="start">
71
+ <input type="text" class="form-control bootstrap-datepicker" name="start">
53
72
  <span class="input-group-addon">to</span>
54
- <input type="text" class="form-control" name="end">
73
+ <input type="text" class="form-control bootstrap-datepicker" name="end">
55
74
  </div>
56
75
  <script>
57
76
  // Initialize Boostrap-Datepicker
@@ -119,80 +119,83 @@
119
119
  </nav>
120
120
  <div class="container-fluid container-cards-pf">
121
121
  <div class="row row-cards-pf">
122
+ <!-- Important: if you need to nest additional .row within a .row.row-cards-pf, do *not* use .row-cards-pf on the nested .row -->
122
123
  <div class="col-xs-6 col-sm-4 col-md-2">
123
- <div class="card-pf card-pf-accented">
124
+ <div class="card-pf card-pf-accented card-pf-aggregate-status">
124
125
  <h2 class="card-pf-title">
125
- Card Title
126
+ <span class="fa fa-shield"></span><span class="card-pf-aggregate-status-count">0</span> Ipsum
126
127
  </h2>
127
128
  <div class="card-pf-body">
128
- <p>
129
- [card contents]
129
+ <p class="card-pf-aggregate-status-notifications">
130
+ <span class="card-pf-aggregate-status-notification"><a href="#" class="add" data-toggle="tooltip" data-placement="top" title="Add Ipsum"><span class="pficon pficon-add-circle-o"></span></a></span>
130
131
  </p>
131
132
  </div>
132
133
  </div>
133
134
  </div>
134
135
  <div class="col-xs-6 col-sm-4 col-md-2">
135
- <div class="card-pf card-pf-accented">
136
+ <div class="card-pf card-pf-accented card-pf-aggregate-status card-pf-with-action">
136
137
  <h2 class="card-pf-title">
137
- Card Title
138
+ <a href="#"><span class="fa fa-shield"></span><span class="card-pf-aggregate-status-count">20</span> Amet</a>
138
139
  </h2>
139
140
  <div class="card-pf-body">
140
- <p>
141
- [card contents]
141
+ <p class="card-pf-aggregate-status-notifications">
142
+ <span class="card-pf-aggregate-status-notification"><a href="#"><span class="pficon pficon-error-circle-o"></span>4</a></span>
143
+ <span class="card-pf-aggregate-status-notification"><a href="#"><span class="pficon pficon-warning-triangle-o"></span>1</a></span>
142
144
  </p>
143
145
  </div>
144
146
  </div>
145
147
  </div>
146
148
  <div class="col-xs-6 col-sm-4 col-md-2">
147
- <div class="card-pf card-pf-accented">
149
+ <div class="card-pf card-pf-accented card-pf-aggregate-status card-pf-with-action">
148
150
  <h2 class="card-pf-title">
149
- Card Title
151
+ <a href="#"><span class="fa fa-shield"></span><span class="card-pf-aggregate-status-count">9</span> Adipiscing</a>
150
152
  </h2>
151
153
  <div class="card-pf-body">
152
- <p>
153
- [card contents]
154
+ <p class="card-pf-aggregate-status-notifications">
155
+ <span class="card-pf-aggregate-status-notification"><span class="pficon pficon-ok"></span></span>
154
156
  </p>
155
157
  </div>
156
158
  </div>
157
159
  </div>
158
160
  <div class="col-xs-6 col-sm-4 col-md-2">
159
- <div class="card-pf card-pf-accented">
161
+ <div class="card-pf card-pf-accented card-pf-aggregate-status">
160
162
  <h2 class="card-pf-title">
161
- Card Title
163
+ <a href="#"><span class="fa fa-shield"></span><span class="card-pf-aggregate-status-count">12</span> Lorem</a>
162
164
  </h2>
163
165
  <div class="card-pf-body">
164
- <p>
165
- [card contents]
166
+ <p class="card-pf-aggregate-status-notifications">
167
+ <a href="#"><span class="card-pf-aggregate-status-notification"><span class="pficon pficon-error-circle-o"></span>1</span></a>
166
168
  </p>
167
169
  </div>
168
170
  </div>
169
171
  </div>
170
172
  <div class="col-xs-6 col-sm-4 col-md-2">
171
- <div class="card-pf card-pf-accented">
173
+ <div class="card-pf card-pf-accented card-pf-aggregate-status">
172
174
  <h2 class="card-pf-title">
173
- Card Title
175
+ <a href="#"><span class="fa fa-shield"></span><span class="card-pf-aggregate-status-count">6</span> Dolar Sit</a>
174
176
  </h2>
175
177
  <div class="card-pf-body">
176
- <p>
177
- [card contents]
178
+ <p class="card-pf-aggregate-status-notifications">
179
+ <a href="#"><span class="card-pf-aggregate-status-notification"><span class="pficon pficon-error-circle-o"></span>1</span></a>
178
180
  </p>
179
181
  </div>
180
182
  </div>
181
183
  </div>
182
184
  <div class="col-xs-6 col-sm-4 col-md-2">
183
- <div class="card-pf card-pf-accented">
185
+ <div class="card-pf card-pf-accented card-pf-aggregate-status">
184
186
  <h2 class="card-pf-title">
185
- Card Title
187
+ <a href="#"><span class="fa fa-shield"></span><span class="card-pf-aggregate-status-count">199</span> Consectetur</a>
186
188
  </h2>
187
189
  <div class="card-pf-body">
188
- <p>
189
- [card contents]
190
+ <p class="card-pf-aggregate-status-notifications">
191
+ <a href="#"><span class="card-pf-aggregate-status-notification"><span class="pficon pficon-error-circle-o"></span>1</span></a>
190
192
  </p>
191
193
  </div>
192
194
  </div>
193
195
  </div>
194
196
  </div><!-- /row -->
195
197
  <div class="row row-cards-pf">
198
+ <!-- Important: if you need to nest additional .row within a .row.row-cards-pf, do *not* use .row-cards-pf on the nested .row -->
196
199
  <div class="col-xs-6 col-sm-5 col-md-5">
197
200
  <div class="card-pf">
198
201
  <h2 class="card-pf-title">
@@ -218,6 +221,7 @@
218
221
  </div>
219
222
  </div><!-- /row -->
220
223
  <div class="row row-cards-pf">
224
+ <!-- Important: if you need to nest additional .row within a .row.row-cards-pf, do *not* use .row-cards-pf on the nested .row -->
221
225
  <div class="col-xs-6 col-sm-3 col-md-3">
222
226
  <div class="card-pf">
223
227
  <div class="card-pf-heading">
@@ -250,6 +254,7 @@
250
254
  </div>
251
255
  </div><!-- /row -->
252
256
  <div class="row row-cards-pf">
257
+ <!-- Important: if you need to nest additional .row within a .row.row-cards-pf, do *not* use .row-cards-pf on the nested .row -->
253
258
  <div class="col-xs-6 col-sm-8 col-md-8">
254
259
  <div class="card-pf">
255
260
  <div class="card-pf-body">
@@ -272,6 +277,7 @@
272
277
  </div>
273
278
  </div><!-- /row -->
274
279
  <div class="row row-cards-pf">
280
+ <!-- Important: if you need to nest additional .row within a .row.row-cards-pf, do *not* use .row-cards-pf on the nested .row -->
275
281
  <div class="col-xs-6 col-sm-6 col-md-6">
276
282
  <div class="card-pf">
277
283
  <div class="card-pf-body">
@@ -295,6 +301,8 @@
295
301
  $(".row-cards-pf > [class*='col'] > .card-pf > .card-pf-body").matchHeight();
296
302
  $(".row-cards-pf > [class*='col'] > .card-pf > .card-pf-footer").matchHeight();
297
303
  $(".row-cards-pf > [class*='col'] > .card-pf").matchHeight();
304
+ // initialize tooltips
305
+ $('[data-toggle="tooltip"]').tooltip();
298
306
  });
299
307
  </script>
300
308
  </body>
@@ -52,7 +52,7 @@
52
52
  </tr>
53
53
  </thead>
54
54
  <tbody>
55
- <tr class="gradeX">
55
+ <tr>
56
56
  <td>Trident</td>
57
57
  <td>
58
58
  Internet
@@ -60,403 +60,403 @@
60
60
  4.0
61
61
  </td>
62
62
  <td>Win 95+</td>
63
- <td class="center">4</td>
64
- <td class="center">X</td>
63
+ <td>4</td>
64
+ <td>X</td>
65
65
  </tr>
66
- <tr class="gradeC">
66
+ <tr>
67
67
  <td>Trident</td>
68
68
  <td>Internet
69
69
  Explorer 5.0</td>
70
70
  <td>Win 95+</td>
71
- <td class="center">5</td>
72
- <td class="center">C</td>
71
+ <td>5</td>
72
+ <td>C</td>
73
73
  </tr>
74
- <tr class="gradeA">
74
+ <tr>
75
75
  <td>Trident</td>
76
76
  <td>Internet
77
77
  Explorer 5.5</td>
78
78
  <td>Win 95+</td>
79
- <td class="center">5.5</td>
80
- <td class="center">A</td>
79
+ <td>5.5</td>
80
+ <td>A</td>
81
81
  </tr>
82
- <tr class="gradeA">
82
+ <tr>
83
83
  <td>Trident</td>
84
84
  <td>Internet
85
85
  Explorer 6</td>
86
86
  <td>Win 98+</td>
87
- <td class="center">6</td>
88
- <td class="center">A</td>
87
+ <td>6</td>
88
+ <td>A</td>
89
89
  </tr>
90
- <tr class="gradeA">
90
+ <tr>
91
91
  <td>Trident</td>
92
92
  <td>Internet Explorer 7</td>
93
93
  <td>Win XP SP2+</td>
94
- <td class="center">7</td>
95
- <td class="center">A</td>
94
+ <td>7</td>
95
+ <td>A</td>
96
96
  </tr>
97
- <tr class="gradeA">
97
+ <tr>
98
98
  <td>Trident</td>
99
99
  <td>AOL browser (AOL desktop)</td>
100
100
  <td>Win XP</td>
101
- <td class="center">6</td>
102
- <td class="center">A</td>
101
+ <td>6</td>
102
+ <td>A</td>
103
103
  </tr>
104
- <tr class="gradeA">
104
+ <tr>
105
105
  <td>Gecko</td>
106
106
  <td>Firefox 1.0</td>
107
107
  <td>Win 98+ / OSX.2+</td>
108
- <td class="center">1.7</td>
109
- <td class="center">A</td>
108
+ <td>1.7</td>
109
+ <td>A</td>
110
110
  </tr>
111
- <tr class="gradeA">
111
+ <tr>
112
112
  <td>Gecko</td>
113
113
  <td>Firefox 1.5</td>
114
114
  <td>Win 98+ / OSX.2+</td>
115
- <td class="center">1.8</td>
116
- <td class="center">A</td>
115
+ <td>1.8</td>
116
+ <td>A</td>
117
117
  </tr>
118
- <tr class="gradeA">
118
+ <tr>
119
119
  <td>Gecko</td>
120
120
  <td>Firefox 2.0</td>
121
121
  <td>Win 98+ / OSX.2+</td>
122
- <td class="center">1.8</td>
123
- <td class="center">A</td>
122
+ <td>1.8</td>
123
+ <td>A</td>
124
124
  </tr>
125
- <tr class="gradeA">
125
+ <tr>
126
126
  <td>Gecko</td>
127
127
  <td>Firefox 3.0</td>
128
128
  <td>Win 2k+ / OSX.3+</td>
129
- <td class="center">1.9</td>
130
- <td class="center">A</td>
129
+ <td>1.9</td>
130
+ <td>A</td>
131
131
  </tr>
132
- <tr class="gradeA">
132
+ <tr>
133
133
  <td>Gecko</td>
134
134
  <td>Camino 1.0</td>
135
135
  <td>OSX.2+</td>
136
- <td class="center">1.8</td>
137
- <td class="center">A</td>
136
+ <td>1.8</td>
137
+ <td>A</td>
138
138
  </tr>
139
- <tr class="gradeA">
139
+ <tr>
140
140
  <td>Gecko</td>
141
141
  <td>Camino 1.5</td>
142
142
  <td>OSX.3+</td>
143
- <td class="center">1.8</td>
144
- <td class="center">A</td>
143
+ <td>1.8</td>
144
+ <td>A</td>
145
145
  </tr>
146
- <tr class="gradeA">
146
+ <tr>
147
147
  <td>Gecko</td>
148
148
  <td>Netscape 7.2</td>
149
149
  <td>Win 95+ / Mac OS 8.6-9.2</td>
150
- <td class="center">1.7</td>
151
- <td class="center">A</td>
150
+ <td>1.7</td>
151
+ <td>A</td>
152
152
  </tr>
153
- <tr class="gradeA">
153
+ <tr>
154
154
  <td>Gecko</td>
155
155
  <td>Netscape Browser 8</td>
156
156
  <td>Win 98SE+</td>
157
- <td class="center">1.7</td>
158
- <td class="center">A</td>
157
+ <td>1.7</td>
158
+ <td>A</td>
159
159
  </tr>
160
- <tr class="gradeA">
160
+ <tr>
161
161
  <td>Gecko</td>
162
162
  <td>Netscape Navigator 9</td>
163
163
  <td>Win 98+ / OSX.2+</td>
164
- <td class="center">1.8</td>
165
- <td class="center">A</td>
164
+ <td>1.8</td>
165
+ <td>A</td>
166
166
  </tr>
167
- <tr class="gradeA">
167
+ <tr>
168
168
  <td>Gecko</td>
169
169
  <td>Mozilla 1.0</td>
170
170
  <td>Win 95+ / OSX.1+</td>
171
- <td class="center">1</td>
172
- <td class="center">A</td>
171
+ <td>1</td>
172
+ <td>A</td>
173
173
  </tr>
174
- <tr class="gradeA">
174
+ <tr>
175
175
  <td>Gecko</td>
176
176
  <td>Mozilla 1.1</td>
177
177
  <td>Win 95+ / OSX.1+</td>
178
- <td class="center">1.1</td>
179
- <td class="center">A</td>
178
+ <td>1.1</td>
179
+ <td>A</td>
180
180
  </tr>
181
- <tr class="gradeA">
181
+ <tr>
182
182
  <td>Gecko</td>
183
183
  <td>Mozilla 1.2</td>
184
184
  <td>Win 95+ / OSX.1+</td>
185
- <td class="center">1.2</td>
186
- <td class="center">A</td>
185
+ <td>1.2</td>
186
+ <td>A</td>
187
187
  </tr>
188
- <tr class="gradeA">
188
+ <tr>
189
189
  <td>Gecko</td>
190
190
  <td>Mozilla 1.3</td>
191
191
  <td>Win 95+ / OSX.1+</td>
192
- <td class="center">1.3</td>
193
- <td class="center">A</td>
192
+ <td>1.3</td>
193
+ <td>A</td>
194
194
  </tr>
195
- <tr class="gradeA">
195
+ <tr>
196
196
  <td>Gecko</td>
197
197
  <td>Mozilla 1.4</td>
198
198
  <td>Win 95+ / OSX.1+</td>
199
- <td class="center">1.4</td>
200
- <td class="center">A</td>
199
+ <td>1.4</td>
200
+ <td>A</td>
201
201
  </tr>
202
- <tr class="gradeA">
202
+ <tr>
203
203
  <td>Gecko</td>
204
204
  <td>Mozilla 1.5</td>
205
205
  <td>Win 95+ / OSX.1+</td>
206
- <td class="center">1.5</td>
207
- <td class="center">A</td>
206
+ <td>1.5</td>
207
+ <td>A</td>
208
208
  </tr>
209
- <tr class="gradeA">
209
+ <tr>
210
210
  <td>Gecko</td>
211
211
  <td>Mozilla 1.6</td>
212
212
  <td>Win 95+ / OSX.1+</td>
213
- <td class="center">1.6</td>
214
- <td class="center">A</td>
213
+ <td>1.6</td>
214
+ <td>A</td>
215
215
  </tr>
216
- <tr class="gradeA">
216
+ <tr>
217
217
  <td>Gecko</td>
218
218
  <td>Mozilla 1.7</td>
219
219
  <td>Win 98+ / OSX.1+</td>
220
- <td class="center">1.7</td>
221
- <td class="center">A</td>
220
+ <td>1.7</td>
221
+ <td>A</td>
222
222
  </tr>
223
- <tr class="gradeA">
223
+ <tr>
224
224
  <td>Gecko</td>
225
225
  <td>Mozilla 1.8</td>
226
226
  <td>Win 98+ / OSX.1+</td>
227
- <td class="center">1.8</td>
228
- <td class="center">A</td>
227
+ <td>1.8</td>
228
+ <td>A</td>
229
229
  </tr>
230
- <tr class="gradeA">
230
+ <tr>
231
231
  <td>Gecko</td>
232
232
  <td>Seamonkey 1.1</td>
233
233
  <td>Win 98+ / OSX.2+</td>
234
- <td class="center">1.8</td>
235
- <td class="center">A</td>
234
+ <td>1.8</td>
235
+ <td>A</td>
236
236
  </tr>
237
- <tr class="gradeA">
237
+ <tr>
238
238
  <td>Gecko</td>
239
239
  <td>Epiphany 2.20</td>
240
240
  <td>Gnome</td>
241
- <td class="center">1.8</td>
242
- <td class="center">A</td>
241
+ <td>1.8</td>
242
+ <td>A</td>
243
243
  </tr>
244
- <tr class="gradeA">
244
+ <tr>
245
245
  <td>Webkit</td>
246
246
  <td>Safari 1.2</td>
247
247
  <td>OSX.3</td>
248
- <td class="center">125.5</td>
249
- <td class="center">A</td>
248
+ <td>125.5</td>
249
+ <td>A</td>
250
250
  </tr>
251
- <tr class="gradeA">
251
+ <tr>
252
252
  <td>Webkit</td>
253
253
  <td>Safari 1.3</td>
254
254
  <td>OSX.3</td>
255
- <td class="center">312.8</td>
256
- <td class="center">A</td>
255
+ <td>312.8</td>
256
+ <td>A</td>
257
257
  </tr>
258
- <tr class="gradeA">
258
+ <tr>
259
259
  <td>Webkit</td>
260
260
  <td>Safari 2.0</td>
261
261
  <td>OSX.4+</td>
262
- <td class="center">419.3</td>
263
- <td class="center">A</td>
262
+ <td>419.3</td>
263
+ <td>A</td>
264
264
  </tr>
265
- <tr class="gradeA">
265
+ <tr>
266
266
  <td>Webkit</td>
267
267
  <td>Safari 3.0</td>
268
268
  <td>OSX.4+</td>
269
- <td class="center">522.1</td>
270
- <td class="center">A</td>
269
+ <td>522.1</td>
270
+ <td>A</td>
271
271
  </tr>
272
- <tr class="gradeA">
272
+ <tr>
273
273
  <td>Webkit</td>
274
274
  <td>OmniWeb 5.5</td>
275
275
  <td>OSX.4+</td>
276
- <td class="center">420</td>
277
- <td class="center">A</td>
276
+ <td>420</td>
277
+ <td>A</td>
278
278
  </tr>
279
- <tr class="gradeA">
279
+ <tr>
280
280
  <td>Webkit</td>
281
281
  <td>iPod Touch / iPhone</td>
282
282
  <td>iPod</td>
283
- <td class="center">420.1</td>
284
- <td class="center">A</td>
283
+ <td>420.1</td>
284
+ <td>A</td>
285
285
  </tr>
286
- <tr class="gradeA">
286
+ <tr>
287
287
  <td>Webkit</td>
288
288
  <td>S60</td>
289
289
  <td>S60</td>
290
- <td class="center">413</td>
291
- <td class="center">A</td>
290
+ <td>413</td>
291
+ <td>A</td>
292
292
  </tr>
293
- <tr class="gradeA">
293
+ <tr>
294
294
  <td>Presto</td>
295
295
  <td>Opera 7.0</td>
296
296
  <td>Win 95+ / OSX.1+</td>
297
- <td class="center">-</td>
298
- <td class="center">A</td>
297
+ <td>-</td>
298
+ <td>A</td>
299
299
  </tr>
300
- <tr class="gradeA">
300
+ <tr>
301
301
  <td>Presto</td>
302
302
  <td>Opera 7.5</td>
303
303
  <td>Win 95+ / OSX.2+</td>
304
- <td class="center">-</td>
305
- <td class="center">A</td>
304
+ <td>-</td>
305
+ <td>A</td>
306
306
  </tr>
307
- <tr class="gradeA">
307
+ <tr>
308
308
  <td>Presto</td>
309
309
  <td>Opera 8.0</td>
310
310
  <td>Win 95+ / OSX.2+</td>
311
- <td class="center">-</td>
312
- <td class="center">A</td>
311
+ <td>-</td>
312
+ <td>A</td>
313
313
  </tr>
314
- <tr class="gradeA">
314
+ <tr>
315
315
  <td>Presto</td>
316
316
  <td>Opera 8.5</td>
317
317
  <td>Win 95+ / OSX.2+</td>
318
- <td class="center">-</td>
319
- <td class="center">A</td>
318
+ <td>-</td>
319
+ <td>A</td>
320
320
  </tr>
321
- <tr class="gradeA">
321
+ <tr>
322
322
  <td>Presto</td>
323
323
  <td>Opera 9.0</td>
324
324
  <td>Win 95+ / OSX.3+</td>
325
- <td class="center">-</td>
326
- <td class="center">A</td>
325
+ <td>-</td>
326
+ <td>A</td>
327
327
  </tr>
328
- <tr class="gradeA">
328
+ <tr>
329
329
  <td>Presto</td>
330
330
  <td>Opera 9.2</td>
331
331
  <td>Win 88+ / OSX.3+</td>
332
- <td class="center">-</td>
333
- <td class="center">A</td>
332
+ <td>-</td>
333
+ <td>A</td>
334
334
  </tr>
335
- <tr class="gradeA">
335
+ <tr>
336
336
  <td>Presto</td>
337
337
  <td>Opera 9.5</td>
338
338
  <td>Win 88+ / OSX.3+</td>
339
- <td class="center">-</td>
340
- <td class="center">A</td>
339
+ <td>-</td>
340
+ <td>A</td>
341
341
  </tr>
342
- <tr class="gradeA">
342
+ <tr>
343
343
  <td>Presto</td>
344
344
  <td>Opera for Wii</td>
345
345
  <td>Wii</td>
346
- <td class="center">-</td>
347
- <td class="center">A</td>
346
+ <td>-</td>
347
+ <td>A</td>
348
348
  </tr>
349
- <tr class="gradeA">
349
+ <tr>
350
350
  <td>Presto</td>
351
351
  <td>Nokia N800</td>
352
352
  <td>N800</td>
353
- <td class="center">-</td>
354
- <td class="center">A</td>
353
+ <td>-</td>
354
+ <td>A</td>
355
355
  </tr>
356
- <tr class="gradeA">
356
+ <tr>
357
357
  <td>Presto</td>
358
358
  <td>Nintendo DS browser</td>
359
359
  <td>Nintendo DS</td>
360
- <td class="center">8.5</td>
361
- <td class="center">C/A<sup>1</sup></td>
360
+ <td>8.5</td>
361
+ <td>C/A<sup>1</sup></td>
362
362
  </tr>
363
- <tr class="gradeC">
363
+ <tr>
364
364
  <td>KHTML</td>
365
365
  <td>Konqureror 3.1</td>
366
366
  <td>KDE 3.1</td>
367
- <td class="center">3.1</td>
368
- <td class="center">C</td>
367
+ <td>3.1</td>
368
+ <td>C</td>
369
369
  </tr>
370
- <tr class="gradeA">
370
+ <tr>
371
371
  <td>KHTML</td>
372
372
  <td>Konqureror 3.3</td>
373
373
  <td>KDE 3.3</td>
374
- <td class="center">3.3</td>
375
- <td class="center">A</td>
374
+ <td>3.3</td>
375
+ <td>A</td>
376
376
  </tr>
377
- <tr class="gradeA">
377
+ <tr>
378
378
  <td>KHTML</td>
379
379
  <td>Konqureror 3.5</td>
380
380
  <td>KDE 3.5</td>
381
- <td class="center">3.5</td>
382
- <td class="center">A</td>
381
+ <td>3.5</td>
382
+ <td>A</td>
383
383
  </tr>
384
- <tr class="gradeX">
384
+ <tr>
385
385
  <td>Tasman</td>
386
386
  <td>Internet Explorer 4.5</td>
387
387
  <td>Mac OS 8-9</td>
388
- <td class="center">-</td>
389
- <td class="center">X</td>
388
+ <td>-</td>
389
+ <td>X</td>
390
390
  </tr>
391
- <tr class="gradeC">
391
+ <tr>
392
392
  <td>Tasman</td>
393
393
  <td>Internet Explorer 5.1</td>
394
394
  <td>Mac OS 7.6-9</td>
395
- <td class="center">1</td>
396
- <td class="center">C</td>
395
+ <td>1</td>
396
+ <td>C</td>
397
397
  </tr>
398
- <tr class="gradeC">
398
+ <tr>
399
399
  <td>Tasman</td>
400
400
  <td>Internet Explorer 5.2</td>
401
401
  <td>Mac OS 8-X</td>
402
- <td class="center">1</td>
403
- <td class="center">C</td>
402
+ <td>1</td>
403
+ <td>C</td>
404
404
  </tr>
405
- <tr class="gradeA">
405
+ <tr>
406
406
  <td>Misc</td>
407
407
  <td>NetFront 3.1</td>
408
408
  <td>Embedded devices</td>
409
- <td class="center">-</td>
410
- <td class="center">C</td>
409
+ <td>-</td>
410
+ <td>C</td>
411
411
  </tr>
412
- <tr class="gradeA">
412
+ <tr>
413
413
  <td>Misc</td>
414
414
  <td>NetFront 3.4</td>
415
415
  <td>Embedded devices</td>
416
- <td class="center">-</td>
417
- <td class="center">A</td>
416
+ <td>-</td>
417
+ <td>A</td>
418
418
  </tr>
419
- <tr class="gradeX">
419
+ <tr>
420
420
  <td>Misc</td>
421
421
  <td>Dillo 0.8</td>
422
422
  <td>Embedded devices</td>
423
- <td class="center">-</td>
424
- <td class="center">X</td>
423
+ <td>-</td>
424
+ <td>X</td>
425
425
  </tr>
426
- <tr class="gradeX">
426
+ <tr>
427
427
  <td>Misc</td>
428
428
  <td>Links</td>
429
429
  <td>Text only</td>
430
- <td class="center">-</td>
431
- <td class="center">X</td>
430
+ <td>-</td>
431
+ <td>X</td>
432
432
  </tr>
433
- <tr class="gradeX">
433
+ <tr>
434
434
  <td>Misc</td>
435
435
  <td>Lynx</td>
436
436
  <td>Text only</td>
437
- <td class="center">-</td>
438
- <td class="center">X</td>
437
+ <td>-</td>
438
+ <td>X</td>
439
439
  </tr>
440
- <tr class="gradeC">
440
+ <tr>
441
441
  <td>Misc</td>
442
442
  <td>IE Mobile</td>
443
443
  <td>Windows Mobile 6</td>
444
- <td class="center">-</td>
445
- <td class="center">C</td>
444
+ <td>-</td>
445
+ <td>C</td>
446
446
  </tr>
447
- <tr class="gradeC">
447
+ <tr>
448
448
  <td>Misc</td>
449
449
  <td>PSP browser</td>
450
450
  <td>PSP</td>
451
- <td class="center">-</td>
452
- <td class="center">C</td>
451
+ <td>-</td>
452
+ <td>C</td>
453
453
  </tr>
454
- <tr class="gradeU">
454
+ <tr>
455
455
  <td>Other browsers</td>
456
456
  <td>All others</td>
457
457
  <td>-</td>
458
- <td class="center">-</td>
459
- <td class="center">U</td>
458
+ <td>-</td>
459
+ <td>U</td>
460
460
  </tr>
461
461
  </tbody>
462
462
  </table>