Компоненты

Heading

Основы

Компонент Heading позволяет добавлять заголовки к контенту.

make(
    Closure|string $label = '',
    ?int $h = null,
    bool $asClass = true,
)
make(
    Closure|string $label = '',
    ?int $h = null,
    bool $asClass = true,
)
  • $label - значение,
  • $h - градация (1-6),
  • $asClass - использовать <div> с классом градации или тег h.
use MoonShine\UI\Components\Heading;
 
Heading::make('Title', 2)
use MoonShine\UI\Components\Heading;
 
Heading::make('Title', 2)
<x-moonshine::heading h="2">
    Hello world
</x-moonshine::heading>
<x-moonshine::heading h="2">
    Hello world
</x-moonshine::heading>

Градация

Параметры заголовка так же можно задать с помощью метода h().

h(int $gradation = 3, $asClass = true)
h(int $gradation = 3, $asClass = true)
  • $gradation - градация (1-6),
  • $asClass - использовать класс градации или тег h.
use MoonShine\UI\Components\Heading;
 
// <div class="h1">
Heading::make('Title')->h(1),
// <h1>
Heading::make('Title')->h(1, false),
// <div class="h3">
Heading::make('Title')->h(),
// <h3>
Heading::make('Title')->h(asClass: false),
// <h4 class="h5">
Heading::make('Title', 4, false)->h(5)
use MoonShine\UI\Components\Heading;
 
// <div class="h1">
Heading::make('Title')->h(1),
// <h1>
Heading::make('Title')->h(1, false),
// <div class="h3">
Heading::make('Title')->h(),
// <h3>
Heading::make('Title')->h(asClass: false),
// <h4 class="h5">
Heading::make('Title', 4, false)->h(5)

Тег

Чтобы изменить тег заголовка, воспользуйтесь методом tag().

tag(string $tag)
tag(string $tag)
// <p class="h1">
Heading::make('Title', 1)
    ->tag('p'),
 
// <p class="h2">
Heading::make('Title')
    ->tag('p')
    ->h(2),
// <p class="h1">
Heading::make('Title', 1)
    ->tag('p'),
 
// <p class="h2">
Heading::make('Title')
    ->tag('p')
    ->h(2),