更新属性的显示

This commit is contained in:
枫谷剑仙 2020-10-22 17:42:15 +08:00
parent ed2fbfb86e
commit 83e0b04096
19 changed files with 144 additions and 127 deletions

BIN
images/attrs.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 73 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 331 KiB

After

Width:  |  Height:  |  Size: 326 KiB

View File

@ -290,13 +290,13 @@
.search-box::before{ .search-box::before{
content: "Search Cards"; content: "Search Cards";
} }
.search-box .attrs .attr-list-1::before{ .search-box .attrs-div .attr-list-1::before{
content: "Attribute 1:"; content: "Attribute 1:";
} }
.search-box .attrs .attr-list-2::before{ .search-box .attrs-div .attr-list-2::before{
content: "Attribute 2:"; content: "Attribute 2:";
} }
.search-box .attrs .fix-main-color-label::after{ .search-box .attrs-div .fix-main-color-label::after{
content: "Fix attr-1 for main-attr, attr-2 for sub-attr."; content: "Fix attr-1 for main-attr, attr-2 for sub-attr.";
} }
.search-box .consider-equivalent-awoken-label::after{ .search-box .consider-equivalent-awoken-label::after{
@ -332,10 +332,7 @@
.search-box .add-show-abilities-with-awoken-label::after{ .search-box .add-show-abilities-with-awoken-label::after{
content: "Abilities(+Awoken)"; content: "Abilities(+Awoken)";
} }
.attrs .attr-all::before{ .attrs-div .attr[data-attr-icon='-1']::before{
content: "All";
}
.attrs .attr-none::before{
content: "None"; content: "None";
} }
.search-box .types-div::before{ .search-box .types-div::before{

View File

@ -282,13 +282,13 @@
.search-box::before{ .search-box::before{
content: "モンスターの検索"; content: "モンスターの検索";
} }
.search-box .attrs .attr-list-1::before{ .search-box .attrs-div .attr-list-1::before{
content: "属性 1:"; content: "属性 1:";
} }
.search-box .attrs .attr-list-2::before{ .search-box .attrs-div .attr-list-2::before{
content: "属性 2:"; content: "属性 2:";
} }
.search-box .attrs .fix-main-color-label::after{ .search-box .attrs-div .fix-main-color-label::after{
content: "限定 属性 1->主属性,属性 2->副属性"; content: "限定 属性 1->主属性,属性 2->副属性";
} }
.search-box .consider-equivalent-awoken-label::after{ .search-box .consider-equivalent-awoken-label::after{
@ -324,10 +324,7 @@
.search-box .add-show-abilities-with-awoken-label::after{ .search-box .add-show-abilities-with-awoken-label::after{
content: "能力値 (+覚醒)"; content: "能力値 (+覚醒)";
} }
.attrs .attr-all::before{ .attrs-div .attr[data-attr-icon='-1']::before{
content: "無制限";
}
.attrs .attr-none::before{
content: "空"; content: "空";
} }
.search-box .types-div::before{ .search-box .types-div::before{

View File

@ -279,13 +279,13 @@
.search-box::before{ .search-box::before{
content: "몬스터 검색"; content: "몬스터 검색";
} }
.search-box .attrs .attr-list-1::before{ .search-box .attrs-div .attr-list-1::before{
content: "속성 1:"; content: "속성 1:";
} }
.search-box .attrs .attr-list-2::before{ .search-box .attrs-div .attr-list-2::before{
content: "속성 1:"; content: "속성 1:";
} }
.search-box .attrs .fix-main-color-label::after{ .search-box .attrs-div .fix-main-color-label::after{
content: "제한 속성 1은 기본 속성 이며 속성 2 하위 속성입니다."; content: "제한 속성 1은 기본 속성 이며 속성 2 하위 속성입니다.";
} }
.search-box .consider-equivalent-awoken-label::after{ .search-box .consider-equivalent-awoken-label::after{
@ -321,10 +321,7 @@
.search-box .add-show-abilities-with-awoken-label::after{ .search-box .add-show-abilities-with-awoken-label::after{
content: "능력 (+각성)"; content: "능력 (+각성)";
} }
.attrs .attr-all::before{ .attrs-div .attr[data-attr-icon='-1']::before{
content: "무제한";
}
.attrs .attr-none::before{
content: "없음"; content: "없음";
} }
.search-box .types-div::before{ .search-box .types-div::before{

View File

@ -285,13 +285,13 @@
.search-box::before{ .search-box::before{
content: "搜索怪物"; content: "搜索怪物";
} }
.search-box .attrs .attr-list-1::before{ .search-box .attrs-div .attr-list-1::before{
content: "屬性 1"; content: "屬性 1";
} }
.search-box .attrs .attr-list-2::before{ .search-box .attrs-div .attr-list-2::before{
content: "屬性 2"; content: "屬性 2";
} }
.search-box .attrs .fix-main-color-label::after{ .search-box .attrs-div .fix-main-color-label::after{
content: "限制屬性 1 爲主屬性,屬性 2 爲副屬性"; content: "限制屬性 1 爲主屬性,屬性 2 爲副屬性";
} }
.search-box .consider-equivalent-awoken-label::after{ .search-box .consider-equivalent-awoken-label::after{
@ -327,10 +327,7 @@
.search-box .add-show-abilities-with-awoken-label::after{ .search-box .add-show-abilities-with-awoken-label::after{
content: "能力值(+覺醒)"; content: "能力值(+覺醒)";
} }
.attrs .attr-all::before{ .attrs-div .attr[data-attr-icon='-1']::before{
content: "不限";
}
.attrs .attr-none::before{
content: "無"; content: "無";
} }
.search-box .types-div::before{ .search-box .types-div::before{

View File

@ -285,13 +285,13 @@
.search-box::before{ .search-box::before{
content: "搜索怪物"; content: "搜索怪物";
} }
.search-box .attrs .attr-list-1::before{ .search-box .attrs-div .attr-list-1::before{
content: "属性 1"; content: "属性 1";
} }
.search-box .attrs .attr-list-2::before{ .search-box .attrs-div .attr-list-2::before{
content: "属性 2"; content: "属性 2";
} }
.search-box .attrs .fix-main-color-label::after{ .search-box .attrs-div .fix-main-color-label::after{
content: "限制属性 1 为主属性,属性 2 为副属性"; content: "限制属性 1 为主属性,属性 2 为副属性";
} }
.search-box .consider-equivalent-awoken-label::after{ .search-box .consider-equivalent-awoken-label::after{
@ -327,10 +327,7 @@
.search-box .add-show-abilities-with-awoken-label::after{ .search-box .add-show-abilities-with-awoken-label::after{
content: "能力值(+觉醒)"; content: "能力值(+觉醒)";
} }
.attrs .attr-all::before{ .attrs-div .attr[data-attr-icon='-1']::before{
content: "不限";
}
.attrs .attr-none::before{
content: "无"; content: "无";
} }
.search-box .types-div::before{ .search-box .types-div::before{

View File

@ -449,24 +449,24 @@ var formation = new Formation(teamsCount,5);
<div class="edit-box display-none"> <div class="edit-box display-none">
<div class="edit-box-title"><!--修改怪物--></div> <div class="edit-box-title"><!--修改怪物--></div>
<div class="search-box display-none"> <div class="search-box display-none">
<div class="attrs"><!--属性--> <div class="attrs-div"><!--属性-->
<ul class="attr-list attr-list-1"> <ul class="attr-list attr-list-1">
<li><input type="radio" name="attr-1" class="attr-radio" value="all" id="search-attr-1-all" /><label class="attr-all" for="search-attr-1-all"><!--全部--></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="all" id="search-attr-1-any" checked/><label class="attr" data-attr-icon="any" for="search-attr-1-any"><!--任意--></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="0" id="search-attr-1-0" /><label class="attr-t0" for="search-attr-1-0"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="0" id="search-attr-1-0" /><label class="attr" data-attr-icon="0" for="search-attr-1-0"><!----></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="1" id="search-attr-1-1" /><label class="attr-t1" for="search-attr-1-1"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="1" id="search-attr-1-1" /><label class="attr" data-attr-icon="1" for="search-attr-1-1"><!----></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="2" id="search-attr-1-2" /><label class="attr-t2" for="search-attr-1-2"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="2" id="search-attr-1-2" /><label class="attr" data-attr-icon="2" for="search-attr-1-2"><!----></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="3" id="search-attr-1-3" /><label class="attr-t3" for="search-attr-1-3"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="3" id="search-attr-1-3" /><label class="attr" data-attr-icon="3" for="search-attr-1-3"><!----></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="4" id="search-attr-1-4" /><label class="attr-t4" for="search-attr-1-4"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="4" id="search-attr-1-4" /><label class="attr" data-attr-icon="4" for="search-attr-1-4"><!----></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="6" id="search-attr-1-none" /><label class="attr-none" for="search-attr-1-none"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="6" id="search-attr-1-6" /><label class="attr" data-attr-icon="6" for="search-attr-1-6"><!--主属性--></label></li>
</ul> </ul>
<ul class="attr-list attr-list-2"> <ul class="attr-list attr-list-2">
<li><input type="radio" name="attr-2" class="attr-radio" value="all" id="search-attr-2-all" /><label class="attr-all" for="search-attr-2-all"><!--全部--></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="all" id="search-attr-2-any" checked/><label class="attr" data-attr-icon="any" for="search-attr-2-any"><!--任意--></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="0" id="search-attr-2-0" /><label class="attr-t0" for="search-attr-2-0"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="0" id="search-attr-2-0" /><label class="attr" data-attr-icon="0" for="search-attr-2-0"><!----></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="1" id="search-attr-2-1" /><label class="attr-t1" for="search-attr-2-1"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="1" id="search-attr-2-1" /><label class="attr" data-attr-icon="1" for="search-attr-2-1"><!----></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="2" id="search-attr-2-2" /><label class="attr-t2" for="search-attr-2-2"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="2" id="search-attr-2-2" /><label class="attr" data-attr-icon="2" for="search-attr-2-2"><!----></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="3" id="search-attr-2-3" /><label class="attr-t3" for="search-attr-2-3"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="3" id="search-attr-2-3" /><label class="attr" data-attr-icon="3" for="search-attr-2-3"><!----></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="4" id="search-attr-2-4" /><label class="attr-t4" for="search-attr-2-4"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="4" id="search-attr-2-4" /><label class="attr" data-attr-icon="4" for="search-attr-2-4"><!----></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="-1" id="search-attr-2-none" /><label class="attr-none" for="search-attr-2-none"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="-1" id="search-attr-2-none" /><label class="attr" data-attr-icon="-1" for="search-attr-2-none"><!----></label></li>
</ul> </ul>
<input type="checkbox" class="config-checkbox-ipt" name="fix-main-color" id="fix-main-color" checked><label class="config-checkbox-lbl fix-main-color-label" for="fix-main-color"><div class="config-checkbox-lbl-cicle"></div></label> <input type="checkbox" class="config-checkbox-ipt" name="fix-main-color" id="fix-main-color" checked><label class="config-checkbox-lbl fix-main-color-label" for="fix-main-color"><div class="config-checkbox-lbl-cicle"></div></label>
</div> </div>
@ -499,8 +499,8 @@ var formation = new Formation(teamsCount,5);
</ul> </ul>
</div> </div>
<div class="awoken-div"><!--觉醒--> <div class="awoken-div"><!--觉醒-->
<button class="awoken-clear" ></button> <button class="awoken-clear"></button>
<div> <div class="awoken-option">
<input type="checkbox" class="config-checkbox-ipt" name="consider-equivalent-awoken" id="consider-equivalent-awoken" checked><label class="config-checkbox-lbl consider-equivalent-awoken-label" for="consider-equivalent-awoken"><div class="config-checkbox-lbl-cicle"></div></label> <input type="checkbox" class="config-checkbox-ipt" name="consider-equivalent-awoken" id="consider-equivalent-awoken" checked><label class="config-checkbox-lbl consider-equivalent-awoken-label" for="consider-equivalent-awoken"><div class="config-checkbox-lbl-cicle"></div></label>
<input type="checkbox" class="config-checkbox-ipt" name="include-super-awoken" id="include-super-awoken"><label class="config-checkbox-lbl include-super-awoken-label" for="include-super-awoken"><div class="config-checkbox-lbl-cicle"></div></label> <input type="checkbox" class="config-checkbox-ipt" name="include-super-awoken" id="include-super-awoken"><label class="config-checkbox-lbl include-super-awoken-label" for="include-super-awoken"><div class="config-checkbox-lbl-cicle"></div></label>
</div> </div>

View File

@ -1086,8 +1086,8 @@ function initialize() {
searchBox.classList.toggle(className_displayNone); searchBox.classList.toggle(className_displayNone);
}; };
const s_attr1s = Array.from(searchBox.querySelectorAll(".attrs .attr-list-1 .attr-radio")); const s_attr1s = Array.from(searchBox.querySelectorAll(".attrs-div .attr-list-1 .attr-radio"));
const s_attr2s = Array.from(searchBox.querySelectorAll(".attrs .attr-list-2 .attr-radio")); const s_attr2s = Array.from(searchBox.querySelectorAll(".attrs-div .attr-list-2 .attr-radio"));
const s_fixMainColor = searchBox.querySelector("#fix-main-color"); const s_fixMainColor = searchBox.querySelector("#fix-main-color");
const s_typesDiv = searchBox.querySelector(".types-div"); const s_typesDiv = searchBox.querySelector(".types-div");
const s_types = Array.from(s_typesDiv.querySelectorAll(".type-check")); const s_types = Array.from(s_typesDiv.querySelectorAll(".type-check"));

View File

@ -399,24 +399,24 @@ var formation = new Formation(teamsCount,6);
<div class="edit-box display-none"> <div class="edit-box display-none">
<div class="edit-box-title"><!--修改怪物--></div> <div class="edit-box-title"><!--修改怪物--></div>
<div class="search-box display-none"> <div class="search-box display-none">
<div class="attrs"><!--属性--> <div class="attrs-div"><!--属性-->
<ul class="attr-list attr-list-1"> <ul class="attr-list attr-list-1">
<li><input type="radio" name="attr-1" class="attr-radio" value="all" id="search-attr-1-all" /><label class="attr-all" for="search-attr-1-all"><!--全部--></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="all" id="search-attr-1-any" checked/><label class="attr" data-attr-icon="any" for="search-attr-1-any"><!--任意--></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="0" id="search-attr-1-0" /><label class="attr-t0" for="search-attr-1-0"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="0" id="search-attr-1-0" /><label class="attr" data-attr-icon="0" for="search-attr-1-0"><!----></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="1" id="search-attr-1-1" /><label class="attr-t1" for="search-attr-1-1"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="1" id="search-attr-1-1" /><label class="attr" data-attr-icon="1" for="search-attr-1-1"><!----></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="2" id="search-attr-1-2" /><label class="attr-t2" for="search-attr-1-2"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="2" id="search-attr-1-2" /><label class="attr" data-attr-icon="2" for="search-attr-1-2"><!----></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="3" id="search-attr-1-3" /><label class="attr-t3" for="search-attr-1-3"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="3" id="search-attr-1-3" /><label class="attr" data-attr-icon="3" for="search-attr-1-3"><!----></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="4" id="search-attr-1-4" /><label class="attr-t4" for="search-attr-1-4"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="4" id="search-attr-1-4" /><label class="attr" data-attr-icon="4" for="search-attr-1-4"><!----></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="6" id="search-attr-1-none" /><label class="attr-none" for="search-attr-1-none"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="6" id="search-attr-1-6" /><label class="attr" data-attr-icon="6" for="search-attr-1-6"><!--主属性--></label></li>
</ul> </ul>
<ul class="attr-list attr-list-2"> <ul class="attr-list attr-list-2">
<li><input type="radio" name="attr-2" class="attr-radio" value="all" id="search-attr-2-all" /><label class="attr-all" for="search-attr-2-all"><!--全部--></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="all" id="search-attr-2-any" checked/><label class="attr" data-attr-icon="any" for="search-attr-2-any"><!--任意--></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="0" id="search-attr-2-0" /><label class="attr-t0" for="search-attr-2-0"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="0" id="search-attr-2-0" /><label class="attr" data-attr-icon="0" for="search-attr-2-0"><!----></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="1" id="search-attr-2-1" /><label class="attr-t1" for="search-attr-2-1"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="1" id="search-attr-2-1" /><label class="attr" data-attr-icon="1" for="search-attr-2-1"><!----></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="2" id="search-attr-2-2" /><label class="attr-t2" for="search-attr-2-2"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="2" id="search-attr-2-2" /><label class="attr" data-attr-icon="2" for="search-attr-2-2"><!----></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="3" id="search-attr-2-3" /><label class="attr-t3" for="search-attr-2-3"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="3" id="search-attr-2-3" /><label class="attr" data-attr-icon="3" for="search-attr-2-3"><!----></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="4" id="search-attr-2-4" /><label class="attr-t4" for="search-attr-2-4"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="4" id="search-attr-2-4" /><label class="attr" data-attr-icon="4" for="search-attr-2-4"><!----></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="-1" id="search-attr-2-none" /><label class="attr-none" for="search-attr-2-none"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="-1" id="search-attr-2-none" /><label class="attr" data-attr-icon="-1" for="search-attr-2-none"><!----></label></li>
</ul> </ul>
<input type="checkbox" class="config-checkbox-ipt" name="fix-main-color" id="fix-main-color" checked><label class="config-checkbox-lbl fix-main-color-label" for="fix-main-color"><div class="config-checkbox-lbl-cicle"></div></label> <input type="checkbox" class="config-checkbox-ipt" name="fix-main-color" id="fix-main-color" checked><label class="config-checkbox-lbl fix-main-color-label" for="fix-main-color"><div class="config-checkbox-lbl-cicle"></div></label>
</div> </div>
@ -449,8 +449,8 @@ var formation = new Formation(teamsCount,6);
</ul> </ul>
</div> </div>
<div class="awoken-div"><!--觉醒--> <div class="awoken-div"><!--觉醒-->
<button class="awoken-clear" ></button> <button class="awoken-clear"></button>
<div> <div class="awoken-option">
<input type="checkbox" class="config-checkbox-ipt" name="consider-equivalent-awoken" id="consider-equivalent-awoken" checked><label class="config-checkbox-lbl consider-equivalent-awoken-label" for="consider-equivalent-awoken"><div class="config-checkbox-lbl-cicle"></div></label> <input type="checkbox" class="config-checkbox-ipt" name="consider-equivalent-awoken" id="consider-equivalent-awoken" checked><label class="config-checkbox-lbl consider-equivalent-awoken-label" for="consider-equivalent-awoken"><div class="config-checkbox-lbl-cicle"></div></label>
<input type="checkbox" class="config-checkbox-ipt" name="include-super-awoken" id="include-super-awoken"><label class="config-checkbox-lbl include-super-awoken-label" for="include-super-awoken"><div class="config-checkbox-lbl-cicle"></div></label> <input type="checkbox" class="config-checkbox-ipt" name="include-super-awoken" id="include-super-awoken"><label class="config-checkbox-lbl include-super-awoken-label" for="include-super-awoken"><div class="config-checkbox-lbl-cicle"></div></label>
</div> </div>

View File

@ -904,18 +904,46 @@
} }
/*搜索框中用到的属性图片*/ /*搜索框中用到的属性图片*/
.attrs .attr-t0::before{ .attr::before
content: url(images/orb-small-fire.png); {
content:"";
display: inline-block;
width: 32px;
height: 32px;
background-image: url(images/attrs.png);
background-position-y:calc(32px);
background-repeat: no-repeat;
} }
.attrs .attr-t1::before{ .attr[data-attr-icon='any']::before
content: url(images/orb-small-water.png); {
background-position-x: -32px;
background-position-y:calc(-32px * 0);
} }
.attrs .attr-t2::before{ .attr[data-attr-icon='0']::before
content: url(images/orb-small-wood.png); {
background-position-y:calc(-32px * 0);
} }
.attrs .attr-t3::before{ .attr[data-attr-icon='1']::before
content: url(images/orb-small-light.png); {
background-position-y:calc(-32px * 1);
} }
.attrs .attr-t4::before{ .attr[data-attr-icon='2']::before
content: url(images/orb-small-dark.png); {
background-position-y:calc(-32px * 2);
}
.attr[data-attr-icon='3']::before
{
background-position-y:calc(-32px * 3);
}
.attr[data-attr-icon='4']::before
{
background-position-y:calc(-32px * 4);
}
.attr[data-attr-icon='5']::before
{
background-position-y:calc(-32px * 5);
}
.attr[data-attr-icon='6']::before
{
background-position-y:calc(-32px * 6);
} }

View File

@ -909,12 +909,7 @@ ul{
.search-box::before{ .search-box::before{
content: "▼简易搜索"; content: "▼简易搜索";
} }
.attrs .attr-all::before{ */
content: "不限";
}
.attrs .attr-none::before{
content: "无";
}*/
.search-box::before{ .search-box::before{
font-weight: bold; font-weight: bold;
font-size: 1.2em; font-size: 1.2em;
@ -922,26 +917,23 @@ ul{
.search-box>div{ .search-box>div{
margin-bottom: 5px; margin-bottom: 5px;
} }
.search-box>div ul{ .search-box .attrs-div-div>ul{
display: inline-block;
}
.search-box .attrs ul{
display: block; display: block;
} }
.search-box>div ul>li{ .search-box>div>ul>li{
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
font-size:16px; font-size:16px;
overflow: hidden; overflow: hidden;
} }
.search-box>div ul>li>label{ .search-box>div>ul>li>label{
cursor: pointer; cursor: pointer;
display: block; display: block;
text-align: center; text-align: center;
} }
.attrs .attr-list-1::before, .attrs-div .attr-list-1::before,
.attrs .attr-list-2::before, .attrs-div .attr-list-2::before,
.types-div::before, .types-div::before,
.awoken-div::before, .awoken-div::before,
.sawoken-div::before{ .sawoken-div::before{
@ -951,53 +943,61 @@ ul{
margin-right: 3px; margin-right: 3px;
display: inline-block; display: inline-block;
} }
/*.search-box .attrs .attr-list-1::before{ /*.search-box .attrs-div-div .attr-list-1::before{
content: "属性1"; content: "属性1";
} }
.search-box .attrs .attr-list-2::before{ .search-box .attrs-div-div .attr-list-2::before{
content: "属性2"; content: "属性2";
} }
.search-box .attrs .fix-main-color-label::after{ .search-box .attrs-div-div .fix-main-color-label::after{
content: "限制属性1为主属性属性2为副属性"; content: "限制属性1为主属性属性2为副属性";
}*/ }*/
.attr-radio,.type-check,.sawoken-check{ .attr-radio,.type-check,.sawoken-check{
display: none; display: none;
} }
.attrs .attr-list{ .attrs-div .attr-list{
font-size:0; font-size:0;
} }
.attrs .attr-list li{ .attrs-div .attr-list>li{
border: 1px solid white; border: 1px solid white;
border-left: none; border-left: none;
background: #947244; background: #947244;
} }
.attrs .attr-list li:hover{ .attrs-div .attr-list>li:hover{
background: #E9CB9E; background: #E9CB9E;
} }
.attrs .attr-list li:first-of-type{ .attrs-div .attr-list>li:first-of-type{
border-radius: 8px 0 0 8px; border-radius: 8px 0 0 8px;
border-left: 1px solid white; border-left: 1px solid white;
} }
.attrs .attr-list li:last-of-type{ .attrs-div .attr-list>li:last-of-type{
border-radius: 0 8px 8px 0; border-radius: 0 8px 8px 0;
} }
.attrs .attr-list li label{ .attrs-div .attr-list .attr
line-height: 30px; {
width: 55px; width: 55px;
height: 30px; height: 32px;
line-height:32px;
text-align: center;
vertical-align: middle;
} }
.attrs .attr-list input:checked+label{ .attrs-div .attr-list input:checked+label{
background-color:#8C4242; background-color:#8C4242;
box-shadow: inset black 0 0 5px; box-shadow: inset black 0 0 5px;
cursor: auto; cursor: auto;
} }
.attr-list-1{ .attr-list-1{
margin-bottom: 5px; margin-bottom: 5px;
} }
/*.search-box .types-div::before{ /*.search-box .types-div::before{
content: "类型"; content: "类型";
}*/ }*/
.types-div .type-list li label{ .types-div .type-list
{
display: inline-block;
}
.types-div .type-list>li label{
opacity: var(--search-icon-unchecked); opacity: var(--search-icon-unchecked);
} }
.types-div .type-list input:checked~label{ .types-div .type-list input:checked~label{
@ -1007,11 +1007,11 @@ ul{
margin-left: 10px; margin-left: 10px;
margin-right: 0; margin-right: 0;
} }
.types-div .type-list li .types-div .type-list>li
{ {
position: relative; position: relative;
} }
.types-div .type-list li:after .types-div .type-list>li:after
{ {
content: "⚔️"; content: "⚔️";
font-size: 10px; font-size: 10px;
@ -1059,6 +1059,10 @@ ul{
/*.search-box .awoken-div::before{ /*.search-box .awoken-div::before{
content: "觉醒"; content: "觉醒";
}*/ }*/
.search-box .awoken-div .awoken-option
{
display: inline-block;
}
.search-box .awoken-div .awoken-clear::before, .search-box .awoken-div .awoken-clear::before,
.search-box .sawoken-div .sawoken-clear::before .search-box .sawoken-div .sawoken-clear::before
{ {

View File

@ -1094,24 +1094,24 @@ var formation = new Formation(teamsCount,6);
<div class="edit-box display-none"> <div class="edit-box display-none">
<div class="edit-box-title"><!--修改怪物--></div> <div class="edit-box-title"><!--修改怪物--></div>
<div class="search-box display-none"> <div class="search-box display-none">
<div class="attrs"><!--属性--> <div class="attrs-div"><!--属性-->
<ul class="attr-list attr-list-1"> <ul class="attr-list attr-list-1">
<li><input type="radio" name="attr-1" class="attr-radio" value="all" id="search-attr-1-all" /><label class="attr-all" for="search-attr-1-all"><!--全部--></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="all" id="search-attr-1-any" checked/><label class="attr" data-attr-icon="any" for="search-attr-1-any"><!--任意--></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="0" id="search-attr-1-0" /><label class="attr-t0" for="search-attr-1-0"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="0" id="search-attr-1-0" /><label class="attr" data-attr-icon="0" for="search-attr-1-0"><!----></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="1" id="search-attr-1-1" /><label class="attr-t1" for="search-attr-1-1"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="1" id="search-attr-1-1" /><label class="attr" data-attr-icon="1" for="search-attr-1-1"><!----></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="2" id="search-attr-1-2" /><label class="attr-t2" for="search-attr-1-2"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="2" id="search-attr-1-2" /><label class="attr" data-attr-icon="2" for="search-attr-1-2"><!----></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="3" id="search-attr-1-3" /><label class="attr-t3" for="search-attr-1-3"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="3" id="search-attr-1-3" /><label class="attr" data-attr-icon="3" for="search-attr-1-3"><!----></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="4" id="search-attr-1-4" /><label class="attr-t4" for="search-attr-1-4"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="4" id="search-attr-1-4" /><label class="attr" data-attr-icon="4" for="search-attr-1-4"><!----></label></li>
<li><input type="radio" name="attr-1" class="attr-radio" value="6" id="search-attr-1-none" /><label class="attr-none" for="search-attr-1-none"><!----></label></li> <li><input type="radio" name="attr-1" class="attr-radio" value="6" id="search-attr-1-6" /><label class="attr" data-attr-icon="6" for="search-attr-1-6"><!--主属性--></label></li>
</ul> </ul>
<ul class="attr-list attr-list-2"> <ul class="attr-list attr-list-2">
<li><input type="radio" name="attr-2" class="attr-radio" value="all" id="search-attr-2-all" /><label class="attr-all" for="search-attr-2-all"><!--全部--></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="all" id="search-attr-2-any" checked/><label class="attr" data-attr-icon="any" for="search-attr-2-any"><!--任意--></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="0" id="search-attr-2-0" /><label class="attr-t0" for="search-attr-2-0"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="0" id="search-attr-2-0" /><label class="attr" data-attr-icon="0" for="search-attr-2-0"><!----></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="1" id="search-attr-2-1" /><label class="attr-t1" for="search-attr-2-1"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="1" id="search-attr-2-1" /><label class="attr" data-attr-icon="1" for="search-attr-2-1"><!----></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="2" id="search-attr-2-2" /><label class="attr-t2" for="search-attr-2-2"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="2" id="search-attr-2-2" /><label class="attr" data-attr-icon="2" for="search-attr-2-2"><!----></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="3" id="search-attr-2-3" /><label class="attr-t3" for="search-attr-2-3"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="3" id="search-attr-2-3" /><label class="attr" data-attr-icon="3" for="search-attr-2-3"><!----></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="4" id="search-attr-2-4" /><label class="attr-t4" for="search-attr-2-4"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="4" id="search-attr-2-4" /><label class="attr" data-attr-icon="4" for="search-attr-2-4"><!----></label></li>
<li><input type="radio" name="attr-2" class="attr-radio" value="-1" id="search-attr-2-none" /><label class="attr-none" for="search-attr-2-none"><!----></label></li> <li><input type="radio" name="attr-2" class="attr-radio" value="-1" id="search-attr-2-none" /><label class="attr" data-attr-icon="-1" for="search-attr-2-none"><!----></label></li>
</ul> </ul>
<input type="checkbox" class="config-checkbox-ipt" name="fix-main-color" id="fix-main-color" checked><label class="config-checkbox-lbl fix-main-color-label" for="fix-main-color"><div class="config-checkbox-lbl-cicle"></div></label> <input type="checkbox" class="config-checkbox-ipt" name="fix-main-color" id="fix-main-color" checked><label class="config-checkbox-lbl fix-main-color-label" for="fix-main-color"><div class="config-checkbox-lbl-cicle"></div></label>
</div> </div>
@ -1144,8 +1144,8 @@ var formation = new Formation(teamsCount,6);
</ul> </ul>
</div> </div>
<div class="awoken-div"><!--觉醒--> <div class="awoken-div"><!--觉醒-->
<button class="awoken-clear" ></button> <button class="awoken-clear"></button>
<div> <div class="awoken-option">
<input type="checkbox" class="config-checkbox-ipt" name="consider-equivalent-awoken" id="consider-equivalent-awoken" checked><label class="config-checkbox-lbl consider-equivalent-awoken-label" for="consider-equivalent-awoken"><div class="config-checkbox-lbl-cicle"></div></label> <input type="checkbox" class="config-checkbox-ipt" name="consider-equivalent-awoken" id="consider-equivalent-awoken" checked><label class="config-checkbox-lbl consider-equivalent-awoken-label" for="consider-equivalent-awoken"><div class="config-checkbox-lbl-cicle"></div></label>
<input type="checkbox" class="config-checkbox-ipt" name="include-super-awoken" id="include-super-awoken"><label class="config-checkbox-lbl include-super-awoken-label" for="include-super-awoken"><div class="config-checkbox-lbl-cicle"></div></label> <input type="checkbox" class="config-checkbox-ipt" name="include-super-awoken" id="include-super-awoken"><label class="config-checkbox-lbl include-super-awoken-label" for="include-super-awoken"><div class="config-checkbox-lbl-cicle"></div></label>
</div> </div>