← Back to branch summary

~barryprice/junk/wp-theme-xubuntu-website

« back to all changes in this revision

Viewing changes to xubuntu-fifteen/style-resp-600.css

  • Committer: Pasi Lallinaho
  • Date: 2015-02-19 15:54:23 UTC
  • Revision ID: pasi@shimmerproject.org-20150219155423-bn9cm48kprfqmbgu
Add the "Xubuntu Fifteen" theme to the repository.

This theme is the new Xubuntu website default theme. It is based on "Xubuntu Fourteen", but since the visual changes are so dramatic, it should be a separate theme. Amongst other things, the new theme introduces responsive design for small-resolution devices.
The backend side of the two themes isn't that different; that said, a code review should be relatively simple.

This commit reverts the "Xubuntu Fourteen" theme to the state it was in revision 50; the last version that was pushed to production.

Show diffs side-by-side

added added

removed removed

Lines of Context:
xubuntu-fifteen/style-resp-600.css
 
1
/*  For screen sizes less than 600px wide  */
 
2
 
 
3
html {
 
4
        background-image: none;
 
5
}
 
6
 
 
7
body {
 
8
        padding-bottom: 0.3em;
 
9
}
 
10
 
 
11
#content, #header, #footer {
 
12
        width: 100%;
 
13
        border-radius: 0;
 
14
}
 
15
        #logo {
 
16
                margin: 1.2em 1.5em;
 
17
        }
 
18
        #navi {
 
19
                width: 100%;
 
20
                font-size: 100%;
 
21
        }
 
22
                #navi .navigation .sub-menu .current_page_item a {
 
23
                        background-color: inherit;
 
24
                        border-radius: 0;
 
25
                        box-shadow: none;
 
26
                }
 
27
 
 
28
#content_outer {
 
29
        padding: 0;
 
30
}
 
31
        body.attachment #content.air {
 
32
                padding-top: 1em;
 
33
        }
 
34
        #content.air {
 
35
                padding-bottom: 0;
 
36
        }
 
37
                #content.air div.gallery {
 
38
                        width: 95%;
 
39
                        margin: 0 auto;
 
40
                }
 
41
                #content.air .boxed {
 
42
                        border-radius: 0;
 
43
                }
 
44
                        #content.air h1.boxed {
 
45
                                margin-bottom: 0.5em;
 
46
                                box-shadow: inset 0 10px 5px -5px rgba( 0, 0, 0, 0.1 );
 
47
                        }
 
48
                        #content.air .gallery + .boxed {
 
49
                                margin-top: 1.5em;
 
50
                        }
 
51
 
 
52
        #main_outer {
 
53
                max-width: 100% !important;
 
54
                padding: 1.5em 0 0 0;
 
55
        }
 
56
                #main {
 
57
                        width: auto;
 
58
                        margin: 0 !important;
 
59
                        padding-right: 1.5em;
 
60
                        padding: 0 15px;
 
61
                }
 
62
                
 
63
                        #main .post-post {
 
64
                                max-width: 100%;
 
65
                        }
 
66
 
 
67
                        #main figure,
 
68
                        #main figure img,
 
69
                        #main img {
 
70
                                max-width: 100%;
 
71
                                height: auto;
 
72
 
 
73
                                padding: 0;
 
74
                                margin: 0;
 
75
                        }
 
76
                        #main figure figcaption {
 
77
                                margin-right: 0;
 
78
                        }
 
79
 
 
80
#footer_outer {
 
81
        border-top: none;
 
82
        padding: 0 1.5em;
 
83
        margin-top: 1.5em;
 
84
}
 
85
        #footer {
 
86
                padding: 0;
 
87
        }
 
88
                #footer .navigation {
 
89
                        border-bottom: 1px solid #ccc;
 
90
                }
 
91
 
 
92
                .navigation.nh .menu .menu-item-has-children {
 
93
                        width: 47% !important;
 
94
                }
 
95
                        .navigation.nh .menu .menu-item-has-children:nth-child(3n+3) {
 
96
                                margin-right: 2%;
 
97
                                border-right: 1px solid rgba( 0, 0, 0, 0.10 );
 
98
                        }
 
