edge-components

Input File Control 

<div class="form-control mb-5 w-full max-w-xs">
    <label class="label cursor-pointer" for="avatar">
        <span class="label-text">
            Avatar</span>
    </label>
    <input type="file" class="file-input file-input-bordered" name="avatar" id="avatar" value="" />

</div>
 
@jrmc.form.control({ name: 'avatar', class: 'w-full max-w-xs', label: 'Avatar' })
  @!jrmc.form.file({ class: 'file-input-bordered' })
@end
  • Handle: @input-file-control
  • Preview:
  • Filesystem Path: fractal/components/03-form/11-input-file/07-input-file-control.edge

File Input

Doc : daisyui file input

File Input is a an input field for uploading files.

Class name Type
file-input Component For <input> element
file-input-bordered Modifier Adds border to input
file-input-ghost Modifier Adds ghost style to input
file-input-primary Modifier Adds primary color to input
file-input-secondary Modifier Adds secondary color to input
file-input-accent Modifier Adds accent color to input
file-input-info Modifier Adds info color to input
file-input-success Modifier Adds success color to input
file-input-warning Modifier Adds warning color to input
file-input-error Modifier Adds error color to input
file-input-lg Responsive Large size for input
file-input-md Responsive Medium (default) size for input
file-input-sm Responsive Small size for input
file-input-xs Responsive Extra small size for input