← Back to branch summary

~jonobacon/ubuntu-accomplishments-daemon/ubuntu-accomplishments-daemon

« back to all changes in this revision

Viewing changes to data/css/information.css

  • Committer: Jono Bacon
  • Date: 2012-04-08 17:21:44 UTC
  • Revision ID: jono@ubuntu.com-20120408172144-leas1ghodiohy943
 * Refined accomplishment info design from Brandon. :-)

Show diffs side-by-side

added added

removed removed

Lines of Context:
data/css/information.css
 
1
a {
 
2
  color: #dd4814;
 
3
  text-decoration: none;
 
4
  font-weight: 700;
 
5
}
 
6
 
 
7
#accomplishment {
 
8
        -moz-border-radius: 4px;
 
9
        -webkit-border-radius: 4px;
 
10
        background: #fff;
 
11
        border: 1px solid #eee;
 
12
        border-radius: 4px;
 
13
        padding: 0
 
14
}
 
15
 
 
16
#accomplishment .block {
 
17
        margin-top: 10px
 
18
}
 
19
 
 
20
#accomplishment-badge {
 
21
        -moz-border-radius: 4px;
 
22
        -webkit-border-radius: 4px;
 
23
        background: #DD4814;
 
24
        border: 0;
 
25
        border-radius: 4px;
 
26
        color: #fff;
 
27
        font-size: 100%;
 
28
        margin: 0;
 
29
        padding: 0;
 
30
        text-align: left
 
31
}
 
32
 
 
33
#accomplishment-badge .icon {
 
34
        -moz-border-radius: 4px;
 
35
        -webkit-border-radius: 4px;
 
36
        background-color: #fff;
 
37
        border-radius: 4px;
 
38
        float: left;
 
39
        height: 100px;
 
40
        margin: 10px;
 
41
        padding: 10px
 
42
}
 
43
 
 
44
#accomplishment-badge p {
 
45
        font-size: 80%
 
46
}
 
47
 
 
48
#accomplishment-badge ul {
 
49
        margin-left: -40px
 
50
}
 
51
 
 
52
#accomplishment-more {
 
53
        -moz-border-radius: 4px;
 
54
        -webkit-border-radius: 4px;
 
55
  background: #fff;
 
56
  border: 1px solid #eee;
 
57
        border-radius: 4px;
 
58
        padding: 0
 
59
}
 
60
 
 
61
#accomplishment-more {
 
62
  background: #fff url("../media/circle.png") no-repeat -20px -30px;
 
63
}
 
64
 
 
65
#divider {
 
66
        border-right: 1px dotted #333
 
67
}
 
68
 
 
69
#tipspitfalls {
 
70
        -moz-border-radius: 4px;
 
71
        -webkit-border-radius: 4px;
 
72
        background-color: #eee;
 
73
        border: 0;
 
74
        border-radius: 4px;
 
75
        font-style: italic;
 
76
        margin: 0 auto;
 
77
        overflow: hidden;
 
78
        padding: 0
 
79
}
 
80
 
 
81
.alpha {
 
82
        margin-left: 0
 
83
}
 
84
 
 
85
.clear {
 
86
        clear: both;
 
87
        display: block;
 
88
        height: 0;
 
89
        overflow: hidden;
 
90
        visibility: hidden;
 
91
        width: 0
 
92
}
 
93
 
 
94
.clearfix:after {
 
95
        clear: both
 
96
}
 
97
 
 
98
.clearfix:before,.clearfix:after {
 
99
        content: '\00020';
 
100
        display: block;
 
101
        height: 0;
 
102
        overflow: hidden;
 
103
        visibility: hidden;
 
104
        width: 0
 
105
}
 
106
 
 
107
.container_8 {
 
108
        margin-left: auto;
 
109
        margin-right: auto;
 
110
        width: 696px
 
111
}
 
112
 
 
113
.container_8 .grid_1 {
 
114
        width: 67px
 
115
}
 
116
 
 
117
.container_8 .grid_2 {
 
118
        width: 154px
 
119
}
 
120
 
 
121
.container_8 .grid_3 {
 
122
        width: 241px
 
123
}
 
124
 
 
125
.container_8 .grid_4 {
 
126
        width: 328px
 
127
}
 
128
 
 
129
.container_8 .grid_5 {
 
130
        width: 415px
 
131
}
 
132
 
 
133
.container_8 .grid_6 {
 
134
        width: 502px
 
135
}
 
136
 
 
137
.container_8 .grid_7 {
 
138
        width: 589px
 
139
}
 
140
 
 
141
.container_8 .grid_8 {
 
142
        width: 676px
 
143
}
 
