blob: 545b23ee7fd9da6b2964c6c2cccb4091ba528ca5 [file] [log] [blame]
Michael Landoefa037d2017-02-19 12:57:33 +02001.form-group {
2 .control-label {
3 @extend .body-2-medium;
4 }
5 &.required {
6 label:before {
7 content: "*";
8 color: $red;
9 margin: 0 4px 0 0;
10 }
11 }
12}
13.form-control {
14 @extend .body-1;
15 border-radius: 2px;
16 height: 30px;
17 @include box-shadow(none);
18 &:focus {
19 @include box-shadow(none);
20 }
21 &:hover {
22 border-color: $gray;
23 }
24}
25
26label {
27 @extend .body-3;
28 margin-bottom: 8px;
29}
30
31select.form-control {
32 display: block;
33 width: 215px;
34}
35
36select[multiple] {
37 background: none;
38}
39
40input[type="radio"], input[type="checkbox"] {
41 margin: 0;
42
43 &:before {
44 content: "";
45 display: inline-block;
46 width: 11px;
47 height: 11px;
48 margin-right: 10px;
49 position: absolute;
50 background-color: $white;
51 border: 1px solid $blue;
52 box-sizing: content-box;
53 }
54}
55
56.radio label {
57 font-weight: normal;
58 display: inline-block;
59 cursor: pointer;
60 margin-right: $body-font-1;
61 font-size: $body-font-1;
62}
63
64.checkbox label {
65 font-weight: normal;
66 display: inline-block;
67 cursor: pointer;
68 margin-right: $body-font-1;
69 font-size: $body-font-1;
70}
71
72.radio input:before {
73 border-radius: 8px;
74}
75
76.checkbox input:before {
77 border-radius: 2px;
78}
79
80input[type=radio]:checked:before {
81 content: "\2022";
82 color: $blue;
83 font-size: 30px;
84 text-align: center;
85 line-height: 11px;
86 font-family: $radio-font-family;
87}
88
89input[type=checkbox]:checked:before {
90 font-family: $icon-font-family;
91 content: "\f00c";
92 font-size: $icon-font-size;
93 color: $blue;
94 text-align: center;
95}
96
97.radio,
98.checkbox {
99 margin-top: 0px;
100 margin-bottom: 0px;
101}
102
103.radio input[type="radio"],
104.radio-inline input[type="radio"],
105.checkbox input[type="checkbox"],
106.checkbox-inline input[type="checkbox"] {
107 position: absolute;
108 margin-left: -20px;
109 top: 2px;
110}