Skip to content
tanthammar edited this page Nov 18, 2020 · 6 revisions

Range

Extends BaseField

Additional methods

These methods apply the equivalent input attribute on the field.

->step(float $step)

->min(float $min)

->max(float $max)

Example

<input type="range" step="1" min="1" max="100" value="3" />

Range::make('Range')
    ->default(3)//set a default value if none exists on the model
    ->min(1)
    ->max('100')
    ->step(1)
    ->rules('required|integer')

Blade component

<x-tall-range
    :field="$field"
    :attr="$field->getAttr('input')" />

Styling

Extend Blade component (or override in config file)

Tanthammar\TallForms\Components\Range::class

Theme

    /* Range */
    .tf-range-value {
        @apply rounded border px-2 font-bold;
    }
    .tf-range-labels {
        @apply text-gray-600;
    }
    .tf-range-wrapper {
        @apply flex space-x-2 py-2;
    }
Clone this wiki locally