@php
    use App\Libs\Settings;
@endphp
<x-app-layout>
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('HOME') }}
        </h2>
    </x-slot>

    <div class="py-2">
        <div class="mx-auto px-0">
            <div class="bg-white overflow-hidden shadow-sm rounded-lg">
                <div class="px-4 sm:px-6 lg:px-8 py-6 text-gray-900" x-data="{ notice: @js(Settings::get(Settings::notice)) }">
                    <h3 class="px-4 py-1.5 inline-block rounded bg-slate-700 text-white">{{ __('お知らせ') }}</h3>
                    <div class="mt-1 p-2 border border-sky-200 rounded bg-sky-50 text-md text-sky-700" x-show="notice" x-html="notice.replaceAll('\n', '<br>')"></div>
                    <div class="mt-1 p-2 border border-sky-200 rounded bg-sky-50 text-md text-sky-700" x-show="!notice">現在お知らせはありません。</div>
                </div>
            </div>
        </div>
    </div>
</x-app-layout>