https://wiki.nefald.fr/index.php?action=history&feed=atom&title=Mod%C3%A8le%3AQRLink%2Fstyles.css 2026-04-29T01:34:00Z Historique des versions pour cette page sur le wiki MediaWiki 1.43.6 https://wiki.nefald.fr/index.php?title=Mod%C3%A8le:QRLink/styles.css&diff=4068&oldid=prev 2026-01-19T20:35:52Z

<p>Page créée avec « .qr-link-wrapper { position: relative; display: flex; align-items: center; width: 380px; max-width: 100%; min-height: 100px; padding: 14px; border-radius: 12px; margin: 10px 0; box-sizing: border-box; cursor: pointer; <span class="autocomment">Ajouts pour l&#039;effet hover : </span> transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); } .qr-link-wrapper:hover { transform: transla... »</p> <p><b>Nouvelle page</b></p><div>.qr-link-wrapper {<br /> <br /> position: relative;<br /> <br /> display: flex;<br /> <br /> align-items: center;<br /> <br /> width: 380px;<br /> <br /> max-width: 100%;<br /> <br /> min-height: 100px;<br /> <br /> padding: 14px;<br /> <br /> border-radius: 12px;<br /> <br /> margin: 10px 0;<br /> <br /> box-sizing: border-box;<br /> <br /> cursor: pointer;<br /> <br /> /* Ajouts pour l&#039;effet hover */<br /> <br /> transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);<br /> <br /> box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);<br /> <br /> }<br /> <br /> <br /> <br /> .qr-link-wrapper:hover {<br /> <br /> transform: translateY(-2px);<br /> <br /> box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);<br /> <br /> }<br /> <br /> <br /> <br /> /* LIEN INVISIBLE EN OVERLAY */<br /> <br /> .qr-link-overlay {<br /> <br /> position: absolute;<br /> <br /> top: 0;<br /> <br /> left: 0;<br /> <br /> right: 0;<br /> <br /> bottom: 0;<br /> <br /> z-index: 10;<br /> <br /> }<br /> <br /> <br /> <br /> .qr-link-overlay a {<br /> <br /> display: block;<br /> <br /> width: 100%;<br /> <br /> height: 100%;<br /> <br /> text-decoration: none !important;<br /> <br /> font-size: 0;<br /> <br /> color: transparent;<br /> <br /> }<br /> <br /> <br /> <br /> .qr-link-overlay a:after {<br /> <br /> display: none !important;<br /> <br /> }<br /> <br /> <br /> <br /> /* QR CODE */<br /> <br /> .qr-link-qr {<br /> <br /> background: white;<br /> <br /> padding: 6px;<br /> <br /> border-radius: 6px;<br /> <br /> width: 80px;<br /> <br /> height: 80px;<br /> <br /> flex-shrink: 0;<br /> <br /> margin-right: 14px;<br /> <br /> display: flex;<br /> <br /> align-items: center;<br /> <br /> justify-content: center;<br /> <br /> }<br /> <br /> <br /> <br /> .qr-link-qr svg {<br /> <br /> width: 100%;<br /> <br /> height: 100%;<br /> <br /> display: block;<br /> <br /> }<br /> <br /> <br /> <br /> /* CONTENU TEXTE */<br /> <br /> .qr-link-content {<br /> <br /> flex: 1;<br /> <br /> color: white;<br /> <br /> line-height: 1.4;<br /> <br /> }<br /> <br /> <br /> <br /> .qr-link-title {<br /> <br /> font-weight: bold;<br /> <br /> font-size: 1.15em;<br /> <br /> }<br /> <br /> <br /> <br /> .qr-link-desc {<br /> <br /> font-size: 0.85em;<br /> <br /> opacity: 0.85;<br /> <br /> }</div>

Hiob