Modèle:Filtre : Différence entre versions

[version non vérifiée][version vérifiée]
 
(43 révisions intermédiaires par 2 utilisateurs non affichées)
Ligne 1 : Ligne 1 :
−
{{LoadJavascript|Script=element}}
+
{{LoadJavascript|Script=element}} {{LoadJavascript|Script=filter}}
−
{{Form|style=display: flex; flex-wrap: wrap; gap: 10px; margin: 20px 0; user-select: none;|id=filter-form|content=
+
{{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|data=category+{{{category|}}}|content=
−
{{#if:{{{Nom|}}}|
 
−
<div style="position: relative;">
 
 
{{FiltreModule
 
{{FiltreModule
 +
|placeholder=Rechercher par nom
 
|Type=Text
 
|Type=Text
−
|id=filter-name
 
−
|Nom=Nom
 
 
}}
 
}}
−
</div>
+
{{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|t=477|title=Filtrer}} <span data-t="477">Filtrer</span><span id="filter-counter" style="color: #007B33;font-size: 12px;"></span></div>
−
}} {{#if:{{{Niveau|}}}|
+
}}
−
<div style="position: relative;">
+
<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: 5px;">
 +
{{#if:{{{Niveau|}}}|
 
{{FiltreModule
 
{{FiltreModule
 +
|name=<span data-t="472">Intervalle de niveau</span>
 +
|id={{FiltreCorrespondance|Niveau}}
 +
|maxLevel={{{maxLevel|135}}}
 
|Type=Range
 
|Type=Range
−
|id=e0
 
−
|Nom=Niveau
 
−
|min=1
 
−
|max=135
 
−
|param=levels
 
 
}}
 
}}
−
</div>
 
 
}} {{#if:{{{Rang|}}}|
 
}} {{#if:{{{Rang|}}}|
−
<div style="position: relative;">
 
 
{{FiltreModule
 
{{FiltreModule
 +
|name=<span data-t="478">Rang</span>
 +
|id={{FiltreCorrespondance|Rang}}
 +
|span=<span class="counter" style="color: rgb(159, 159, 159); font-size: 12px; margin-left: auto;"></span>
 
|Type=Checkbox
 
|Type=Checkbox
−
|id=e1
 
−
|Nom=Rang
 
−
|param=levels
 
  
−
|Checkbox1=1
+
|text1=<span style="text-overflow: ellipsis; overflow: hidden;">1</span>
−
|Checkbox2=2
+
|value1=1
−
|Checkbox3=3
+
 
−
|Checkbox4=4
+
|text2=<span style="text-overflow: ellipsis; overflow: hidden;">2</span>
−
|Checkbox5=Boss
+
|value2=2
−
|Checkbox6=5
+
 
 +
|text3=<span style="text-overflow: ellipsis; overflow: hidden;">3</span>
 +
|value3=3
 +
 
 +
|text4=<span style="text-overflow: ellipsis; overflow: hidden;">4</span>
 +
|value4=4
 +
 
 +
|text5=<span style="text-overflow: ellipsis; overflow: hidden;"><span data-t="473">Boss</span> 🌟</span>
 +
|value5=boss
 +
 
 +
|text6=<span style="text-overflow: ellipsis; overflow: hidden;">5 🌟🌟</span>
 +
|value6=5
 
}}
 
}}
−
</div>
 
 
}} {{#if:{{{Élément|}}}|
 
}} {{#if:{{{Élément|}}}|
−
<div style="position: relative;">
 
 
{{FiltreModule
 
{{FiltreModule
 +
|name=<span data-t="479">Élément</span>
 +
|id={{FiltreCorrespondance|Élément}}
 +
|span=<span class="counter" style="color: rgb(159, 159, 159); font-size: 12px; margin-left: auto;"></span>
 
|Type=Checkbox
 
|Type=Checkbox
−
|id=e2
 
−
|Nom=Élément
 
−
|param=element
 
  
−
|Checkbox1=Feu
+
|text1=<span style="text-overflow: ellipsis; overflow: hidden;">[[Image:Elementfeu.png|25px|link=]] <span data-t="482">Feu</span></span>
−
|Checkbox2=Glace
+
|value1=feu
−
|Checkbox3=Foudre
+
 
−
|Checkbox4=Vent
+
|text2=<span style="text-overflow: ellipsis; overflow: hidden;">[[Image:Elementglace.png|25px|link=]] <span data-t="483">Glace</span></span>
−
|Checkbox5=Obscurité
+
|value2=glace
−
|Checkbox6=Terre
+
 
−
|Checkbox7=Aucun
+
|text3=<span style="text-overflow: ellipsis; overflow: hidden;">[[Image:Elementfoudre.png|25px|link=]] <span data-t="484">Foudre</span></span>
 +
|value3=foudre
 +
 
 +
|text4=<span style="text-overflow: ellipsis; overflow: hidden;">[[Image:Elementvent.png|25px|link=]] <span data-t="485">Vent</span></span>
 +
|value4=vent
 +
 
 +
|text5=<span style="text-overflow: ellipsis; overflow: hidden;">[[Image:Elementobscurite.png|25px|link=]] <span data-t="486">Obscurité</span></span>
 +
|value5=obscurite
  
−
|id5=obscurite
+
|text6=<span style="text-overflow: ellipsis; overflow: hidden;">[[Image:Elementterre.png|25px|link=]] <span data-t="487">Terre</span></span>
 +
|value6=terre
  
 +
|text7=<span style="text-overflow: ellipsis; overflow: hidden;" data-t="488">Aucun</span>
 +
|value7=aucun
 
}}
 
}}
−
</div>
 
 
}} {{#if:{{{Type|}}}|
 
}} {{#if:{{{Type|}}}|
−
<div style="position: relative;">
 
 
{{FiltreModule
 
{{FiltreModule
 +
|name=<span data-t="480">Type</span>
 +
|id={{FiltreCorrespondance|Type}}
 +
|span=<span class="counter" style="color: rgb(159, 159, 159); font-size: 12px; margin-left: auto;"></span>
 
|Type=Checkbox
 
|Type=Checkbox
−
|id=e3
 
−
|Nom=Type
 
−
|param=replace__type
 
  
−
|Checkbox1=Demi-humain
+
|text1=<span style="text-overflow: ellipsis; overflow: hidden;" data-t="489">Demi-humain</span>
−
|Checkbox2=Mal
+
|value1=demi-humain
−
|Checkbox3=Désert
+
 
−
|Checkbox4=Animal
+
|text2=<span style="text-overflow: ellipsis; overflow: hidden;" data-t="490">Mal</span>
−
|Checkbox5=Orc
+
|value2=mal
−
|Checkbox6=Mystique
+
 
−
|Checkbox7=Mort-vivant
+
|text3=<span style="text-overflow: ellipsis; overflow: hidden;" data-t="491">Désert</span>
−
|Checkbox8=Insecte
+
|value3=desert
−
|Checkbox9=Aucun
 
  
−
|id3=desert
+
|text4=<span style="text-overflow: ellipsis; overflow: hidden;" data-t="492">Animal</span>
 +
|value4=animal
  
 +
|text5=<span style="text-overflow: ellipsis; overflow: hidden;" data-t="493">Orc</span>
 +
|value5=orc
 +
 +
|text6=<span style="text-overflow: ellipsis; overflow: hidden;" data-t="494">Mystique</span>
 +
|value6=mystique
 +
 +
|text7=<span style="text-overflow: ellipsis; overflow: hidden;" data-t="495">Mort-vivant</span>
 +
|value7=mort-vivant
 +
 +
|text8=<span style="text-overflow: ellipsis; overflow: hidden;" data-t="496">Insecte</span>
 +
|value8=insecte
 +
 +
|text9=<span style="text-overflow: ellipsis; overflow: hidden;" data-t="497">Zodiaque</span>
 +
|value9=zodiaque
 +
 +
|text10=<span style="text-overflow: ellipsis; overflow: hidden;" data-t="488">Aucun</span>
 +
|value10=aucun
 
}}
 
}}
−
</div>
+
}} {{#if:{{{Dégâts|}}}|
−
}} {{#if:{{{Dégât|}}}|
 
−
<div style="position: relative;">
 
 
{{FiltreModule
 
{{FiltreModule
 +
|name=<span data-t="481">Dégâts</span>
 +
|id={{FiltreCorrespondance|Dégât}}
 +
|span=<span class="counter" style="color: rgb(159, 159, 159); font-size: 12px; margin-left: auto;"></span>
 
|Type=Checkbox
 
|Type=Checkbox
−
|id=e4
 
−
|Nom=Dégât
 
−
|param=replace_+_
 
  
−
|Checkbox1=Mêlée
+
|text1=<span style="text-overflow: ellipsis; overflow: hidden;">🗡️ <span data-t="498">Mêlée</span></span>
−
|Checkbox2=Flèche
+
|value1=melee
−
|Checkbox3=Magique
+
 
−
|Checkbox4=Compétence
+
|text2=<span style="text-overflow: ellipsis; overflow: hidden;">🏹 <span data-t="499">Flèche</span></span>
 +
|value2=fleche
  
−
|id1=melee
+
|text3=<span style="text-overflow: ellipsis; overflow: hidden;">🧙 <span data-t="500">Magique</span></span>
−
|id2=fleche
+
|value3=magique
−
|id4=dc
 
  
 +
|text4=<span style="text-overflow: ellipsis; overflow: hidden;">✨ <span data-t="501">Compétence</span></span>
 +
|value4=dc
 +
}}
 
}}
 
}}
 
</div>
 
</div>
−
}}
+
</div>
 
}}<noinclude>[[Catégorie:Nouveaux modèles]]</noinclude>
 
}}<noinclude>[[Catégorie:Nouveaux modèles]]</noinclude>

Version actuelle datée du 6 mars 2025 à 13:25

Filtrer
Filtrer
Récupérée de « https://fr-wiki.metin2.gameforge.com/index.php?title=Modèle:Filtre&oldid=106690 »