source: spip-zone/_themes_/spipr/v1/readable/css/bootswatch.less @ 69741

Last change on this file since 69741 was 69741, checked in by cedric@…, 8 years ago

Mise a jour et petits correctifs sur les themes

File size: 6.7 KB
Line 
1// Bootswatch.less
2// Swatch: Readable
3// Version: 2.1.1
4// -----------------------------------------------------
5
6// TYPOGRAPHY
7// -----------------------------------------------------
8
9body {
10        word-spacing: -0.05em;
11}
12
13code, pre {
14        .border-radius(0);
15        background-color: @white;
16}
17
18.muted, .help-block, .uneditable-input {
19        color: @grayLight;
20}
21blockquote, small {
22        color: @gray;
23}
24
25// SCAFFOLDING
26// -----------------------------------------------------
27
28.page-header {
29        border-bottom: 2px solid @grayLighter;
30}
31
32// NAVBAR
33// -----------------------------------------------------
34
35.navbar {
36
37        .brand {
38                font-weight: bold;
39                line-height: 1em;
40
41                &:hover {
42                        color: @linkColorHover;
43                }
44        }
45
46        .nav > li > a {
47                text-shadow: none;
48                padding: 15px 15px 7px;
49        }
50
51        .nav > .active > a,
52        .nav > .active > a:hover,
53        .nav > .active > a:focus {
54                .box-shadow(none);
55        }
56
57        .navbar-search {
58                margin-top: 11px;
59        }
60
61        .search-query {
62                border: 1px solid #D4D4D4;
63                .border-radius(0);
64                color: @textColor;
65                background-color: @white;
66        }
67
68        .navbar-text {
69                margin: 15px 15px 0;
70                line-height: @baseLineHeight;
71        }
72
73        .divider-vertical {
74                border-right: 1px solid rgba(128, 128, 128, 0.3);
75                border-left: none;
76        }
77
78        &-inverse {
79
80                .brand:hover {
81                        color: @white;
82                }
83        }
84}
85
86@media (max-width: @navbarCollapseWidth) {
87
88        .navbar .nav-collapse {
89
90                .nav li:first-child > a {
91                        margin-bottom: 10px;
92                }
93
94                .nav li > a {
95                        color: @linkColor;
96                        .border-radius(0);
97                        font-weight: normal;
98
99                        &:hover {
100                                background-color: rgba(0, 0, 0, 0.05);
101                                color: @linkColorHover;
102                        }
103                }
104
105                .navbar-form,
106                .navbar-search {
107                        border-top: 1px solid rgba(128, 128, 128, 0.2);
108                        border-bottom: 1px solid rgba(128, 128, 128, 0.2);
109                }
110
111                .nav-header {
112                        color: @grayLight;
113                }
114        }
115
116        .navbar-inverse .nav-collapse {
117
118                .nav li > a {
119                        color: @grayLighter;
120                }
121
122                .nav li > a:hover {
123                        background-color: rgba(0, 0, 0, 0.2) !important;
124                        color: @white;
125                }
126        }
127}
128
129div.subnav {
130
131        .box-shadow(none);
132        .border-radius(0);
133        background-color: @white;
134        background-image: none;
135
136        .nav {
137                padding: 0;
138        }
139
140        .nav > li.active > a,
141        .nav > li:active > a {
142                color: @linkColor;
143                .box-shadow(none);
144                background-color: transparent;
145        }
146
147        .nav > li > a:hover,
148        .nav > li.active > a:hover,
149        .nav > li:active > a:hover {
150                background-color: transparent;
151                .box-shadow(none);
152                color: @linkColorHover;
153        }
154
155        &-fixed {
156                top: @navbarHeight;
157        }
158}
159
160// NAV
161// -----------------------------------------------------
162
163.nav .dropdown .caret {
164        opacity: 1;
165}
166
167.nav-tabs {
168
169        li > a {
170                .border-radius(0);
171        }
172
173        li > a:hover {
174                background-color: @bodyBackground;
175        }
176
177        li.active > a,
178        li.active > a:hover {
179                color: @textColor;
180                background-color: @bodyBackground;
181        }
182}
183
184.nav-tabs.nav-stacked {
185
186        li > a {
187                background-color: @white;
188        }
189
190        li.active > a,
191        li.active > a:hover,
192        li > a:hover {
193                background-color: #F5F5F5;
194        }
195
196        li:first-child > a,
197        li:last-child > a {
198                .border-radius(0);
199        }
200}
201
202.nav-pills {
203
204        li > a {
205                .border-radius(0);
206        }
207
208        li > a:hover {
209                background-color: @bodyBackground;
210        }
211
212        li.active > a,
213        li.active > a:hover {
214                color: @textColor;
215                background-color: @bodyBackground;
216        }
217
218        .open .dropdown-toggle {
219                background-color: transparent;
220                color: @linkColor;
221                border-left: 1px solid whiteSmoke;
222                border-right: 1px solid #E5E5E5;
223        }
224
225
226        li.dropdown.open .dropdown-toggle .caret {
227                border-top-color: @linkColor;
228        }
229
230        li.dropdown.open .dropdown-toggle:hover .caret {
231                border-top-color: @linkColorHover;
232        }
233}
234
235.nav-list {
236
237        li > a:hover,
238        li.active > a,
239        li.active > a:hover {
240                background-color: transparent;
241                text-shadow: none;
242        }
243
244        li.active > a,
245        li.active > a:hover {
246                color: @textColor;
247        }
248
249        [class^="icon-"] {
250                margin-top: 3px;
251                opacity: 0.8;
252        }
253
254        .divider {
255                margin: 1px;
256        }
257}
258
259.breadcrumb {
260        .border-radius(0);
261        background-color: transparent;
262        background-image: none;
263    padding-left: 0;
264    padding-right: 0;
265}
266
267.pagination {
268
269        ul {
270                .box-shadow(none);
271        }
272
273        li > a {
274                padding: 10px 14px;
275        }
276
277
278        li.active > a,
279        li.active > a:hover {
280                color: @textColor;
281                background-color: #F5F5F5;
282        }
283
284        li > a,
285        li.disabled > a,
286        li.disabled > a:hover {
287                background-color: @white;
288        }
289
290        li:first-child > a,
291        li:last-child > a {
292                .border-radius(0);
293        }
294}
295
296.pager {
297
298        a {
299                .border-radius(0);
300        }
301}
302
303// BUTTONS
304// -----------------------------------------------------
305
306.btn-primary {
307  .buttonBackground(lighten(@btnPrimaryBackground, 10%), @btnPrimaryBackground);
308}
309
310.btn [class^="icon-"],
311.btn [class*=" icon-"] {
312        margin-top: 4px;
313}
314
315.btn-large [class^="icon-"],
316.btn-large [class*=" icon-"] {
317        margin-top: 6px;
318        margin-right: 2px;
319}
320
321.btn-small [class^="icon-"],
322.btn-small [class*=" icon-"] {
323        margin-top: 3px;
324}
325
326.btn .caret {
327        margin-top: 13px;
328}
329
330// TABLES
331// -----------------------------------------------------
332
333.table-bordered {
334        .border-radius(0);
335}
336
337.table-bordered thead:first-child tr:first-child th:first-child,
338.table-bordered tbody:first-child tr:first-child td:first-child {
339        .border-radius(0);
340}
341
342.table-bordered thead:last-child tr:last-child th:first-child,
343.table-bordered tbody:last-child tr:last-child td:first-child {
344        .border-radius(0);
345}
346
347// FORMS
348// -----------------------------------------------------
349
350input, button, select, textarea {
351        font-family: @baseFontFamily;
352}
353
354input, textarea, select {
355        color: @textColor;
356}
357
358select, input[type="file"] {
359        height: auto;
360        line-height: normal;
361}
362
363.form-actions {
364        border-top: 1px solid #D4D4D4;
365        padding-top: 2em;
366}
367
368// DROPDOWNS
369// -----------------------------------------------------
370
371.dropdown-menu {
372        border: 1px solid #D4D4D4;
373        .border-radius(0);
374        .box-shadow(1px 1px 1px rgba(0, 0, 0, 0.2));
375
376        .divider {
377                margin: 5px 1px;
378        }
379}
380
381// ALERTS, LABELS, BADGES
382// -----------------------------------------------------
383
384.alert,
385.label, .label:hover {
386        .border-radius(0);
387        border: 1px solid #D4D4D4;
388        color: @textColor;
389        text-shadow: none;
390}
391
392.alert-heading {
393        color: @textColor;
394        text-shadow: none;
395}
396
397.label, .label:hover {
398        background-color: @white;
399        font-weight: normal;
400        font-size: @baseFontSize;
401        padding: 4px;
402}
403
404.label-important, .label-important:hover { background-color: @errorBackground; }
405
406.label-warning, .label-warning:hover { background-color: @warningBackground; }
407
408.label-success, .label-success:hover { background-color: @successBackground; }
409
410.label-info, .label-info:hover { background-color: @infoBackground; }
411
412// MISC
413// -----------------------------------------------------
414
415.well, .hero-unit {
416        .box-shadow(none);
417        border: 1px solid #D4D4D4;
418        .border-radius(0);
419}
420
421.thumbnail {
422        background-color: @white;
423}
424
425.thumbnail,
426.thumbnail > img {
427        .border-radius(0);
428        .box-shadow(none);
429}
430
431.modal {
432        background-color: @white;
433        .border-radius(0);
434}
435
436.modal-header {
437        border-bottom: none;
438}
439
440.modal-footer {
441        background-color: @bodyBackground;
442}
443
444// MEDIA QUERIES
445// -----------------------------------------------------
Note: See TracBrowser for help on using the repository browser.