枫谷剑仙
7 years ago
6 changed files with 589 additions and 43 deletions
Split View
Diff Options
-
BINimages/awoken.png
-
BINimages/type.png
-
+41 -26index.html
-
+97 -5script.js
-
+299 -1style-monsterimages.css
-
+152 -11style.css
BIN
images/awoken.png
View File
| Before | After |
|---|---|
|
|
| Width: 32 | Height: 2176 | Size: 53 kB |
BIN
images/type.png
View File
| Before | After |
|---|---|
|
|
| Width: 32 | Height: 416 | Size: 13 kB |
+ 41
- 26
index.html
View File
| @@ -3,6 +3,7 @@ | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <title>智龙迷城车队阵型图制作</title> | |||
| <meta name="viewport" content="width=664" /> | |||
| <link href="style.css" rel="stylesheet" type="text/css"> | |||
| <link href="style-monsterimages.css" rel="stylesheet" type="text/css"> | |||
| <script type="text/javascript" src="universal_function.js"></script> | |||
| @@ -10,7 +11,7 @@ | |||
| </head> | |||
| <body> | |||
| <div class="formation-box blur-bg"> | |||
| <div class="formation-box"> | |||
| <div class="title-box"><input type="text" class="title" placeholder="输入阵型标题" /></div> | |||
| <div class="formation-A-bigbox"> | |||
| <div class="formation-A-box"> | |||
| @@ -96,7 +97,7 @@ | |||
| <div class="property"></div> | |||
| <div class="subproperty"></div> | |||
| <div class="addition has297"><div class="hp">99</div><div class="atk">99</div><div class="def">99</div><div class="_297">297</div></div> | |||
| <div class="awoken-icon display-none"></div> | |||
| <div class="awoken-count display-none"></div> | |||
| <div class="level">99</div> | |||
| </a> | |||
| </li> | |||
| @@ -293,12 +294,6 @@ | |||
| </div> | |||
| <div class="edit-box"> | |||
| <div class="edit-box-title"><!--修改怪物--></div> | |||
| <div class="search-box"> | |||
| <div class="mid-label"><!--输入怪物ID--></div> | |||
| <input type="text" class="m-id" list="monsters-list"/> | |||
| <button class="search-button">🔍</button> | |||
| <datalist id="monsters-list"></datalist> | |||
| </div> | |||
| <div class="monsterinfo-box"> | |||
| <a class="monster" target="_blank"> | |||
| <div class="property"></div> | |||
| @@ -307,29 +302,49 @@ | |||
| <div class="monster-id"></div> | |||
| <div class="monster-rare"></div> | |||
| <div class="monster-name"></div> | |||
| <ul class="monster-type"></ul> | |||
| <ul class="monster-type"> | |||
| <li class="type-name"><div class="type-icon"></div></li> | |||
| <li class="type-name"><div class="type-icon"></div></li> | |||
| <li class="type-name"><div class="type-icon"></div></li> | |||
| </ul> | |||
| </div> | |||
| <div class="search-box"> | |||
| <input type="search" class="m-id" list="monsters-list" placeholder="请在此输入怪物ID"/> | |||
| <datalist id="monsters-list"></datalist> | |||
| </div> | |||
| <div class="setting-box"> | |||
| <div class="setting-row"> | |||
| <label>怪物等级<input type="number" class="m-level" min=1 max=110 /></label> | |||
| <button class="m-level-btn-99">Lv99</button> | |||
| <button class="m-level-btn-99">Lv110</button> | |||
| </div> | |||
| <div class="setting-row"> | |||
| <div>怪物觉醒</div> | |||
| <div class="setting-row row-mon-awoken"> | |||
| <!--怪物觉醒--> | |||
| <ul class="m-awoken-ul"> | |||
| <li></li> | |||
| <li class="awoken-icon awoken-count"></li> | |||
| <li class="awoken-icon"></li> | |||
| <li class="awoken-icon"></li> | |||
| <li class="awoken-icon"></li> | |||
| <li class="awoken-icon"></li> | |||
| <li class="awoken-icon"></li> | |||
| <li class="awoken-icon"></li> | |||
| <li class="awoken-icon"></li> | |||
| <li class="awoken-icon"></li> | |||
| <li class="awoken-icon"></li> | |||
| </ul> | |||
| </div> | |||
| <div class="setting-row"> | |||
| <div>怪物加值</div> | |||
| <label>❤️<input type="number" class="m-add-hp" min=0 max=99 /><button class="m-add-hp-btn-99">+99</button></label> | |||
| <label>⚔️<input type="number" class="m-add-atk" min=0 max=99 /><button class="m-add-atk-btn-99">+99</button></label> | |||
| <label>🛡️<input type="number" class="m-add-def" min=0 max=99 /><button class="m-add-def-btn-99">+99</button></label> | |||
| <button class="m-add-btn-297">+297</button> | |||
| <div class="setting-row row-mon-level"> | |||
| <!--怪物等级--> | |||
| <input type="number" class="m-level" min=1 max=110 placeholder="怪物等级"/> | |||
| <button class="m-level-btn-99" value="99">99</button> | |||
| <button class="m-level-btn-110" value="110">110</button> | |||
| </div> | |||
| <div class="setting-row row-mon-addition"> | |||
| <!--怪物加值--> | |||
| <button class="m-add-btn-297">297</button> | |||
| <ul> | |||
| <li class="m-add-hp-li"><input type="number" class="m-add-hp" min=0 max=99 /><button class="m-add-hp-btn-99" value="99">99</button></li> | |||
| <li class="m-add-atk-li"><input type="number" class="m-add-atk" min=0 max=99 /><button class="m-add-atk-btn-99" value="99">99</button></li> | |||
| <li class="m-add-def-li"><input type="number" class="m-add-def" min=0 max=99 /><button class="m-add-def-btn-99" value="99">99</button></li> | |||
| </ul> | |||
| </div> | |||
| <div class="setting-row"> | |||
| <div>潜在觉醒</div> | |||
| <div class="setting-row row-mon-a-awoken"> | |||
| <!--潜在觉醒--> | |||
| <ul class="m-a-awoken-ul"> | |||
| <li></li> | |||
| <li></li> | |||
| @@ -346,7 +361,7 @@ | |||
| </div> | |||
| <div class="button-box"> | |||
| <button class="button-null">留空格子</button> | |||
| <button class="button-delay">防止坐下</button> | |||
| <button class="button-delay">应对威吓</button> | |||
| <button class="button-cancel">取消修改</button> | |||
| <button class="button-done"><!--确认修改--></button> | |||
| </div> | |||
+ 97
- 5
script.js
View File
| @@ -16,13 +16,60 @@ window.onload = function() | |||
| //初始化 | |||
| function initialize() | |||
| { | |||
| console.log(ms); | |||
| var monstersList = document.querySelector("#monsters-list"); | |||
| ms.forEach(function(m){ | |||
| var opt = monstersList.appendChild(document.createElement("option")); | |||
| opt.value = m.id; | |||
| opt.label = m.id + " | " + m.name + " | " + m.ename; | |||
| }); | |||
| //编辑框 | |||
| var editBox = document.querySelector(".edit-box"); | |||
| var settingBox = editBox.querySelector(".setting-box") | |||
| var monstersSearch = editBox.querySelector(".edit-box .m-id"); | |||
| monstersSearch.onchange = function(){ | |||
| if (/^\d+$/.test(this.value)) | |||
| { | |||
| editChangeMonId(parseInt(this.value)); | |||
| } | |||
| } | |||
| monstersSearch.oninput = monstersSearch.onchange; | |||
| var monEditAwokens = Array.prototype.slice.call(settingBox.querySelectorAll(".m-awoken-ul>.awoken-icon")); | |||
| monEditAwokens.forEach(function(akDom,idx,domArr){ | |||
| akDom.onclick = function(){ | |||
| if (idx >= domArr.filter(function(d){return !d.classList.contains("display-none")}).length-1) | |||
| domArr[0].innerHTML = "★"; | |||
| else | |||
| domArr[0].innerHTML = idx; | |||
| for(var ai=1;ai<domArr.length;ai++) | |||
| { | |||
| if(ai<=idx) | |||
| domArr[ai].classList.remove("unselected-awoken"); | |||
| else | |||
| domArr[ai].classList.add("unselected-awoken"); | |||
| } | |||
| } | |||
| }) | |||
| var monEditLv = settingBox.querySelector(".m-level"); | |||
| var monEditLv99 = settingBox.querySelector(".m-level-btn-99"); | |||
| var monEditLv110 = settingBox.querySelector(".m-level-btn-110"); | |||
| monEditLv99.onclick = function(){ | |||
| monEditLv.value = this.value; | |||
| } | |||
| monEditLv110.onclick = monEditLv99.onclick; | |||
| var monEditAddHp = settingBox.querySelector(".m-add-hp"); | |||
| var monEditAddAtk = settingBox.querySelector(".m-add-atk"); | |||
| var monEditAddDef = settingBox.querySelector(".m-add-def"); | |||
| var monEditAddHp99 = settingBox.querySelector(".m-add-hp-btn-99"); | |||
| monEditAddHp99.onclick = function(){monEditAddHp.value = this.value} | |||
| var monEditAddAtk99 = settingBox.querySelector(".m-add-atk-btn-99"); | |||
| monEditAddAtk99.onclick = function(){monEditAddAtk.value = this.value} | |||
| var monEditAddDef99 = settingBox.querySelector(".m-add-def-btn-99"); | |||
| monEditAddDef99.onclick = function(){monEditAddDef.value = this.value} | |||
| var monEditAdd297 = settingBox.querySelector(".m-add-btn-297"); | |||
| monEditAdd297.onclick = function(){monEditAddHp.value = monEditAddAtk.value = monEditAddDef.value = 99} | |||
| test(); | |||
| } | |||
| function changeid(mon,monDom,awokenDom) | |||
| @@ -35,7 +82,7 @@ function changeid(mon,monDom,awokenDom) | |||
| mon.addition | |||
| mon.acquisitusAwoken | |||
| */ | |||
| if (mon.id) //如果提供了id | |||
| if (mon.id>-1) //如果提供了id | |||
| { | |||
| monDom.className = "monster"; | |||
| monDom.classList.add("pet-cards-" + Math.ceil(mon.id/100)); //添加图片编号 | |||
| @@ -47,13 +94,13 @@ function changeid(mon,monDom,awokenDom) | |||
| monDom.title = "No." + mon.id + " " + md.name; | |||
| monDom.href = "http://pad.skyozora.com/pets/" + mon.id; | |||
| } | |||
| if (mon.level) //如果提供了等级 | |||
| if (mon.level>0) //如果提供了等级 | |||
| { | |||
| monDom.querySelector(".level").innerHTML = mon.level || 99; | |||
| } | |||
| if (mon.awoken) //如果提供了觉醒 | |||
| if (mon.awoken>-1) //如果提供了觉醒 | |||
| { | |||
| var awokenIcon = monDom.querySelector(".awoken-icon"); | |||
| var awokenIcon = monDom.querySelector(".awoken-count"); | |||
| if (mon.awoken == 0 || md.awoken.length < 1) //没觉醒 | |||
| { | |||
| awokenIcon.classList.add("display-none"); | |||
| @@ -97,4 +144,49 @@ awoken:8, | |||
| addition:[99,99,99], | |||
| acquisitusAwoken:[], | |||
| },m1,a1) | |||
| editChangeMonId(3264); | |||
| } | |||
| function editChangeMonId(id) | |||
| { | |||
| var md = ms[id]; //怪物固定数据 | |||
| if (!md){ | |||
| id = 0; | |||
| md = ms[0] | |||
| } | |||
| var monInfoBox = document.querySelector(".edit-box .monsterinfo-box"); | |||
| var me = monInfoBox.querySelector(".monster"); | |||
| changeid({id:id,},me); //改变图像 | |||
| var mId = monInfoBox.querySelector(".monster-id"); | |||
| mId.innerHTML = id; | |||
| var mRare = monInfoBox.querySelector(".monster-rare"); | |||
| mRare.className = "monster-rare rare-" + md.rare; | |||
| var mName = monInfoBox.querySelector(".monster-name"); | |||
| mName.innerHTML = md.name; | |||
| var mType = monInfoBox.querySelector(".monster-type").children; | |||
| for (var ti=0;ti<mType.length;ti++) | |||
| { | |||
| if (md.type[ti]) | |||
| { | |||
| mType[ti].className = "type-name type-name-" + md.type[ti]; | |||
| mType[ti].firstChild.className = "type-icon type-icon-" + md.type[ti]; | |||
| }else | |||
| { | |||
| mType[ti].className = "display-none"; | |||
| } | |||
| } | |||
| var monSettingBox = document.querySelector(".edit-box .setting-box"); | |||
| var mAwoken = monSettingBox.querySelector(".m-awoken-ul").children; | |||
| mAwoken[0].innerHTML = md.awoken.length?"★":"0"; | |||
| for (var ai=1;ai<mAwoken.length;ai++) | |||
| { | |||
| if (md.awoken[ai-1]) | |||
| { | |||
| mAwoken[ai].className = "awoken-icon awoken-" + md.awoken[ai-1]; | |||
| }else | |||
| { | |||
| mAwoken[ai].className = "display-none"; | |||
| } | |||
| } | |||
| } | |||
+ 299
- 1
style-monsterimages.css
View File
| @@ -156,4 +156,302 @@ | |||
| .pet-cards-index-y-6{background-position-y:-612px;} | |||
| .pet-cards-index-y-7{background-position-y:-714px;} | |||
| .pet-cards-index-y-8{background-position-y:-816px;} | |||
| .pet-cards-index-y-9{background-position-y:-918px;} | |||
| .pet-cards-index-y-9{background-position-y:-918px;} | |||
| /*觉醒和类型*/ | |||
| .awoken-icon,.type-icon{ | |||
| display:inline-block; | |||
| width:32px;height:32px; | |||
| vertical-align: middle; | |||
| background-repeat: no-repeat; | |||
| } | |||
| /*觉醒*/ | |||
| .awoken-icon{ | |||
| background-image: url(images/awoken.png); | |||
| } | |||
| .awoken-0{/*问号*/ | |||
| background-position: 0 0; | |||
| } | |||
| .awoken-1{/*HP+*/ | |||
| background-position: 0px -32px; | |||
| } | |||
| .awoken-2{/*攻击+*/ | |||
| background-position: 0px -64px; | |||
| } | |||
| .awoken-3{/*回复+*/ | |||
| background-position: 0px -96px; | |||
| } | |||
| .awoken-4{/*火盾*/ | |||
| background-position: 0px -128px; | |||
| } | |||
| .awoken-5{/*水盾*/ | |||
| background-position: 0px -160px; | |||
| } | |||
| .awoken-6{/*木盾*/ | |||
| background-position: 0px -192px; | |||
| } | |||
| .awoken-7{/*光盾*/ | |||
| background-position: 0px -224px; | |||
| } | |||
| .awoken-8{/*暗盾*/ | |||
| background-position: 0px -256px; | |||
| } | |||
| .awoken-9{/*自回*/ | |||
| background-position: 0px -288px; | |||
| } | |||
| .awoken-10{/*防封*/ | |||
| background-position: 0px -320px; | |||
| } | |||
| .awoken-11{/*防暗*/ | |||
| background-position: 0px -352px; | |||
| } | |||
| .awoken-12{/*防废*/ | |||
| background-position: 0px -384px; | |||
| } | |||
| .awoken-13{/*防毒*/ | |||
| background-position: 0px -416px; | |||
| } | |||
| .awoken-14{/*火+*/ | |||
| background-position: 0px -448px; | |||
| } | |||
| .awoken-15{/*水+*/ | |||
| background-position: 0px -480px; | |||
| } | |||
| .awoken-16{/*木+*/ | |||
| background-position: 0px -512px; | |||
| } | |||
| .awoken-17{/*光+*/ | |||
| background-position: 0px -544px; | |||
| } | |||
| .awoken-18{/*暗+*/ | |||
| background-position: 0px -576px; | |||
| } | |||
| .awoken-19{/*手指*/ | |||
| background-position: 0px -608px; | |||
| } | |||
| .awoken-20{/*心解*/ | |||
| background-position: 0px -640px; | |||
| } | |||
| .awoken-21{/*SB*/ | |||
| background-position: 0px -672px; | |||
| } | |||
| .awoken-22{/*火横*/ | |||
| background-position: 0px -704px; | |||
| } | |||
| .awoken-23{/*水横*/ | |||
| background-position: 0px -736px; | |||
| } | |||
| .awoken-24{/*木横*/ | |||
| background-position: 0px -768px; | |||
| } | |||
| .awoken-25{/*光横*/ | |||
| background-position: 0px -800px; | |||
| } | |||
| .awoken-26{/*暗横*/ | |||
| background-position: 0px -832px; | |||
| } | |||
| .awoken-27{/*U*/ | |||
| background-position: 0px -864px; | |||
| } | |||
| .awoken-28{/*SX*/ | |||
| background-position: 0px -896px; | |||
| } | |||
| .awoken-29{/*心+*/ | |||
| background-position: 0px -928px; | |||
| } | |||
| .awoken-30{/*协力*/ | |||
| background-position: 0px -960px; | |||
| } | |||
| .awoken-31{/*龙杀*/ | |||
| background-position: 0px -992px; | |||
| } | |||
| .awoken-32{/*神杀*/ | |||
| background-position: 0px -1024px; | |||
| } | |||
| .awoken-33{/*恶魔杀*/ | |||
| background-position: 0px -1056px; | |||
| } | |||
| .awoken-34{/*机杀*/ | |||
| background-position: 0px -1088px; | |||
| } | |||
| .awoken-35{/*平衡杀*/ | |||
| background-position: 0px -1120px; | |||
| } | |||
| .awoken-36{/*攻击杀*/ | |||
| background-position: 0px -1152px; | |||
| } | |||
| .awoken-37{/*体力杀*/ | |||
| background-position: 0px -1184px; | |||
| } | |||
| .awoken-38{/*回复杀*/ | |||
| background-position: 0px -1216px; | |||
| } | |||
| .awoken-39{/*进化杀*/ | |||
| background-position: 0px -1248px; | |||
| } | |||
| .awoken-40{/*觉醒杀*/ | |||
| background-position: 0px -1280px; | |||
| } | |||
| .awoken-41{/*强化杀*/ | |||
| background-position: 0px -1312px; | |||
| } | |||
| .awoken-42{/*卖钱杀*/ | |||
| background-position: 0px -1344px; | |||
| } | |||
| .awoken-43{/*7c*/ | |||
| background-position: 0px -1376px; | |||
| } | |||
| .awoken-44{/*5色破防*/ | |||
| background-position: 0px -1408px; | |||
| } | |||
| .awoken-45{/*心追*/ | |||
| background-position: 0px -1440px; | |||
| } | |||
| .awoken-46{/*全体HP*/ | |||
| background-position: 0px -1472px; | |||
| } | |||
| .awoken-47{/*全体回复*/ | |||
| background-position: 0px -1504px; | |||
| } | |||
| .awoken-48{/*破无效*/ | |||
| background-position: 0px -1536px; | |||
| } | |||
| .awoken-49{/*武器觉醒*/ | |||
| background-position: 0px -1568px; | |||
| } | |||
| .awoken-50{/*方块心追*/ | |||
| background-position: 0px -1600px; | |||
| } | |||
| .awoken-51{/*5色溜*/ | |||
| background-position: 0px -1632px; | |||
| } | |||
| .awoken-52{/*大防封*/ | |||
| background-position: 0px -1664px; | |||
| } | |||
| .awoken-53{/*大手指*/ | |||
| background-position: 0px -1696px; | |||
| } | |||
| .awoken-54{/*防云*/ | |||
| background-position: 0px -1728px; | |||
| } | |||
| .awoken-55{/*防封条*/ | |||
| background-position: 0px -1760px; | |||
| } | |||
| .awoken-56{/*大SB*/ | |||
| background-position: 0px -1792px; | |||
| } | |||
| .awoken-57{/*满血强化*/ | |||
| background-position: 0px -1824px; | |||
| } | |||
| .awoken-58{/*下半血强化*/ | |||
| background-position: 0px -1856px; | |||
| } | |||
| .awoken-59{/*L盾*/ | |||
| background-position: 0px -1888px; | |||
| } | |||
| .awoken-60{/*L解锁*/ | |||
| background-position: 0px -1920px; | |||
| } | |||
| .awoken-61{/*10c*/ | |||
| background-position: 0px -1952px; | |||
| } | |||
| .awoken-62{/*c珠*/ | |||
| background-position: 0px -1984px; | |||
| } | |||
| .awoken-63{/*语音*/ | |||
| background-position: 0px -2016px; | |||
| } | |||
| .awoken-64{/*奖励增加*/ | |||
| background-position: 0px -2048px; | |||
| } | |||
| .awoken-65{/*HP-*/ | |||
| background-position: 0px -2080px; | |||
| } | |||
| .awoken-66{/*攻击-*/ | |||
| background-position: 0px -2112px; | |||
| } | |||
| .awoken-67{/*回复-*/ | |||
| background-position: 0px -2144px; | |||
| } | |||
| /*类型*/ | |||
| .type-icon{ | |||
| background-image: url(images/type.png); | |||
| background-position: 0px 32px; /*默认不显示*/ | |||
| } | |||
| .type-icon-4{/*龙*/ | |||
| background-position: 0px 0px; | |||
| } | |||
| .type-name-4::after{ | |||
| content: "龙"; | |||
| } | |||
| .type-icon-5{/*神*/ | |||
| background-position: 0px -32px; | |||
| } | |||
| .type-name-5::after{ | |||
| content: "神"; | |||
| } | |||
| .type-icon-7{/*恶魔*/ | |||
| background-position: 0px -64px; | |||
| } | |||
| .type-name-7::after{ | |||
| content: "恶魔"; | |||
| } | |||
| .type-icon-8{/*机械*/ | |||
| background-position: 0px -96px; | |||
| } | |||
| .type-name-8::after{ | |||
| content: "机械"; | |||
| } | |||
| .type-icon-1{/*平衡*/ | |||
| background-position: 0px -128px; | |||
| } | |||
| .type-name-1::after{ | |||
| content: "平衡"; | |||
| } | |||
| .type-icon-6{/*攻击*/ | |||
| background-position: 0px -160px; | |||
| } | |||
| .type-name-6::after{ | |||
| content: "攻击"; | |||
| } | |||
| .type-icon-2{/*体力*/ | |||
| background-position: 0px -192px; | |||
| } | |||
| .type-name-2::after{ | |||
| content: "体力"; | |||
| } | |||
| .type-icon-3{/*回复*/ | |||
| background-position: 0px -224px; | |||
| } | |||
| .type-name-3::after{ | |||
| content: "回复"; | |||
| } | |||
| .type-icon-0{/*进化用*/ | |||
| background-position: 0px -256px; | |||
| } | |||
| .type-name-0::after{ | |||
| content: "进化用"; | |||
| } | |||
| .type-icon-12{/*能力觉醒用*/ | |||
| background-position: 0px -288px; | |||
| } | |||
| .type-name-12::after{ | |||
| content: "能力觉醒用"; | |||
| } | |||
| .type-icon-14{/*强化合成用*/ | |||
| background-position: 0px -320px; | |||
| } | |||
| .type-name-14::after{ | |||
| content: "强化合成用"; | |||
| } | |||
| .type-icon-15{/*贩卖用*/ | |||
| background-position: 0px -352px; | |||
| } | |||
| .type-name-15::after{/*龙*/ | |||
| content: "贩卖用"; | |||
| } | |||
| .type-icon-9{/*特殊*/ | |||
| background-position: 0px -384px; | |||
| } | |||
| .type-name-9::after{ | |||
| content: "特殊"; | |||
| } | |||
+ 152
- 11
style.css
View File
| @@ -15,6 +15,8 @@ ul{ | |||
| } | |||
| /*队伍的整个盒子*/ | |||
| .formation-box{ | |||
| width: 648px; | |||
| background: rgb(119, 167, 255); | |||
| } | |||
| /*辅助行*/ | |||
| .formation-assist{ | |||
| @@ -32,7 +34,6 @@ ul{ | |||
| background-image: url(images/001.png); | |||
| background-repeat: no-repeat; | |||
| position: relative; | |||
| margin: 4px; /*留给队长边框的*/ | |||
| } | |||
| /*怪物属性*/ | |||
| .property,.subproperty{ | |||
| @@ -72,7 +73,7 @@ ul{ | |||
| display:block; | |||
| } | |||
| /*怪物-觉醒*/ | |||
| .monster .awoken-icon{ | |||
| .monster .awoken-count{ | |||
| color: yellow; | |||
| font-size: 18px; | |||
| line-height: 24px; | |||
| @@ -86,9 +87,6 @@ ul{ | |||
| position: absolute; | |||
| right: 0; | |||
| } | |||
| .monster .awoken-icon.awoken-none{ | |||
| display:none; | |||
| } | |||
| /*怪物-等级*/ | |||
| .monster .level{ | |||
| color: white; | |||
| @@ -108,6 +106,9 @@ ul{ | |||
| position: relative; | |||
| width: 108px; | |||
| } | |||
| .formation-box .monster{ | |||
| margin: 4px; /*留给队长边框的*/ | |||
| } | |||
| /* | |||
| .assist:first-of-type, .team:first-of-type { | |||
| margin-left: 0px; | |||
| @@ -208,28 +209,168 @@ ul{ | |||
| filter:blur(5px); | |||
| } | |||
| .edit-box{ | |||
| background-color: rgba(0,100,100,0.2); | |||
| background-color: rgba(200,255,200,0.8); | |||
| text-shadow: white 0 0 2px; | |||
| position: absolute; | |||
| left:0; | |||
| top:0; | |||
| width:100%; | |||
| height:100%; | |||
| padding: 10px; | |||
| box-sizing: border-box; | |||
| width:664px; /*测试时手机上的最大宽度*/ | |||
| } | |||
| .edit-box-title{ | |||
| text-align: center; | |||
| font-size: 25px; | |||
| font-size: 2em; | |||
| font-weight: bold; | |||
| content: "修改怪物"; | |||
| } | |||
| .edit-box .edit-box-title::before{ | |||
| content: "修改怪物"; | |||
| } | |||
| .setting-row{ | |||
| width: 100%; | |||
| } | |||
| .edit-box .search-box::before{ | |||
| content: "怪物ID"; | |||
| } | |||
| .edit-box .search-box .m-id{ | |||
| box-sizing: border-box; | |||
| font-size: 25px; | |||
| height: 40px; | |||
| width: 100%; | |||
| } | |||
| .edit-box .search-box .search-button{ | |||
| width: 100%; | |||
| height: 40px; | |||
| font-size: 25px; | |||
| } | |||
| .edit-box .monsterinfo-box{ | |||
| height: 100px; | |||
| margin: 5px 0; | |||
| } | |||
| .monsterinfo-box .monster{ | |||
| margin-right:5px; | |||
| } | |||
| .monsterinfo-box .monster-id{ | |||
| display:inline-block; | |||
| width:150px; | |||
| } | |||
| .monsterinfo-box .monster-id::before{ | |||
| content: "No."; | |||
| } | |||
| .monsterinfo-box .monster-rare{ | |||
| display:inline-block; | |||
| } | |||
| .monsterinfo-box .monster-rare::before{ | |||
| color:gold; | |||
| text-shadow: black 0 0 3px; | |||
| } | |||
| .rare-1::before{content: "★";} | |||
| .rare-2::before{content: "★★";} | |||
| .rare-3::before{content: "★★★";} | |||
| .rare-4::before{content: "★★★★";} | |||
| .rare-5::before{content: "★★★★★";} | |||
| .rare-6::before{content: "★★★★★★";} | |||
| .rare-7::before{content: "★★★★★★★";} | |||
| .rare-8::before{content: "★★★★★★★★";} | |||
| .rare-9::before{content: "★★★★★★★★★";} | |||
| .rare-10::before{content: "★★★★★★★★★★";} | |||
| .monsterinfo-box .monster-id,.monsterinfo-box .monster-rare,.monsterinfo-box .monster-name{ | |||
| vertical-align: top; | |||
| margin:0; | |||
| height: 34px; | |||
| font-size: 22px; | |||
| } | |||
| .monsterinfo-box .monster-type .type-name{ | |||
| display:inline-block; | |||
| } | |||
| .monsterinfo-box .monster-type .type-icon{ | |||
| margin-right:3px; | |||
| } | |||
| .monsterinfo-box .monster-type .type-name::after{ | |||
| vertical-align: middle; | |||
| font-size: 22px; | |||
| } | |||
| .edit-box .search-box .mid-label::before{ | |||
| content: "请输入怪物ID后点击搜索按钮"; | |||
| .edit-box .setting-box .row-mon-level::before{ | |||
| content: "怪物等级"; | |||
| display: block; | |||
| } | |||
| .edit-box .setting-box .m-level{ | |||
| font-size: 25px; | |||
| height: 40px; | |||
| width: calc(100% - 200px); | |||
| box-sizing: border-box; | |||
| } | |||
| .m-level-btn-99,.m-level-btn-110{ | |||
| height: 40px; | |||
| width: 90px; | |||
| box-sizing: border-box; | |||
| font-size: 25px; | |||
| } | |||
| .m-level-btn-99::before,.m-level-btn-110::before{ | |||
| content: "Lv"; | |||
| } | |||
| .edit-box .setting-box .row-mon-awoken::before{ | |||
| content: "怪物觉醒"; | |||
| } | |||
| .row-mon-awoken .m-awoken-ul{ | |||
| height: 32px; | |||
| } | |||
| .m-awoken-ul .awoken-icon{ | |||
| cursor: pointer; | |||
| } | |||
| .m-awoken-ul .awoken-icon.unselected-awoken{ | |||
| opacity: 0.3; | |||
| } | |||
| .awoken-icon.awoken-count{ | |||
| color: yellow; | |||
| font-size: 22px; | |||
| line-height: 28px; | |||
| font-weight: bold; | |||
| text-shadow: black 0 0 4px; | |||
| text-align: center; | |||
| } | |||
| .edit-box .setting-box .row-mon-addition::before{ | |||
| content: "怪物加值"; | |||
| display: block; | |||
| } | |||
| .setting-box .m-add-hp,.setting-box .m-add-atk,.setting-box .m-add-def{ | |||
| font-size: 25px; | |||
| height: 40px; | |||
| width: calc(100% - 212px); | |||
| box-sizing: border-box; | |||
| } | |||
| .m-add-hp-li::before,.m-add-atk-li::before,.m-add-def-li::before{ | |||
| font-size: 25px; | |||
| width: 55px; | |||
| display: inline-block; | |||
| } | |||
| .m-add-hp-li::before{content: "HP";} | |||
| .m-add-atk-li::before{content: "攻击";} | |||
| .m-add-def-li::before{content: "回复";} | |||
| .m-add-hp-btn-99,.m-add-atk-btn-99,.m-add-def-btn-99{ | |||
| height: 40px; | |||
| width: 70px; | |||
| box-sizing: border-box; | |||
| font-size: 25px; | |||
| } | |||
| .m-add-hp-btn-99::before,.m-add-atk-btn-99::before,.m-add-def-btn-99::before,.m-add-btn-297::before{ | |||
| content: "+"; | |||
| } | |||
| .m-add-btn-297{ | |||
| float:right; | |||
| width: 85px; | |||
| height: 120px; | |||
| box-sizing: border-box; | |||
| font-size: 25px; | |||
| } | |||
| .edit-box .setting-box .row-mon-a-awoken::before{ | |||
| content: "潜在觉醒"; | |||
| } | |||
| .edit-box .button-box .button-done::after{ | |||
| content: "确认修改"; | |||
| } | |||