Cleaning: timezone issues, deprecated urls.py imports, missing notes.
[wolnelektury.git] / apps / wolnelektury_core / static / scss / funding / funding.scss
1 .funding {
2     background: orange;
3     margin: auto;
4     @include size(padding, 5px 0);
5     position: relative;
6     .close {
7         @include size(font-size, 10px);
8     }
9     .call-area {
10         float:left;
11         @include size(padding-right, 6px);
12     }
13     a.call {
14         @include size(height, 18px);
15
16         @include size(padding, 5.25px 7.5px);
17         @include size(margin, 7.5px);
18         display: inline-block;
19         vertical-align: middle;
20         text-align: center;
21
22         background: lighten(#018189, .05);
23         @include size(width, 135px);
24
25         @include min-screen(420px) {
26             vertical-align: top;
27         }
28     }
29     .learn-more {
30         text-align: center;
31         margin: auto;
32         @include size(font-size, 10px);
33         padding: .5em;
34         
35         @include min-screen(300px) {
36             display: inline;
37         }
38         @include min-screen(420px) {
39             padding: 0;
40             display: block;
41         }
42     }
43     .description {
44         @include size(padding-left, 6px);
45
46         a {
47             display: block;
48             color: black;
49             @include size(padding, 0 3px);
50         }
51     }
52     strong {
53         @include size(font-size, 15px);
54         @include size(padding, 3px 0 0);
55     }
56     .progress {
57         .piece {
58             @include size(font-size, 13px);
59             @include size(padding, 4px 6px);
60         }
61         @include size(margin, 3px 12px 4px 0);
62         @include size(border-radius, 20px);
63         background-image: url(/static/img/progress-pixel.png);
64         background-repeat: repeat-y;
65         background-color: #F68900;
66         @include box-shadow(1px 1px 1px #888);
67
68         .progress-collected {
69             float:left;
70             &:after {
71                 content: " / ";
72             }
73             @include min-screen(500px) {
74                 &:after {
75                     content: none;
76                 }
77             }
78         }
79         .progress-target {
80             float: left;
81             padding-left: 0;
82             @include min-screen(500px) {
83                 float: right;
84                 @include size(padding-left, 6px);
85             }
86         }
87         .progress-extralabel {
88             display: none;
89             @include min-screen(500px) {
90                 display: inline;
91             }
92         }
93         .progress-until {
94             display: inline-block;
95             margin-right: 0em;
96             text-align: right;
97             @include min-screen(500px) {
98                 text-align: center;
99             }
100         }
101     }
102     .with-button {
103         clear: left;
104         @include min-screen(420px) {
105             clear: none;
106             @include size(margin-left, 171px);
107         }
108     }
109
110     .funding-title {
111         @include size(font-size, 11px);
112         display: block;
113         @include min-screen(640px) {
114             display: inline;
115         }
116     }
117     .funding-title-strong {
118         @extend .funding-title;
119         font-weight: bold;
120         @include size(font-size, 15px);
121     }
122     .close {
123         position: absolute;
124         top: 0px;
125         @include size(right, 5px);
126     }
127 }
128
129 .funding-top-header {
130     @extend .funding;
131
132     @include min-screen(1000px) {
133         @include size(width, 975px);
134     }
135 }
136
137
138 .wlfund {
139     width: 100%;
140     border-spacing:0;
141
142     td {
143         @include size(padding, 10px 5px 10px);
144         text-align: center;
145         @include size(border-top, 10px solid rgba(255, 255, 255, 0));
146         @include size(border-bottom, 2px solid #DDDDDD);
147
148         background-clip: padding-box;
149         -moz-background-clip: padding;
150         -webkit-background-clip: padding;
151     }
152     td.oneline {
153         white-space: nowrap;
154     }
155
156     td:last-child {
157         text-align: right;
158     }
159
160     .funding-plus td {
161         background-color: mix(#0D7E85, white, .2);
162     }
163
164     .funding-minus td {
165         background-color: white;
166     }
167 }
168
169
170
171 .honking {
172     background: #018189;
173     @include size(font-size, 15px);
174     @include size(padding, 7.5px);
175     color: white;
176     border: 0;
177     @include box-shadow(3px 3px 4.5px #888888);
178     position: relative;
179 }
180 .honking:hover {
181     @include box-shadow(none);
182     @include size(top, 1px);
183     @include size(left, 1px);
184 }
185
186
187
188 .share {
189     a {
190         @include size(margin-right, 15px);
191
192         img {
193             vertical-align: middle;
194         }
195     }
196 }
197
198 .funding-handle {
199     position: absolute;
200     top: 0;
201     right: 0;
202     z-index: 2;
203     background: orange;
204     cursor: pointer;
205     @include size(padding, 2.6px 13px);
206     @include size(border-radius, 0 0 0 10px);
207     @include size(font-size, 13px);
208 }
209
210 .funding-cover {
211     float: left;
212     @include size(margin-right, 10px);
213 }
214
215 .funding-details-intro {
216     @include size(padding-top, 10px);
217     
218     h3:first-of-type {
219         margin-top: 0;
220     }
221 }