SPSTRAP Document API

인풋 사이즈

<div class="sp--form"
                                theme="xs"
                            >
                                <input type="text" value="xs" /><br />
                                <trickarea>xs textarea</trickarea>
                            </div>

disabled, readonly
                            <div class="sp--form"
                                theme="sm"
                            >
                                <input type="text" value="sm" disabled /><br />
                                <trickarea readonly>sm textarea</trickarea>
                            </div>

<div class="sp--form"
                                theme="md"
                            >
                                <input type="text" value="md" /><br />
                                <trickarea>md textarea</trickarea>
                            </div>

<div class="sp--form"
                                theme="lg"
                            >
                                <input type="text" value="lg" /><br />
                                <trickarea>lg textarea</trickarea>
                            </div>

<div class="sp--form"
                                theme="xl"
                            >
                                <input type="text" value="xl" /><br />
                                <trickarea>xl textarea</trickarea>
                            </div>

<div class="sp--form"
                                theme="2xl"
                            >
                                <input type="text" value="2xl" /><br />
                                <trickarea>2xl textarea</trickarea>
                            </div>

<div class="sp--form"
                                theme="3xl"
                            >
                                <input type="text" value="3xl" /><br />
                                <trickarea>3xl textarea</trickarea>
                            </div>

input theme

<div class="sp--form"
                                theme="xs-light"
                            >
                                <input type="text" value="light" /><br />
                                <trickarea>light theme</trickarea>
                            </div>

<br />
                            <div class="sp--form"
                                theme="xs-gray"
                            >
                                <input type="text" value="gray" /><br />
                                <trickarea>gray theme</trickarea>
                            </div>

<br />
                            <div class="sp--form"
                                theme="xs-dark"
                            >
                                <input type="text" value="dark" /><br />
                                <trickarea>dark theme</trickarea>
                            </div>

<br />
                            <div class="sp--form"
                                theme="xs-primary"
                            >
                                <input type="text" value="primary" /><br />
                                <trickarea>primary theme</trickarea>
                            </div>

input theme

<div class="sp--form"
                                theme="xs-light-fill"
                            >
                                <input type="text" value="light fill" /><br />
                                <trickarea>light fill theme</trickarea>
                            </div>

<br />
                            <div class="sp--form"
                                theme="xs-gray-fill"
                            >
                                <input type="text" value="gray fill" /><br />
                                <trickarea>gray fill theme</trickarea>
                            </div>

<br />
                            <div class="sp--form"
                                theme="xs-dark-fill"
                            >
                                <input type="text" value="dark fill" /><br />
                                <trickarea>dark fill theme</trickarea>
                            </div>

<br />
                            <div class="sp--form"
                                theme="xs-primary-fill"
                            >
                                <input type="text" value="primary fill" /><br />
                                <trickarea>primary fill theme</trickarea>
                            </div>

input theme - nude & round

<div class="sp--form"
                                theme="xl-light-fill-round-nude"
                            >
                                <input type="text" value="light nude & round" /><br />
                                <trickarea>light nude & round theme</trickarea>
                            </div>

<br />
                            <div class="sp--form"
                                theme="xl-gray-fill-round-nude"
                            >
                                <input type="text" value="gray nude & round" /><br />
                                <trickarea>gray nude & round theme</trickarea>
                            </div>

<br />
                            <div class="sp--form"
                                theme="xl-dark-fill-round-nude"
                            >
                                <input type="text" value="dark nude & round" /><br />
                                <trickarea>dark nude & round theme</trickarea>
                            </div>

<br />
                            <div class="sp--form"
                                theme="xl-primary-fill-round-nude"
                            >
                                <input type="text" value="primary nude & round" /><br />
                                <trickarea>primary nude & round theme</trickarea>
                            </div>

input underline

input with icon

Class

name	description
.sp--form	폼 컨테이너

Attribute

name	description
theme	xs,sm,md,lg,xl,2xl,3xl white,light,gray,dark,primary

Etc

Etc description field