form-grid · Admiral UI kit

Example

Laravel

<x-admin::form action="/segments" method="PUT" files>
    <x-admin::form-grid>
        <x-admin::input name="g_first" label="First name" />
        <x-admin::input name="g_last" label="Last name" />
    </x-admin::form-grid>
    <x-admin::form-actions class="mt">
        <x-admin::button>Cancel</x-admin::button>
        <x-admin::button variant="primary" type="button">Save changes</x-admin::button>
    </x-admin::form-actions>
</x-admin::form>

Other attributes, such as wire:model or data-*, pass through to the element.

Other stacks

React and Vue: import { FormGrid } from "@admiral/ui-kit/react" (or /vue). See the React and Vue guide.

HTML, for any stack

<form method="POST" action="/segments" enctype="multipart/form-data"  >
                            <input type="hidden" name="_method" value="PUT">            <div class="adm-form-grid"><div class="adm-field">
            <label class="adm-label" for="g_first">First name</label>
        <input
        type="text"
         name="g_first"          id="g_first"                                         class="adm-input"
    >
        </div>
        <div class="adm-field">
            <label class="adm-label" for="g_last">Last name</label>
        <input
        type="text"
         name="g_last"          id="g_last"                                         class="adm-input"
    >
        </div></div>
    <div class="adm-form-actions mt"><button type="button" class="adm-btn adm-btn--secondary" >Cancel</button>
        <button type="button" class="adm-btn adm-btn--primary" >Save changes</button></div>
</form>