diff options
Diffstat (limited to 'src/scss/components/_input.scss')
-rw-r--r-- | src/scss/components/_input.scss | 29 |
1 files changed, 29 insertions, 0 deletions
diff --git a/src/scss/components/_input.scss b/src/scss/components/_input.scss new file mode 100644 index 0000000..e2d7338 --- /dev/null +++ b/src/scss/components/_input.scss | |||
@@ -0,0 +1,29 @@ | |||
1 | $input-padding : $baseline-x2 $baseline-x2; | ||
2 | $button-bgcolor : $color-blue; | ||
3 | $button-bgcolor-hover : darken($color-blue, 10%); | ||
4 | $button-color : $color-white; | ||
5 | $input-bgcolor : darken($color-white, 5%); | ||
6 | $button-radius : 3px; | ||
7 | |||
8 | $button-outline-padding : ( $baseline-x2 - 2 )( $baseline-x3 - 2 ); | ||
9 | $button-outline-bgcolor: transparent; | ||
10 | $button-outline-color: $color-blue; | ||
11 | $button-outline-color-hover: darken( $color-blue, 10% ); | ||
12 | |||
13 | .c-input { | ||
14 | padding: $input-padding; | ||
15 | display: inline-block; | ||
16 | font: inherit; | ||
17 | white-space: nowrap; | ||
18 | vertical-align: middle; | ||
19 | text-decoration: none; | ||
20 | background-color: $color-grey-light; | ||
21 | color: $color-black; | ||
22 | border-style: none; | ||
23 | border-color: grey; | ||
24 | border-radius: $button-radius; | ||
25 | } | ||
26 | |||
27 | .c-input:focus { | ||
28 | box-shadow: 0 0 2px 2px $button-bgcolor-hover; | ||
29 | } | ||