Documentation

Blade Components

Text

Display text using pre-defined typographic styles and style combinations.

Heading

The Evil Rabbit Jumps.
The Evil Rabbit Jumps.
The Evil Rabbit Jumps.
The Evil Rabbit Jumps.
The Evil Rabbit Jumps.
The Evil Rabbit Jumps.
<x-heading :heading-level="1" size="flex" :as-heading="false">The Evil Rabbit Jumps.</x-heading>
<x-heading :heading-level="2" size="flex" :as-heading="false">The Evil Rabbit Jumps.</x-heading>
<x-heading :heading-level="3" size="flex" :as-heading="false">The Evil Rabbit Jumps.</x-heading>
<x-heading :heading-level="4" size="flex" :as-heading="false">The Evil Rabbit Jumps.</x-heading>
<x-heading :heading-level="5" size="flex" :as-heading="false">The Evil Rabbit Jumps.</x-heading>
<x-heading :heading-level="6" size="flex" :as-heading="false">The Evil Rabbit Jumps.</x-heading>

Paragraph

The Evil Rabbit Jumped over the Fence. 

<x-paragraph>
    The Evil Rabbit Jumped over the Fence.
</x-paragraph>

Description

Displays a brief heading and subheading for additional information or context.

Section Title
Description about this section.
<x-description>
    <x-slot:title>
        Section Title
    </x-slot:title>
    Description about this section.
</x-description>

Currency

€ 100,00 
<x-currency :value="100.00" />

Date Time

Oct 25, 2024 — 13:59 
<x-date-time :date="\Carbon\Carbon::now()" />

Unordered List

  • The Evil Rabbit Jumped over the Fence.
  • The Evil Rabbit Jumped over the Fence.
  • The Evil Rabbit Jumped over the Fence.
  • The Evil Rabbit Jumped over the Fence.
<x-ul>
    <li>The Evil Rabbit Jumped over the Fence.</li>
    <li>The Evil Rabbit Jumped over the Fence.</li>
    <li>The Evil Rabbit Jumped over the Fence.</li>
    <li>The Evil Rabbit Jumped over the Fence.</li>
</x-ul>

Ordered List

  1. The Evil Rabbit Jumped over the Fence.
  2. The Evil Rabbit Jumped over the Fence.
  3. The Evil Rabbit Jumped over the Fence.
  4. The Evil Rabbit Jumped over the Fence.
<x-ol>
    <li>The Evil Rabbit Jumped over the Fence.</li>
    <li>The Evil Rabbit Jumped over the Fence.</li>
    <li>The Evil Rabbit Jumped over the Fence.</li>
    <li>The Evil Rabbit Jumped over the Fence.</li>
</x-ol>

Codeblock

composer require distortedfusion/blade-component-codes
<x-pre>composer require distortedfusion/blade-component-codes</x-pre>
Previous Introduction
Next Buttons