144
 
 
145
.container_8 .prefix_1 {
 
146
        padding-left: 87px
 
147
}
 
148
 
 
149
.container_8 .prefix_2 {
 
150
        padding-left: 174px
 
151
}
 
152
 
 
153
.container_8 .prefix_3 {
 
154
        padding-left: 261px
 
155
}
 
156
 
 
157
.container_8 .prefix_4 {
 
158
        padding-left: 348px
 
159
}
 
160
 
 
161
.container_8 .prefix_5 {
 
162
        padding-left: 435px
 
163
}
 
164
 
 
165
.container_8 .prefix_6 {
 
166
        padding-left: 522px
 
167
}
 
168
 
 
169
.container_8 .prefix_7 {
 
170
        padding-left: 609px
 
171
}
 
172
 
 
173
.container_8 .pull_1 {
 
174
        left: -87px
 
175
}
 
176
 
 
177
.container_8 .pull_2 {
 
178
        left: -174px
 
179
}
 
180
 
 
181
.container_8 .pull_3 {
 
182
        left: -261px
 
183
}
 
184
 
 
185
.container_8 .pull_4 {
 
186
        left: -348px
 
187
}
 
188
 
 
189
.container_8 .pull_5 {
 
190
        left: -435px
 
191
}
 
192
 
 
193
.container_8 .pull_6 {
 
194
        left: -522px
 
195
}
 
196
 
 
197
.container_8 .pull_7 {
 
198
        left: -609px
 
199
}
 
200
 
 
201
.container_8 .push_1 {
 
202
        left: 87px
 
203
}
 
204
 
 
205
.container_8 .push_2 {
 
206
        left: 174px
 
207
}
 
208
 
 
209
.container_8 .push_3 {
 
210
        left: 261px
 
211
}
 
212
 
 
213
.container_8 .push_4 {
 
214
        left: 348px
 
215
}
 
216
 
 
217
.container_8 .push_5 {
 
218
        left: 435px
 
219
}
 
220
 
 
221
.container_8 .push_6 {
 
222
        left: 522px
 
223
}
 
224
 
 
225
.container_8 .push_7 {
 
226
        left: 609px
 
227
}
 
228
 
 
229
.container_8 .suffix_1 {
 
230
        padding-right: 87px
 
231
}
 
232
 
 
233
.container_8 .suffix_2 {
 
234
        padding-right: 174px
 
235
}
 
236
 
 
237
.container_8 .suffix_3 {
 
238
        padding-right: 261px
 
239
}
 
240
 
 
241
.container_8 .suffix_4 {
 
242
        padding-right: 348px
 
243
}
 
244
 
 
245
.container_8 .suffix_5 {
 
246
        padding-right: 435px
 
247
}
 
248
 
 
249
.container_8 .suffix_6 {
 
250
        padding-right: 522px
 
251
}
 
252
 
 
253
.container_8 .suffix_7 {
 
254
        padding-right: 609px
 
255
}
 
256
 
 
257
.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8 {
 
258
        display: inline;
 
259
        float: left;
 
260
        margin-left: 10px;
 
261
        margin-right: 10px;
 
262
        position: relative
 
263
}
 
264
 
 
265
.left {
 
266
        float: left;
 
267
        margin-bottom: -1000px;
 
268
        padding-bottom: 1000px
 
269
}
 
270
 
 
271
.omega {
 
272
        margin-right: 0
 
273
}
 
274
 
 
275
.push_1,.pull_1,.push_2,.pull_2,.push_3,.pull_3,.push_4,.pull_4,.push_5,.pull_5,.push_6,.pull_6,.push_7,.pull_7,.push_8,.pull_8
 
276
        {
 
277
        position: relative
 
278
}
 
279
 
 
280
body {
 
281
        color: #333;
 
282
        font-family: Ubuntu, Times, serif;
 
283
        min-width: 696px
 
284
}
 
285
 
 
286
h2 {
 
287
        text-decoration: underline dotted
 
288
}
 
289
 
 
290
ol {
 
291
        font-size: 80%;
 
292
        padding: 5px 20px;
 
293
}
 
294
 
 
295
li {
 
296
    padding-bottom: 5px;
 
297
}
 
298
ul {
 
299
        font-size: 80%;
 
300
        font-style: italic
 
301
}
 
302
 
 
303
ul.none {
 
304
        list-style-type: none
 
305
}
 
306
 
 
307
div#howto ol{
 
308
  padding-top: 20px;
 
309
}
 
310
 
 
311
div#howto i{
 
312
  color: #fff;
 
313
  float: left;
 
314
  font-size: 3em;
 
315
}
 
316
 
 
317
div#howto h2{
 
318
  margin-left: 100px;
 
319
}