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
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
|
// We need these to reset Bootstrap styles
// scss-lint:disable QualifyingElement
input,
input[type=email],
input[type=text],
input[type=password],
textarea {
&,
&:active,
&:invalid,
&:invalid:required,
&:focus,
&:active:focus,
&:invalid:focus,
&:invalid:required:focus {
box-shadow: none;
}
}
// scss-lint:enable QualifyingElement
textarea {
resize: vertical;
}
// Forms described here are only used on the public pages at the moment
.block-form {
margin: 20px auto;
fieldset {
margin-bottom: 1em;
position: relative; // To correctly place the entypo icon
input {
border-bottom-width: 0;
border-radius: 0;
color: $text-dark-grey;
margin: 0;
}
.form-control {
font-size: 16px;
height: 40px;
padding: 10px;
padding-left: 40px;
}
.form-control:first-of-type,
.form-control:first-of-type:focus,
.form-control:first-of-type:invalid,
.form-control:first-of-type:invalid:focus,
.form-control:first-of-type:invalid:required,
.form-control:first-of-type:invalid:required:focus {
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.form-control:last-of-type,
.form-control:last-of-type:focus,
.form-control:last-of-type:invalid,
.form-control:last-of-type:invalid:focus,
.form-control:last-of-type:invalid:required,
.form-control:last-of-type:invalid:required:focus {
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
border-bottom-width: 1px;
}
[class^="entypo-"],
[class*="entypo-"] {
color: $text-grey;
font-size: 20px;
left: 10px;
line-height: 20px;
position: absolute;
text-align: center;
top: 10px;
width: 20px;
}
[class^="entypo-"]:nth-of-type(2),
[class*="entypo-"]:nth-of-type(2) {
top: 50px;
}
[class^="entypo-"]:nth-of-type(3),
[class*="entypo-"]:nth-of-type(3) {
top: 90px;
}
[class^="entypo-"]:nth-of-type(4),
[class*="entypo-"]:nth-of-type(4) {
top: 130px;
}
::placeholder { text-transform: uppercase; }
p {
margin-top: .5rem;
text-align: center;
}
}
}
|