_objects.text-input.scss

Source code

View source

Author

Dennis Heibuelt

Package Name

inuit-text-input

Version

0.2.0

Dependences

Simple, text-type inputs.

Markup
Demo
Modifiers
Settings

        <div>
            <input type="text" class="o-text-input">
        </div>

.o-text-input

see HTML code

    <input type="text" class="o-text-input">

.o-text-input--small

see HTML code

    <input type="text" class="o-text-input--small">

.o-text-input--large

see HTML code

    <input type="text" class="o-text-input--large">

The flag object provides the following modifiers:

.o-text-input--small (Compressed text inputs)
.o-text-input--large (Tall text inputs)

                $inuit-text-input-namespace:            $inuit-namespace !default;
                
                $inuit-text-input-height:               double($inuit-base-spacing-unit) !default;
                $inuit-text-input-height--small:        halve($inuit-text-input-height) !default;
                $inuit-text-input-height--large:        double($inuit-text-input-height) !default;
                
                $inuit-text-input-padding:              halve($inuit-base-spacing-unit) !default;
                $inuit-text-input-padding--small:       halve($inuit-text-input-padding) !default;
                $inuit-text-input-padding--large:       double($inuit-text-input-padding) !default;
                
                $inuit-text-input-background:           #fff !default;
                $inuit-text-input-text-color:           $inuit-base-text-color !default;
                $inuit-text-input-border-width:         1px !default;
                $inuit-text-input-border-color:         #ccc !default;
                $inuit-text-input-border-style:         solid !default;
                $inuit-text-input-border-radius:        0 !default;
                
                $inuit-enable-text-input--small:        false !default;
                $inuit-enable-text-input--large:        false !default;
                $inuit-enable-textarea:                 false !default;