Modèle:Test1 : Différence entre versions
| [version vérifiée] | [version vérifiée] |
| Ligne 1 : | Ligne 1 : | ||
{{LoadJavascript|Script=element}} | {{LoadJavascript|Script=element}} | ||
| − | {{Form|style=position: relative; display: flex | + | {{Form|style=position: relative; display: flex; align-items: center; flex-wrap: nowrap; height: 35px; font-size: 1.1em; margin: 15px auto; width: 500px; max-width: 100%;|id=filter-form|content= |
| − | {{Input|id=filter-name|name=filterName|style=grid-area: 1 / -1; width: 100%; height: 100%; padding: 3px 20px 3px 52px; margin: 0; border-radius: 999px;|labelStyle=height: 100%; flex-grow: 1; padding: 0; margin: 0; display: grid; align-items: center;|placeholder=Rechercher un {{#switch:{{PAGENAME}}|Monstres=un monstre|Pierres Metin=une pierre Metin}}|text={{Svg|style=height: 100%; grid-area: 1 / -1; z-index: 10; padding: | + | {{Input|id=filter-name|name=filterName|style=grid-area: 1 / -1; width: 100%; height: 100%; padding: 3px 20px 3px 52px; margin: 0; border-radius: 999px 0 0 999px;|labelStyle=height: 100%; flex-grow: 1; padding: 0; margin: 0; display: grid; align-items: center;|placeholder=Rechercher un {{#switch:{{PAGENAME}}|Monstres=un monstre|Pierres Metin=une pierre Metin}}|text={{Svg|style=height: 100%; grid-area: 1 / -1; z-index: 10; padding-left: 10px;|height=24|viewBox=0 -960 960 960|width=24|data=search}}}} |
| − | {{Button|id=open-filter|style=height: 100%; padding: 0 10px; border- | + | {{Button|id=open-filter|style=height: 100%; padding: 0 10px; border-bottom-width: 1px; margin-left: -1px;|text=<div style="display: flex; align-items: flex-end; gap: 5px;">{{Svg|class=svg-icon|height=24|viewBox=0 -960 960 960|width=24|data=filter|title=Filtrer les monstres}} Filtrer</div> |
}} | }} | ||
<div style="position: absolute; top: calc(100% + 5px); right: 0; background: white; border: 1px solid #ccc; padding: 10px 0 10px 10px; border-radius: 8px; width: 500px; max-width: calc(100% - 20px); text-align: left; z-index: 10; max-height: 400px;"> | <div style="position: absolute; top: calc(100% + 5px); right: 0; background: white; border: 1px solid #ccc; padding: 10px 0 10px 10px; border-radius: 8px; width: 500px; max-width: calc(100% - 20px); text-align: left; z-index: 10; max-height: 400px;"> | ||
Version du 10 décembre 2024 à 19:06
Filtrer les monstres
