source/_assets/sass/_mailchimp.scss


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78

#mc_embed_signup {
    @apply .w-full;

    // increase selector specificity for
    // in-line errors
    div.mc-field-group {
        > div.mce_inline_error {
            @apply .bg-transparent;
            @apply .float-left;
            @apply .font-semibold;
            @apply .p-0;
            @apply .text-gray-800;

            clear: both;
        }
    }

    @screen md {
        @apply .w-2/3;
    }

    @screen lg {
        @apply .w-1/2;
    }
}

#mc_embed_signup_scroll {
    > h2:first-of-type {
        @apply .block;
        @apply .mb-6;
        @apply .text-2xl;
        @apply .text-center;
        @apply .text-gray-900;
    }
}

.mc-field-group {
    input {
        @apply .float-left;
        @apply .leading-normal;
        @apply .mb-6;
        @apply .outline-none;
        @apply .px-4;
        @apply .py-2;
        @apply .rounded-l;
        @apply .w-2/3;

        @screen md {
            @apply .mb-3;
            @apply .rounded-l;
            @apply .rounded-r-none;
            @apply .w-3/4;
        }
    }

    label {
        @apply .hidden;
    }
}

#mc-embedded-subscribe {
    @apply .bg-blue-500;
    @apply .cursor-pointer;
    @apply .leading-normal;
    @apply .px-6;
    @apply .py-2;
    @apply .rounded-r;
    @apply .text-white;
    @apply .w-1/3;

    &:hover {
        @apply .bg-blue-600;
    }

    @screen md {
        @apply .w-1/4;
    }
}