Mercurial > wikked

comparison static/css/wikked.less @ 149:d29e2f337b00

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Updated to Bootstrap 3.0.
author Ludovic Chabant <ludovic@chabant.com>
date Thu, 12 Dec 2013 21:54:04 -0800
parents 9d22cf4d2412
children ffb505cac9c8
comparison
equal deleted inserted replaced
148:f02e049d6546 149:d29e2f337b00
1 // Includes 1 // Start with Bootstrap.
2 @import "bootstrap.less"; 2 @import "../bootstrap/less/bootstrap.less";
3
4 // Now import our styles.
5 @import "wikked/base.less";
6 @import "wikked/main.less";
7 @import "wikked/page.less";
8 @import "wikked/alerts.less";
9
10 // End with other miscellaneous stuff.
3 @import "syntax.css"; 11 @import "syntax.css";
4 @import "wmd.css"; 12 @import "wmd.css";
5
6 // Constants
7 @colorBlue: #0F1FFF;
8 @colorBlueDark: #1D3982;
9 @colorOrange: #B03500;
10 @colorGreen: #B6CC95;
11 @colorGreenDark: #496B15;
12 @colorPage: #FFFFFF;
13 @colorFooter: #E5E7FF;
14 @colorCode: #523C37;
15
16
17 // Macros
18 .box-shadow(@style, @c) {
19 box-shadow: @style @c;
20 -webkit-box-shadow: @style @c;
21 -moz-box-shadow: @style @c;
22 }
23
24 // Main tags
25 body {
26 background: url('../img/gray_jean.png');
27 //background-image: url(http://basehold.it/i/27);
28 }
29
30 // Global classes
31 a {
32 text-decoration: none;
33 color: @colorBlue;
34 &:link { color: @colorBlue; }
35 &:visited { color: @colorBlue; }
36 &:hover { color: @colorBlue; text-decoration: underline; }
37 &:active { color: @colorBlue; }
38 }
39 a.wiki-link.missing,
40 a.wiki-meta-link.missing {
41 color: @colorOrange;
42 &:hover { color: @colorOrange; text-decoration: underline; }
43 }
44 .decorator {
45 text-transform: uppercase;
46 font-weight: lighter;
47 font-size: 0.7em;
48 letter-spacing: 0.1em;
49 color: @colorBlue;
50 .rev_id {
51 font-family: @monoFontFamily;
52 }
53 }
54 .tooltip {
55 font-size: @baseFontSize*0.75;
56 }
57 .alert {
58 font-size: @fontSizeSmall;
59 }
60
61 // Main classes
62 .wrapper>nav,
63 .wrapper>footer {
64 color: @grayLight;
65 font-size: @fontSizeSmall;
66 line-height: (@baseLineHeight * 2);
67
68 a {
69 padding: 0 1em;
70 display: inline-block;
71 text-decoration: none;
72 color: @grayLight;
73 &:link { color: @grayLight; }
74 &:visited { color: @grayLight; }
75 &:hover { color: @linkColorHover; }
76 &:active { color: @grayLight; }
77 }
78 }
79 .wrapper>article {
80 .box-shadow(0 0 10px, rgb(210, 210, 210));
81 background: @colorPage;
82 overflow: hidden;
83
84 header {
85 background: @colorBlueDark;
86 color: @colorPage;
87 }
88 footer {
89 background: @colorFooter;
90 border-top: 1px dashed darken(@colorFooter, 5%);
91 }
92 pre {
93 margin-top: @baseLineHeight;
94 }
95 }
96 .wrapper>article>header,
97 .wrapper>article>section,
98 .wrapper>article>footer {
99 padding: @baseLineHeight;
100 }
101 .wrapper>footer {
102 font-size: @fontSizeMini;
103 }
104 .special>article {
105 background: @colorGreen;
106 }
107 .special>article header {
108 background: @colorGreenDark;
109 }
110 .special>article footer {
111 background: @colorGreen;
112 }
113
114 // Search
115 form.form-search {
116 display: inline-block;
117 margin: 0;
118
119 .search-query {
120 font-size: @fontSizeSmall;
121 height: @fontSizeSmall * 1.5;
122 }
123 }
124 ul.search-results {
125 list-style: none;
126 }
127 b.match {
128 padding: 0 0.2em;
129 background: #ffeb84;
130 }
131
132 // Page editing
133 #page-edit {
134 textarea {
135 height: 10em;
136 font-size: @baseFontSize;
137 font-family: @monoFontFamily;
138 margin-bottom: 0;
139 border-radius: 0;
140 }
141 }
142 #wmd-form-wrapper>section {
143 margin: 1em;
144 }
145 #wmd-input-grip {
146 background: @grayLighter;
147 border: 1px solid @grayLight;
148 border-width: 0 1px 1px 1px;
149 height: 12px;
150 cursor: ns-resize;
151 }
152 #wmd-preview-button span {
153 background: url(../img/markdown-32x20.png);
154 width: 32px;
155 height: 20px;
156 }
157 /*#wmd-preview-wrapper {
158 border: 1px dashed @colorBlueDark;
159
160 h3 {
161 margin: 0.5em 1em 0.5em 1em;
162 }
163 #wmd-preview {
164 margin: 1em;
165 background: none;
166 }
167 }
168 #wmd-button-bar li {
169 margin-left: 0;
170 }*/
171 .preview-wiki-meta {
172 .meta-name {
173 background: @colorBlueDark;
174 color: @colorPage;
175 padding: 0.2em 0.4em 0.2em 0.6em;
176 border-radius: 0.5em 0 0 0.5em;
177 font-variant: small-caps;
178 letter-spacing: 0.18em;
179 }
180 .meta-value {
181 background: @colorFooter;
182 color: black;
183 padding: 0.2em 0.6em 0.2em 0.4em;
184 border-radius: 0 0.5em 0.5em 0;
185 }
186 }
187 .commit-meta {
188 margin-top: 1em;
189 margin-bottom: 1em;
190 }
191
192 // Page alerts
193 article .alert {
194 float: right;
195 margin-left: -100%;
196 position: relative;
197 width: 50%;
198 -webkit-border-radius: 0;
199 -moz-border-radius: 0;
200 border-radius: 0;
201 }
202
203 // Corner ribbon
204 .makeRibbon(@bgColor) {
205 background-color: @bgColor;
206 overflow: hidden;
207 transform: translate(50%, 0) translate(-3em, 2.05em) rotate(45deg);
208 -moz-transform: translate(50%, 0) translate(-3em, 2.05em) rotate(45deg);
209 -webkit-transform: translate(50%, 0) translate(-3em, 2.05em) rotate(45deg);
210 box-shadow: 0 0 1em rgba(0, 0, 0, 0.4);
211 -moz-box-shadow: 0 0 1em rgba(0, 0, 0, 0.4);
212 -webkit-box-shadow: 0 0 1em rgba(0, 0, 0, 0.4);
213 float: right;
214 }
215 .makeRibbonContent(@borderColor, @textColor) {
216 border: 1px solid @borderColor;
217 color: @textColor;
218 display: block;
219 margin: 0.05em 0 0.05em 0;
220 padding: 0.5em 5em;
221 text-align: center;
222 text-shadow: 0 0 0.5em rgba(1, 1, 1, 0.2);
223 }
224 .ribbon {
225 .makeRibbon(lighten(@colorOrange, 10%));
226 float: right;
227
228 .ribbon-inner {
229 .makeRibbonContent(@colorOrange, @colorPage);
230 a { color: #fff; text-decoration: none; }
231 }
232 }