<div class="pt-80 mx-10">

        <div class="mx-10">

                    <div class="card-body">
                        <div class="list-group list-group-flush">

                    <div class="card-body bg-base-100">
                        <ul class="list">

                                <a
                                    href={resolve('/grain/projet/[pid]', {
                                        pid: p.id,
                                    })}
                                    class="list-group-item d-flex justify-content-between align-items-center">
                                    {p.nom}
                                    <span class="badge bg-primary rounded-pill"
                                        >{p.puissance}kWc</span>
                                </a>

                                <li class="list-row">
                                    <a
                                        href={resolve('/grain/projet/[pid]', {
                                            pid: p.id,
                                        })}
                                        class="flex justify-between items-center">
                                        {p.nom}
                                        <span class="badge badge-primary"
                                            >{p.puissance}kWc</span>
                                    </a>
                                </li>

                        </div>

                        </ul>

        <div class="w-full sm:w-1/2 me-auto">

        <div class="w-full sm:w-1/2 sm:ms-auto">

        <div class="w-full sm:w-1/2 sm:text-end sm:ms-auto">

        <div class="w-full sm:w-1/2 sm:text-end sm:me-auto">

        <div class="w-full sm:w-1/2">

        <div class="w-full sm:w-1/2 sm:ms-auto">

    @media not (prefers-color-scheme: dark) {
        .card {
            background-color: color-mix(
                in srgb,
                var(--bs-body-bg),
                transparent 30%
            );
        }
    }
    @media (prefers-color-scheme: dark) {
        .card {
            background-color: color-mix(
                in srgb,
                var(--bs-body-bg),
                transparent 30%
            );
        }
    }