@extends('layouts.app')

@section('content')
    <div class="container my-5 py-5">
        <div class="row justify-content-center">
            <div class="col-lg-10">
                <nav aria-label="breadcrumb" class="mb-4">
                    <ol class="breadcrumb bg-transparent p-0">
                        <li class="breadcrumb-item"><a href="{{ route('home') }}" class="text-decoration-none">ホーム</a></li>
                        <li class="breadcrumb-item active" aria-current="page">{{ $page->title }}</li>
                    </ol>
                </nav>

                <header class="mb-5">
                    <h1 class="h2 fw-bold border-bottom pb-3">{{ $page->title }}</h1>
                </header>

                <div class="page-content bg-white p-4 p-md-5 rounded shadow-sm lh-lg">
                    <x-content-blocks :blocks="$page->content" />
                </div>
            </div>
        </div>
    </div>
@endsection