@extends('layouts.simple.master') @section('title', 'Base Inputs') @section('css') @endsection @section('main_content')

Base Inputs

  2. Form Controls
  3. Base inputs
Basic Form

Use form-label and form-control through create basic form.

Floating Form

Use form-floating to create floating form.

Select Sizing

form-select to trigger the custom styles. You may also choose from small and large custom selects to match our similarly sized text inputs. class:- [form-select-lg/form-select-sm].

Form Control Sizing

Set heights using classes like form-control-lg and form-control-sm.

File Input

For default file/multiple file/disabled file/small file/large file input for use <input> with (type='file').

Flat Input Style

Use btn-square to define 0px border-radius.

Basic HTML Input Control

Give textual form controls like <input>s and <textarea>s an upgrade with custom styles, sizing, focus states, and more.

Hello !... This is my magical text
Basic Floating Input Control

Give textual form controls like <input>s and <textarea>s an upgrade with custom styles, sizing, focus states, and more.

@
@
Please choose a username.
Edges Input Style

Use btn-pill to define border-radius.

Raise Input Style

Use input-air-* to define bottom box-shadow.

Dynamic Form Field

Use id #cart_fields to dynamically add form fields.

Auto Size Textarea

Use autosize-textarea to define custom textarea and javascript textarea.

Max Length Elements

Use [*-maxlength] classes to define maxlength for textarea and inputs.

Source Credit: [https://github.com/mimo84/bootstrap-maxlength/]

Multi Select Splitter

Use multiple-selects class to define multi select splitters.

Simple select and no multiple

Select works even with custom text. On background, original select is correctly updated with original values. Maximum alert message was changed.

Multiple select with group counter. You can select maximum 2 options of all categories.

Multiple select with group counter. You can select maximum 3 options ONLY from one cattegory.

Multiple select of size 7 with group counter. Second select is cleared, when first changed.

Source Credit: [https://github.com/poolerMF/bootstrap-multiselectsplitter]

@endsection @section('scripts') @endsection