Press review

<div class="bg-white rounded-button flex flex-col w-full md:p-7 p-5 gap-2.5">

    <span class="font-semibold md:text-2xl text-xl">Ma revue de presse</span>

    <span class="font-semibold md:text-xl text-lg">Vos abonnements newsletters</span>

    <div class="flex flex-col gap-4 py-4">

        <div class="flex gap-2">

            <button class="filter-pill border-[#37465C] px-4 hover:bg-ui-light">

                <span clas="text-xxs font-semibold">Innovation</span>

                <?= icon('close', 'w-2.5'); ?>

            </button>

            <button class="filter-pill border-[#37465C] px-4 hover:bg-ui-light">

                <span clas="text-xxs font-semibold">Innovation</span>

                <?= icon('close', 'w-2.5'); ?>

            </button>

        </div>

        <div class="flex gap-2 items-center">

            <span class="md:text-base text-smaller">Une newsletter</span>

            <div class="form-element form-select form-select__no-width without-label min-w-[150px]"

                 x-data="selectInput"

                 :class="{ 'active' : active }"

                 @click.away="active = false">

                <input x-ref="input" name="city" class="" id="city" type="text" pattern="\S+" x-model="currentValue">

                <div x-ref="display" @click="toggle()" class="form-input tiny-select" x-text="currentLabel"></div>

                <ul x-ref="options" class="select-options" x-show="active">

                    <li>

                        <button type="button" @click="setValue('homme', 'Homme')">un homme</button>

                    </li>

                    <li>

                        <button type="button" @click="setValue('femme', 'Femme')">une Femme</button>

                    </li>

                </ul>

            </div>

        </div>

    </div>

    <button class="btn btn-primary btn-full-width">Enregistrer</button>

</div>