Card
You're browsing the documentation for an old version of MoonShine. Consider upgrading your project to MoonShine 2.x.
-
Sections
# Basics
To create cards in the admin panel, use the moonshine::card component
<x-moonshine::card url="#" thumbnail="/images/image_1.jpg" :title="fake()->sentence(3)" :subtitle="date('d.m.Y')" :values="['ID' => 1, 'Author' => fake()->name()]"> <x-slot:header> <x-moonshine::badge color="green">new</x-moonshine::badge> </x-slot:header> {{ fake()->text() }} <x-slot:actions> <x-moonshine::link href="#">Read more</x-moonshine::link> </x-slot:actions></x-moonshine::card>
new
Blanditiis dignissimos possimus sed explicabo ipsa id magni molestiae. Delectus illum cum dicta perspiciatis et iure aut aut. Aut nesciunt ut aut rem. Veritatis commodi autem repellat et.
Natus sunt laudantium sapiente.
| ID: | 1 |
|---|---|
| Author: | Arvilla Kiehn |
# Overlay view
The overlay view is available for the card
<x-moonshine::card url="#" :overlay="true" thumbnail="/images/image_1.jpg" :title="fake()->sentence(3)" :subtitle="date('d.m.Y')" :values="['ID' => 1, 'Author' => fake()->name()]"> <x-slot:header> <x-moonshine::badge color="green">new</x-moonshine::badge> </x-slot:header> {{ fake()->text() }} <x-slot:actions> <x-moonshine::link href="#">Read more</x-moonshine::link> </x-slot:actions></x-moonshine::card>
| ID: | 1 |
|---|---|
| Author: | Arianna Johnson |