Filtre de dates compact
Un calendrier d’un mois : touchez le jour d’arrivée puis celui de départ, les nuits entre les deux se colorent.
Réglages
Code
<div class="uv-fmd"><div class="ph"><div class="cal"><div class="hd"><b>Juin</b><span class="out">Choisir les dates</span></div><div class="wk"><span>L</span><span>M</span><span>X</span><span>J</span><span>V</span><span>S</span><span>D</span></div><div class="gd"><button data-d="1">1</button><button data-d="2">2</button><button data-d="3">3</button><button data-d="4">4</button><button data-d="5">5</button><button data-d="6">6</button><button data-d="7">7</button><button data-d="8">8</button><button data-d="9">9</button><button data-d="10">10</button><button data-d="11">11</button><button data-d="12">12</button><button data-d="13">13</button><button data-d="14">14</button><button data-d="15">15</button><button data-d="16">16</button><button data-d="17">17</button><button data-d="18">18</button><button data-d="19">19</button><button data-d="20">20</button><button data-d="21">21</button><button data-d="22">22</button><button data-d="23">23</button><button data-d="24">24</button><button data-d="25">25</button><button data-d="26">26</button><button data-d="27">27</button><button data-d="28">28</button><button data-d="29">29</button><button data-d="30">30</button></div></div></div></div>Prompt pour l’IA
Collez-le dans ChatGPT, Claude ou Cursor : le bloc sera adapté à votre projet avec ces réglages, même sans React.
Plus dans Filtres
Où l’utiliser
Conçu pour les filtres de réservation sur petit écran. Un site de gîtes, un camping ou une location de bateaux où l’on choisit arrivée et départ en deux gestes. Les jours intermédiaires sont teintés et l’en-tête écrit la période, les dates ne laissent donc aucun doute. On le cherche comme sélecteur de plage de dates ou calendrier de réservation.
La démo affiche un seul mois. Pour de vraies réservations, ajoutez des flèches pour changer de mois et grisez les jours déjà pris. Signalez aussi la date du jour, même avec un simple point, pour qu’on se repère vite.