<commit_before>#VUI Inputs [![Build Status](https://travis-ci.org/Desire2Learn-Valence/valence-ui-input.svg?branch=master)](https://travis-ci.org/Desire2Learn-Valence/valence-ui-input)

This library contains a series of LESS mixins and CSS which can be used to
style form inputs.

##Usage

Install as a development dependency:

```shell
npm install --save-dev vui-input
```

##LESS Mixins

To make use of the LESS mixins, first import the library into your LESS file:

```css
@import 'node_modules/vui-input/input'
```

Styles can be applied to `<input>`, `<textarea>` and `<select>` elements
using the `vui-input` mixin:

```css
input[type="text"],
input[type="password"],
input[type="email"],
input[type="url"],
textarea,
select {
  .vui-input();
}
```

```html
<input type="text" />
<input type="password" />
<input type="email" />
<input type="url" />
<textarea></textarea>
<select></select>
```

##CSS

If you'd prefer to use CSS, bundle up the provided `input.css` file with
your application's CSS. Then apply the `vui-input` CSS class to elements:

```html
<input class="vui-input" type="text" />
<input class="vui-input" type="password" />
<input class="vui-input" type="email" />
<input class="vui-input" type="url" />
<textarea class="vui-input"></textarea>
<select class="vui-input"></select>
```

##Selects

Styles can be applied to `<select>` elements by adding the .vui-input class.

```css
@import 'node_modules/vui-button/dist/label'

.myFieldRow > label {
	.vui-label();
}
```

```html
<div class="myFieldRow">
    <label for="name">Name</label>
    <input type="text" id="name" />
</div>
```

Or, with CSS instead using the `vui-label` class:

```html
<div class="vui-field-row">
    <label class="vui-label" for="name">Name</label>
    <input type="text" id="name" />
</div>
```

##Building<commit_msg>Removing section on <select><commit_after>#VUI Inputs [![Build Status](https://travis-ci.org/Desire2Learn-Valence/valence-ui-input.svg?branch=master)](https://travis-ci.org/Desire2Learn-Valence/valence-ui-input)

This library contains a series of LESS mixins and CSS which can be used to
style form inputs.

##Usage

Install as a development dependency:

```shell
npm install --save-dev vui-input
```

##LESS Mixins

To make use of the LESS mixins, first import the library into your LESS file:

```css
@import 'node_modules/vui-input/input'
```

Styles can be applied to `<input>`, `<textarea>` and `<select>` elements
using the `vui-input` mixin:

```css
input[type="text"],
input[type="password"],
input[type="email"],
input[type="url"],
textarea,
select {
  .vui-input();
}
```

Here's what your corresponding HTML would look like:
```html
<input type="text" />
<input type="password" />
<input type="email" />
<input type="url" />
<textarea></textarea>
<select></select>
```

##CSS

If you'd prefer to use CSS, bundle up the provided `input.css` file with
your application's CSS. Then apply the `vui-input` CSS class to elements:

```html
<input class="vui-input" type="text" />
<input class="vui-input" type="password" />
<input class="vui-input" type="email" />
<input class="vui-input" type="url" />
<textarea class="vui-input"></textarea>
<select class="vui-input"></select>
```

##Building
{'fraction_non_alphanumeric': 0.1826086956521739, 'fraction_numerical': 0.0012422360248447205, 'mean_word_length': 5.077358490566038, 'pattern_counts': {'":': 0, '<': 53, '<?xml version=': 0, '>': 54, 'https://': 4, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '30034', 'n_tokens_mistral': 1159, 'n_tokens_neox': 1099, 'n_words': 314}