Modèle:Filtre : Différence entre versions
[version non vérifiée] | [version vérifiée] |
(11 révisions intermédiaires par 2 utilisateurs non affichées) | |||
Ligne 1 : | Ligne 1 : | ||
{{LoadJavascript|Script=element}} {{LoadJavascript|Script=filter}} | {{LoadJavascript|Script=element}} {{LoadJavascript|Script=filter}} | ||
− | {{Form|style=position: relative; display: flex; align-items: center; flex-wrap: nowrap; height: 35px; font-size: 1.1em; margin: 15px auto; width: | + | {{Form|style=position: relative; display: flex; align-items: center; flex-wrap: nowrap; height: 35px; font-size: 1.1em; margin: 15px auto; width: 520px; max-width: 100%;|id=filter-form|content= |
− | {{ | + | {{FiltreModule |
− | {{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> | + | |placeholder={{{placeholder|}}} |
+ | |Type=Text | ||
+ | }} | ||
+ | {{Button|type=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<span id="filter-counter" style="color: #007B33;font-size: 12px;"></span></div> | ||
}} | }} | ||
<div style="position: absolute; top: calc(100% + 5px); left: 0; right: 0; background: white; border: 1px solid #ccc; padding: 10px 0 10px 10px; border-radius: 8px; text-align: left; z-index: 10; max-height: 400px;"> | <div style="position: absolute; top: calc(100% + 5px); left: 0; right: 0; background: white; border: 1px solid #ccc; padding: 10px 0 10px 10px; border-radius: 8px; text-align: left; z-index: 10; max-height: 400px;"> | ||
− | <div style="display: flex; flex-direction: column; gap: 10px; max-height: inherit; overflow-y: auto; padding-right: | + | <div style="display: flex; flex-direction: column; gap: 10px; max-height: inherit; overflow-y: auto; padding-right: 5px;"> |
− | {{#if:{{{Niveau|}}}| | + | {{#if:{{{Niveau|}}}| |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
{{FiltreModule | {{FiltreModule | ||
+ | |name=Intervalle de niveau | ||
+ | |id={{FiltreCorrespondance|Niveau}} | ||
+ | |maxLevel={{{maxLevel|135}}} | ||
+ | |Type=Range | ||
+ | }} | ||
+ | }} {{#if:{{{Rang|}}}| | ||
+ | {{FiltreModule | ||
+ | |name=Rang | ||
|id={{FiltreCorrespondance|Rang}} | |id={{FiltreCorrespondance|Rang}} | ||
|span=<span class="counter" style="color: rgb(159, 159, 159); font-size: 12px; margin-left: auto;"></span> | |span=<span class="counter" style="color: rgb(159, 159, 159); font-size: 12px; margin-left: auto;"></span> | ||
Ligne 36 : | Ligne 41 : | ||
|value6=5 | |value6=5 | ||
}} | }} | ||
− | + | }} {{#if:{{{Élément|}}}| | |
− | |||
{{FiltreModule | {{FiltreModule | ||
+ | |name=Élément | ||
|id={{FiltreCorrespondance|Élément}} | |id={{FiltreCorrespondance|Élément}} | ||
|span=<span class="counter" style="color: rgb(159, 159, 159); font-size: 12px; margin-left: auto;"></span> | |span=<span class="counter" style="color: rgb(159, 159, 159); font-size: 12px; margin-left: auto;"></span> | ||
|Type=Checkbox | |Type=Checkbox | ||
− | |text1=[[Image:Elementfeu.png|25px|link=]]<span | + | |text1=<span style="text-overflow: ellipsis; overflow: hidden;>[[Image:Elementfeu.png|25px|link=]] <span>Feu</span></span> |
|value1=feu | |value1=feu | ||
− | |text2=[[Image:Elementglace.png|25px|link=]]<span | + | |text2=<span style="text-overflow: ellipsis; overflow: hidden;>[[Image:Elementglace.png|25px|link=]] <span>Glace</span></span> |
|value2=glace | |value2=glace | ||
− | |text3=[[Image:Elementfoudre.png|25px|link=]]<span | + | |text3=<span style="text-overflow: ellipsis; overflow: hidden;>[[Image:Elementfoudre.png|25px|link=]] <span>Foudre</span></span> |
|value3=foudre | |value3=foudre | ||
− | |text4=[[Image:Elementvent.png|25px|link=]]<span | + | |text4=<span style="text-overflow: ellipsis; overflow: hidden;>[[Image:Elementvent.png|25px|link=]] <span>Vent</span></span> |
|value4=vent | |value4=vent | ||
− | |text5=[[Image:Elementobscurite.png|25px|link=]]<span | + | |text5=<span style="text-overflow: ellipsis; overflow: hidden;>[[Image:Elementobscurite.png|25px|link=]] <span>Obscurité</span></span> |
|value5=obscurite | |value5=obscurite | ||
− | |text6=[[Image:Elementterre.png|25px|link=]]<span | + | |text6=<span style="text-overflow: ellipsis; overflow: hidden;>[[Image:Elementterre.png|25px|link=]] <span>Terre</span></span> |
|value6=terre | |value6=terre | ||
Ligne 64 : | Ligne 69 : | ||
|value7=aucun | |value7=aucun | ||
}} | }} | ||
− | + | }} {{#if:{{{Type|}}}| | |
− | |||
{{FiltreModule | {{FiltreModule | ||
+ | |name=Type | ||
|id={{FiltreCorrespondance|Type}} | |id={{FiltreCorrespondance|Type}} | ||
|span=<span class="counter" style="color: rgb(159, 159, 159); font-size: 12px; margin-left: auto;"></span> | |span=<span class="counter" style="color: rgb(159, 159, 159); font-size: 12px; margin-left: auto;"></span> | ||
Ligne 101 : | Ligne 106 : | ||
|value10=aucun | |value10=aucun | ||
}} | }} | ||
− | + | }} {{#if:{{{Dégâts|}}}| | |
− | |||
{{FiltreModule | {{FiltreModule | ||
+ | |name=Dégâts | ||
|id={{FiltreCorrespondance|Dégât}} | |id={{FiltreCorrespondance|Dégât}} | ||
|span=<span class="counter" style="color: rgb(159, 159, 159); font-size: 12px; margin-left: auto;"></span> | |span=<span class="counter" style="color: rgb(159, 159, 159); font-size: 12px; margin-left: auto;"></span> | ||
|Type=Checkbox | |Type=Checkbox | ||
− | |text1= | + | |text1=<span style="text-overflow: ellipsis; overflow: hidden;>🗡️ <span>Mêlée</span></span> |
|value1=melee | |value1=melee | ||
− | |text2= | + | |text2=<span style="text-overflow: ellipsis; overflow: hidden;>🏹 <span>Flèche</span></span> |
|value2=fleche | |value2=fleche | ||
− | |text3= | + | |text3=<span style="text-overflow: ellipsis; overflow: hidden;>🧙 <span>Magique</span></span> |
|value3=magique | |value3=magique | ||
− | |text4= | + | |text4=<span style="text-overflow: ellipsis; overflow: hidden;>✨ <span>Compétence</span></span> |
|value4=dc | |value4=dc | ||
}} | }} | ||
− | + | }} | |
</div> | </div> | ||
</div> | </div> | ||
}}<noinclude>[[Catégorie:Nouveaux modèles]]</noinclude> | }}<noinclude>[[Catégorie:Nouveaux modèles]]</noinclude> |
Version actuelle datée du 22 décembre 2024 à 15:51
Filtrer les monstres