99
                        .navigation.nh .menu .menu-item-has-children:nth-child(even) {
 
100
                                margin-right: 0;
 
101
                                border-right: none;
 
102
                        }
 
103
 
 
104
                        /* If a menu in the first column is the last one,
 
105
                         * fill the rest of the space to keep preferred alignment
 
106
                         */
 
107
                        .navigation.nh .menu .menu-item-has-children:last-child:nth-child(2n+1) {
 
108
                                margin-right: 51%;
 
109
                        }
 
110
 
 
111
/*  Home page  */
 
112
body.home #main {
 
113
        width: 90%;
 
114
        margin: 0 auto !important;
 
115
}
 
116
 
 
117
        body.home .widgets {
 
118
                width: auto;
 
119
        }
 
120
 
 
121
/*  Attachments  */
 
122
#attachment {
 
123
        width: 95%;
 
124
        margin: 0.5em auto;
 
125
}
 
126
        #attachment_navi {
 
127
                font-size: 90%;
 
128
                margin-bottom: 0;
 
129
        }
 
130
        body.attachment .boxed {
 
131
                padding: 1em 0;
 
132
                margin: 1em 0 -1em 0;
 
133
        }
 
134
        body.attachment .boxed {
 
135
                margin-bottom: 1em;
 
136
        }
 
137
 
 
138
 
 
139
/*  Elements and templates  */
 
140
blockquote {
 
141
        max-width: 90%;
 
142
}
 
143
 
 
144
figure {
 
145
        width: 100% !important;
 
146
        text-align: center;
 
147
}
 
148
        #content figure a {
 
149
                max-width: 100% !important;
 
150
        }
 
151
 
 
152
        .gallery figure {
 
153
                width: 100%; !important;
 
154
                padding: 0;
 
155
                margin: 0;
 
156
        }
 
157
 
 
158
        #content.air .gallery-item {
 
159
                margin: 0 0 0.5em 0;
 
160
        }
 
161
 
 
162
ul.columnlist {
 
163
        -moz-column-gap: 1em;
 
164
        -webkit-column-gap: 1em;
 
165
        column-gap: 1em;
 
166
 
 
167
        -moz-column-count: 2;
 
168
        -webkit-column-count: 2;
 
169
        column-count: 2;
 
170
}
 
171
 
 
172
#main figure,
 
173
#main figure img,
 
174
#main img {
 
175
        margin-top: 0.5em;
 
176
        margin-bottom: 0.5em;
 
177
}
 
178
 
 
179
.boxed {
 
180
        padding-right: 15px !important;
 
181
        padding-left: 15px !important;
 
182
}
 
183
 
 
184
.hb {
 
185
        padding: 0;
 
186
        margin-right: -15px !important;
 
187
}
 
188
 
 
189
 
 
190
/*  WordPress admin bar  */
 
191
#wpadminbar, #wp-toolbar {
 
192
        display: none;
 
193
}
 
194
 
 
195
body.admin-bar {
 
196
        margin-top: -46px !important;
 
197
}
 
198
 
 
199
/*  Navigation  */
 
200
.navigation.nd {
 
201
        border-left: none;
 
202
        margin-bottom: -1px;
 
203
}
 
204
        .navigation.nd .menu {
 
205
                border-top: 1px solid rgba( 0, 0, 0, 0.2 );
 
206
        }
 
207
                .navigation.nd .menu li {
 
208
                        float: none;
 
209
                        width: 100%;
 
210
                        height: auto;
 
211
 
 
212
                        position: static;
 
213
                }
 
214
                        .navigation.nd .menu > li {
 
215
                                border: none;
 
216
                                border-top: 1px solid rgba( 255, 255, 255, 0.2 );
 
217
                                border-bottom: 1px solid rgba( 0, 0, 0, 0.2 );
 
218
                        }
 
219
                                .navigation.nd .menu > li:hover > a {
 
220
                                        padding-bottom: 0.5em;
 
221
                                        background: none;
 
222
                                }
 
