13c6ce06278c5d4a79745a2390b2b10c57319749
[wolnelektury.git] / apps / funding / static / funding / funding.scss
1 .funding {
2     background: orange;
3     margin: auto;
4     padding: 5px 0;
5     position: relative;
6     a.call {
7         height: 1.2em;
8         width: 9em;
9         padding: .35em .5em;
10         margin: .5em;
11         display: inline-block;
12         vertical-align: top;
13         text-align: center;
14
15         background: lighten(#018189, .05);
16     }
17     .description {
18         display: inline-block;
19         padding-left: .6em;
20         a {
21             display: block;
22             color: black;
23             padding: 0 3px;
24         }
25     }
26     strong {
27         font-size: 1.5em;
28         padding: .2em 0 0;
29         //display: block;
30     }
31     .progress {
32         .piece {
33             font-size: 1.3em;
34             padding: .3em .5em;
35         }
36         width: 95.7em;
37         margin: .3em 0 .4em;
38         border-radius: 2em;
39         background-image: url(/static/img/progress-pixel.png);
40         background-repeat: repeat-y;
41         background-color: mix(#ec6d00, orange, .5);
42         box-shadow: .1em .1em .1em #888;
43     }
44     .with-button .progress {
45         width: 78em;
46     }
47     
48     .funding-title {
49         font-size: 1.1em;
50     }
51     .funding-title-strong {
52         @extend .funding-title;
53         font-weight: bold;
54         font-size: 1.5em;
55     }
56     .close {
57         position: absolute;
58         top: 0px;
59         right: 5px;
60     }
61 }
62
63 .funding-top-header {
64     @extend .funding;
65     width: 97.5em;
66 }
67
68
69 .wlfund {
70     width: 100%;
71     border-spacing:0;
72
73     td {
74         padding: 1em .5em 1em;
75         text-align: center;
76         border-top: 1em solid rgba(255, 255, 255, 0);
77         border-bottom: 2px solid #DDDDDD;
78
79         background-clip: padding-box;
80         -moz-background-clip: padding;
81         -webkit-background-clip: padding;
82     }
83     td.oneline {
84         white-space: nowrap;
85     }
86
87     td:last-child {
88         text-align: right;
89     }
90
91     .funding-plus td {
92         background-color: mix(#0D7E85, white, .2);
93     }
94
95     .funding-minus td {
96         background-color: white;
97     }
98 }
99
100
101
102 .honking {
103     background: #018189;
104     font-size: 1.5em;
105     padding: .5em;
106     color: white;
107     border: 0;
108     box-shadow: 0.2em 0.2em 0.3em #888888;
109     position: relative;
110 }
111 .honking:hover {
112     box-shadow: none;
113     top: .1em;
114     left: .1em;
115 }
116
117
118
119 .share {
120     a {
121         margin-right: 1.5em;
122
123         img {
124             vertical-align: middle;
125         }
126     }
127 }
128
129 .funding-handle {
130     position: absolute;
131     top: 0;
132     right: 0;
133     z-index:2;
134     background: orange;
135     cursor:pointer;
136     padding: .2em 1em;
137     border-radius: 0 0 0 1em;
138     font-size: 13px;
139 }
140
141 .funding-cover {
142     float:left;
143     margin-right: 10px;
144 }
145
146 .funding-details-intro {
147     padding-top: 1em;
148     
149     h3:first-of-type {
150         margin-top: 0;
151     }
152 }