Newer
Older
smart-home-server / webclient / ui_components / forms.php
<section class="ui_section" id="forms">
	<h2 class="ui_section_title">Forms</h2>

	<div class="ui_block ui_form_group">
		<label class="ui_label">
			Text input
			<input type="text" class="ui_input" placeholder="Введите текст">
		</label>
	</div>

	<div class="ui_block ui_form_group">
		<label class="ui_label">
			Text input
			<i class="ph ph-user"></i>
			<input type="text" class="ui_input" placeholder="Введите текст">
		</label>
	</div>

	<div class="ui_block ui_form_group">
		<label class="ui_label">
			Password
			<input type="password" class="ui_input" placeholder="••••••">
		</label>
	</div>

	<div class="ui_block ui_form_group">
		<label class="ui_label">
			Text Area
			<i class="ph ph-text-aa"></i>
			<textarea class="ui_input" placeholder="Введите текст"></textarea>
		</label>
	</div>

	<div class="ui_block ui_form_group">
		<label class="ui_label">
			Select
			<div class="ui_select_wrap">
				<select class="ui_input ui_select">
					<option>Option 1</option>
					<option>Option 2</option>
				</select>
			</div>
		</label>
	</div>

	<div class="ui_block ui_form_group">
		<label class="ui_label">
			Select
			<i class="ph ph-selection-all"></i>
			<div class="ui_select_wrap">
				<select class="ui_input ui_select">
					<option>Option 1</option>
					<option>Option 2</option>
				</select>
			</div>
		</label>
	</div>

	<div class="ui_block ui_form_group">
		<label class="ui_checkbox">
			<input type="checkbox">
			<span class="ui_checkbox_control" aria-hidden="true"></span>
			<span class="ui_checkbox_label">Checkbox 1</span>
		</label>

		<label class="ui_checkbox mt-3">
			<input type="checkbox">
			<span class="ui_checkbox_control" aria-hidden="true"></span>
			<span class="ui_checkbox_label">Checkbox 2</span>
		</label>

		<label class="ui_checkbox mt-3">
			<input type="checkbox" disabled>
			<span class="ui_checkbox_control" aria-hidden="true"></span>
			<span class="ui_checkbox_label">Disabled</span>
		</label>

		<label class="ui_checkbox mt-3">
			<input type="checkbox" disabled checked>
			<span class="ui_checkbox_control" aria-hidden="true"></span>
			<span class="ui_checkbox_label">Disabled & Checked</span>
		</label>
	</div>

	<div class="ui_block ui_form_group">
		<label class="ui_radio">
			<input type="radio" name="radio_demo">
			<span class="ui_radio_control" aria-hidden="true"></span>
			<span class="ui_radio_label">Radio 1</span>
		</label>

		<label class="ui_radio ml-2">
			<input type="radio" name="radio_demo">
			<span class="ui_radio_control" aria-hidden="true"></span>
			<span class="ui_radio_label">Radio 2</span>
		</label>

		<label class="ui_radio ml-2">
			<input type="radio" name="radio_demo" disabled>
			<span class="ui_radio_control" aria-hidden="true"></span>
			<span class="ui_radio_label">Radio 3</span>
		</label>
	</div>
</section>