223
 
 
224
                        .navigation.nd .menu .sub-menu {
 
225
                                position: static;
 
226
                                border-radius: 0;
 
227
 
 
228
                                background-color: #fff !important;
 
229
                        }
 
230
                                .navigation.nd .menu li:hover .sub-menu {
 
231
                                        display: none;
 
232
                                }
 
233
 
 
234
                                .navigation.nd .menu li.current_page_ancestor:hover .sub-menu,
 
235
                                .navigation.nd .menu li.current_page_ancestor .sub-menu {
 
236
                                        display: block;
 
237
                                        position: static;
 
238
                                        margin: 0;
 
239
                                        padding: 0;
 
240
                                }
 
241
                                        .navigation.nd .menu li .sub-menu:after {
 
242
                                                content: "";
 
243
                                                display: block;
 
244
                                                height: 0;
 
245
                                                clear: both;
 
246
                                                visibility: hidden;
 
247
                                        }
 
248
                                        .navigation.nd .menu li .sub-menu li {
 
249
                                                float: left;
 
250
                                                display: block;
 
251
                                                width: 50%;
 
252
                                                margin: 0 !important;
 
253
                                        }
 
254
                                                .navigation.nd .sub-menu li:first-child {
 
255
                                                        padding-left: 0;
 
256
                                                }
 
257
                                                .navigation.nd .menu li .sub-menu li a {
 
258
                                                        display: block;
 
259
                                                        width: 90%;
 
260
                                                        padding: 0.25em 1em;
 
261
                                                }
 
262
 
 
263
.navigation.nd .menu li { display: none; }
 
264
.navigation.nd .menu li.current-menu-ancestor,
 
265
.navigation.nd .menu li.open { display: block; }
 
266
 
 
267
#navi.open .navigation.nd .menu li.current-menu-ancestor-hidden .sub-menu { display: none; }
 
268
#navi.open .navigation.nd .menu li { display: block; }
 
269
 
 
270
/*  JS popup navigation  */
 
271
#opennavi {
 
272
        position: relative;
 
273
        display: block;
 
274
        height: 0;
 
275
        top: 0;
 
276
 
 
277
        margin-top: -3em;
 
278
        margin-right: -12px;
 
279
 
 
280
        padding: 4px 4px 0 0;
 
281
 
 
282
        width: 32px;
 
283
        height: 32px;
 
284
 
 
285
        overflow: hidden;
 
286
 
 
287
        background: transparent url(images/menu.png) 0 2px no-repeat;
 
288
}
 
289
        #navi .expand {
 
290
                display: none;
 
291
 
 
292
                position: relative;
 
293
                right: 2px;
 
294
                top: 0;
 
295
 
 
296
                float: right;
 
297
                z-index: 2000;
 
298
 
 
299
                height: 2.5em;
 
300
                width: 2.5em;
 
301
                padding: 0;
 
302
 
 
303
                background: transparent url(images/menu_arrow.png) 0 2px no-repeat;
 
304
        }
 
305
                #navi.open .expand {
 
306
                        display: block;
 
307
                        transition: 200ms transform;
 
308
                }
 
309
        #navi .open-sub .sub-menu {
 
310
                display: block !important;
 
311
                margin: 0;
 
312
                padding: 0;
 
313
        }
 
314
 
 
315
        #navi .open-sub .expand {
 
316
/*              transform: rotate( -90deg ); */
 
317
                background-image: none;
 
318
        }
 
319
 
 
320
/*  Featured images  */
 
321
 
 
322
.featured {
 
323
        width: 92%;
 
324
        margin: 0 auto;
 
325
}
 
326
 
 
327
/*  Clear all floats and center-align
 
328
 *
 
329
 */
 
330
#main figure[style*="float"],
 
331
.alignleft,
 
332
.alignright,
 
333
.aligncenter {
 
334
        display: block;
 
335
        float: none !important;
 
336
        text-align: center;
 
337
        margin: 0 auto !important;
 
338
}
 
 
b'\\ No newline at end of file'