6033dc930b9e3aea54170526e2e9a9c1758746b5
[people/shoehn/ipfire.org.git] / static / scss / _donation.scss
1 .donation-card {
2         border-radius: 4px;
3         background-color: white;
4         box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.2);
5 }
6
7 .currency-dropdown,
8 .ownamount {
9         overflow: hidden;
10         width: 95%;
11         height: 48px;
12         padding: 0 16px;
13         border-radius: 2px;
14         border: none;
15 }
16
17 .dropdown-wrapper,
18 .ownamount {
19         background-color: rgba($blue-grey-900, .08);
20         border-bottom: 2px solid $blue-grey-900;
21         width: 90%;
22 }
23 .currency-dropdown {
24         background-color: transparent;
25         &:focus {
26                 outline: none;
27         }
28 }
29
30 .inline-card {
31         border-radius: 8px;
32         background-color: $blue-grey-50;
33         padding: 24px;
34 }
35
36 label.amount {
37         width: 84px;
38         height: 48px;
39         display: block;
40         background-color: white;
41         border-radius: 2px;
42         box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.16), 0 1px 2px 0 rgba(0, 0, 0, 0.23);
43         font-size: 20px;
44         color: $blue-400;
45         text-align: left;
46         margin: 0 8px 16px 8px;
47         padding-top: 8px;
48 }
49
50 input[name=amount] {
51         display: none;
52 }
53
54 input[name=amount]:checked + label {
55         background-image: linear-gradient(120deg, rgb(79, 195, 247), rgb(25, 118, 210));
56         color: white;
57 }