Forms

.form-field (custom)

label + input + help/error 통합 컴포넌트. 회원가입, 마이페이지에 사용.

<div class="form-field">
    <label class="form-field__label">
        이름 <span class="required">*</span>
    </label>
    <input type="text" class="form-control">
    <span class="form-field__help">도움말 텍스트</span>
</div>

Text Inputs

Bootstrap form-control + 크기 변형

<input type="text" class="form-control form-control-lg" placeholder="Large">
<input type="text" class="form-control" placeholder="Default">
<input type="text" class="form-control form-control-sm" placeholder="Small">

Input Groups

아이콘이나 버튼이 붙은 입력 필드

<div class="input-group">
    <span class="input-group-text"><i class="bi bi-search"></i></span>
    <input type="text" class="form-control">
    <button class="btn btn-primary">검색</button>
</div>

Select

드롭다운 선택

Textarea

Checkbox & Radio

Switches (Toggle)

알림 설정 등 on/off 토글에 사용