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 }