Mercurial > wikked
comparison docs/assets/css/wikked.less @ 382:3a61f45702cb
docs: Add documentation site.
author | Ludovic Chabant <ludovic@chabant.com> |
---|---|
date | Sun, 04 Oct 2015 08:02:43 -0700 |
parents | |
children | dcaa41b39c23 |
comparison
equal
deleted
inserted
replaced
381:d5511d832af3 | 382:3a61f45702cb |
---|---|
1 // Import Pure. | |
2 @import (less) "../../bower_components/pure/pure.css"; | |
3 | |
4 // Import Font-Awesome. | |
5 @import "../../bower_components/font-awesome/less/font-awesome.less"; | |
6 | |
7 // Import stuff from the wikked package. | |
8 @wikked-path: "../../../wikked/assets/css"; | |
9 | |
10 // Import basic variables and mixins. | |
11 @import "@{wikked-path}/wikked/base.less"; | |
12 | |
13 // Now import our styles. | |
14 @import "@{wikked-path}/wikked/nav.less"; | |
15 @import "@{wikked-path}/wikked/main.less"; | |
16 @import "@{wikked-path}/wikked/page.less"; | |
17 | |
18 // Code sections. | |
19 .highlight pre { | |
20 color: @code-color; | |
21 background: @code-bg; | |
22 padding: 1em 0.5em; | |
23 } | |
24 | |
25 // Quotes with a nice icon. | |
26 blockquote { | |
27 padding: 1em; | |
28 margin: 1em 0; | |
29 min-height: 220px; | |
30 color: lighten(@color-gray-dark, 3%); | |
31 background: darken(@color-gray-light, 5%); | |
32 | |
33 p { | |
34 margin-left: 170px; // width/height of the "toto" image: 145x200 | |
35 } | |
36 p:first-child::before { | |
37 content: " "; | |
38 background-image: url('../img/toto.png'); | |
39 background-repeat: no-repeat; | |
40 background-position: left center; | |
41 display: block; | |
42 float: left; | |
43 margin-left: -170px; | |
44 margin-top: -1em; | |
45 width: 150px; | |
46 height: 220px; | |
47 } | |
48 } | |
49 | |
50 // Make room for the home shortcut. | |
51 // (it's different from the wiki shortcut) | |
52 .wrapper.wiki-docs { | |
53 padding-top: @wiki-shortcut-width !important; | |
54 padding-left: 0 !important; | |
55 } | |
56 #wiki-menu ul:first-child { | |
57 margin-top: 3.8em; | |
58 } | |
59 | |
60 // Collapse by default | |
61 #wiki-menu { | |
62 left: -@wiki-menu-width !important; | |
63 } | |
64 | |
65 // TODO: remove this by using the same version of PureCSS. | |
66 #wiki-menu li a { | |
67 .wiki-menu-a(); | |
68 display: block; | |
69 line-height: 1.5em; | |
70 | |
71 &:hover { | |
72 .wiki-menu-a-hover(); | |
73 } | |
74 } | |
75 | |
76 // Docs want wider articles. | |
77 .wiki-docs article, | |
78 .wiki-docs header { | |
79 max-width: 1024px; | |
80 margin: 0 auto; | |
81 padding: 0 1em; | |
82 } | |
83 | |
84 // Big headers. | |
85 .wiki-docs header h1 { | |
86 font-size: 3em; | |
87 } | |
88 .wiki-docs header.header-bg { | |
89 background-repeat: no-repeat; | |
90 background-position: center center; | |
91 background-size: cover; | |
92 margin-top: -@wiki-shortcut-width; | |
93 margin-bottom: 2em; | |
94 padding: 8em 2em 1em 3.5em; | |
95 max-width: 100%; | |
96 | |
97 h1 { | |
98 color: #fff; | |
99 } | |
100 } | |
101 | |
102 @media screen and (min-width: 48em) { | |
103 // Visible menu by default on big screens. | |
104 .wrapper.wiki-docs { | |
105 padding-top: 0 !important; | |
106 padding-left: @wiki-menu-width !important; | |
107 } | |
108 #wiki-menu { | |
109 left: 0 !important; | |
110 } | |
111 | |
112 .wiki-docs article, | |
113 .wiki-docs header { | |
114 padding: 0 2em; | |
115 } | |
116 | |
117 .wiki-docs header h1 { | |
118 font-size: 4em; | |
119 } | |
120 | |
121 .wiki-docs header.header-bg { | |
122 padding-top: 10em; | |
123 padding-left: 4.5em; | |
124 } | |
125 } |