/** * Panneau de recherche en surimpression. * * Il était masqué par un décalage hors écran — position:fixed avec left:100% et * width:100% — donc occupait la bande située juste à droite de la fenêtre. À * 320px de large, le document s'étendait ainsi jusqu'à 610px et une barre de * défilement horizontale apparaissait. body{overflow-x:hidden} du thème parent * n'y suffit pas : tant que ne porte pas la même valeur, le viewport * conserve son défilement. La poser sur romprait en revanche les trois * position:sticky du site (filtres du blog, barre de filtres et carte des * listings), un ancêtre en overflow:hidden les désactivant. * * Le panneau reste donc dans la fenêtre et s'efface par l'opacité. Aucun * débordement possible, et visibility:hidden le retire de l'ordre de tabulation * quand il est fermé — son champ de recherche était jusqu'ici atteignable au * clavier alors qu'invisible à l'écran. * * Chargée après styles.min.css, à spécificité égale : ces règles la supplantent. */ .search-screen { left: 0; opacity: 0; visibility: hidden; /* visibility retardée jusqu'à la fin du fondu, pour ne pas l'interrompre. */ transition: opacity 0.3s, visibility 0s 0.3s; } .search-screen.is-active { left: 0; opacity: 1; visibility: visible; transition: opacity 0.3s, visibility 0s; }