Input
Input component pack for Seed
Install
npm install seed-input --save
Dependencies
Example
<input class="c-input" placeholder="Hello" value="Hellooo">Selects
.c-input can be used to stylize <select> elements.
<select class="c-input">
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>
</select>Sizes
Small
<input class="c-input c-input--sm" placeholder="Hello" value="Hellooo">Medium
<input class="c-input c-input--md" placeholder="Hello" value="Hellooo">Large
<input class="c-input c-input--lg" placeholder="Hello" value="Hellooo">Configurations
Below are the default Sass configuration variables for seed-input. The variables can be found in the pack’s _config.scss file.
seed-input/_config.scss// Dependencies
@import "pack/seed-border/config";
// Namespaces
$seed-input-namespace: "c-input" !default;
// Configs
$seed-input-border-color: #d5d5d5 !default;
$seed-input-border-radius: $seed-border-radius !default;
$seed-input-border-size: $seed-border-size !default;
$seed-input-border-style: solid !default;
$seed-input-border-color-focus: #3197D6 !default;
$seed-input-background-color-disabled: #e6e6e6;
$seed-input-padding: 0 8px !default;
$seed-input-padding-textarea: 8px !default;