From 9e7e5eba2c11612369fec260a89eaaeeb6bfd7f6 Mon Sep 17 00:00:00 2001 From: Tipx-L <138244655+Tipx-L@users.noreply.github.com> Date: Wed, 20 Sep 2023 02:38:09 -0700 Subject: [PATCH] Optimize ui.click.charactercard alongside all related code. --- character/diy.js | 2 +- character/sp.js | 50 +- character/sp2.js | 3 + character/tw.js | 48 ++ character/xianding.js | 2 +- game/game.js | 270 +++++-- layout/default/menu.css | 1601 +++++++++++++++++++++++++-------------- 7 files changed, 1259 insertions(+), 717 deletions(-) diff --git a/character/diy.js b/character/diy.js index 6aee4ad77..c997b5a45 100755 --- a/character/diy.js +++ b/character/diy.js @@ -19199,7 +19199,7 @@ game.import('character',function(lib,game,ui,get,ai,_status){ 雾岛佳乃:['Kirishima','Kano'], 苍井绘梨花:['Aoi','Erika'], 藏里见:['Kura','Satomi'], - 喵呜·喵呼:['Myau','Mya-fu'], + '喵呜·喵呼':['Myau','Mya-fu'], 喵呜喵呼:['Myau','Mya-fu'], 伊吹风子:['Ibuki','Fuuko'], 久岛鸥:['Kushima','Kamome'], diff --git a/character/sp.js b/character/sp.js index 521bdb11a..90e62fffd 100755 --- a/character/sp.js +++ b/character/sp.js @@ -192,9 +192,7 @@ game.import('character',function(lib,game,ui,get,ai,_status){ xizhicai:['male','wei',3,['tiandu','xianfu','chouce']], quyi:['male','qun',4,['fuqi','jiaozi']], - luzhi:['male','wei',3,['qingzhong','weijing']], - - //kaisa:["male","western",4,["zhengfu"]], + luzhi:['male','wei',3,['qingzhong','weijing']] }, characterIntro:{ caoxi:'曹羲（？－249年），字昭叔。曹真之子，曹爽之弟。为人有学识，明律法。司马懿曾组织朝议改革九品中正制废除九品而留中正，曹羲认为此举并无区别，最终都是决定于人的人治。曹爽掌权后，受封中领军，掌握禁兵，封安乡侯。曹爽及诸兄弟轻视司马懿，恣意妄为，经常外出狩猎，曹羲屡次劝谏，不被采纳。249年，司马懿发动高平陵政变，被夷三族。', @@ -12907,47 +12905,6 @@ game.import('character',function(lib,game,ui,get,ai,_status){ }, }, }, - //英文版特典武将凯撒 - zhengfu:{ - trigger:{ - player:"useCardToPlayered", - }, - check:function (event,player){ - return get.attitude(player,event.target)<0; - }, - filter:function(event,player){ - return event.card.name=='sha'; - }, - logTarget:"target", - line:false, - content:function (){ - 'step 0' - player.line(trigger.target,{color:[220, 90, 139]}); - player.chooseControl(['basic','trick','equip']).set('ai',function(){ - var player=_status.event.target; - if(!player.countCards('h','sha')&&player.countCards('h','shan')) return 'trick'; - return 'basic'; - }).set('prompt','请选择一种牌的类别').set('target',trigger.target); - 'step 1' - trigger.target.chooseCard('he','交给'+get.translation(player)+'一张'+get.translation(result.control)+'牌，否则此【杀】不可被闪避。',function(card){ - return get.type(card,'trick')==result.control; - }).set('ai',function(card){ - var num=_status.event.num; - if(num==0) return 0; - if(card.name=='shan') return num>1?2:0; - return 8-get.value(card); - }).set('num',trigger.target.countCards('h','shan')) - 'step 2' - if(result.bool){ - var cards=result.cards; - trigger.target.give(cards,player); - } - else{ - trigger.getParent().directHit.add(trigger.target); - game.delay(); - } - }, - }, //变权移植 wanwei:{ trigger:{target:['rewriteGainResult','rewriteDiscardResult']}, @@ -24141,7 +24098,6 @@ game.import('character',function(lib,game,ui,get,ai,_status){ lvfan:'吕范', liqueguosi:'李傕郭汜', cuimao:'崔琰毛玠', - kaisa:"凯撒", caoying:"曹婴", @@ -24211,8 +24167,6 @@ game.import('character',function(lib,game,ui,get,ai,_status){ "zhenwei_three_info":"锁定技，敌方角色至己方其他角色的距离+1。", "huanshi_three":"缓释", "huanshi_three_info":"一名友方角色的判定牌生效前，你可打出一张牌代替之。", - zhengfu:"征服", - "zhengfu_info":"当你使用【杀】指定目标时，你可以选择一种牌的类别，然后除非目标角色交给你一种该类别的牌，否则其不能闪避此【杀】。", yizan:"翊赞", yizan_info:"你可以将两张牌（其中至少一张是基本牌）当任意基本牌牌使用", @@ -25141,6 +25095,6 @@ game.import('character',function(lib,game,ui,get,ai,_status){ sp_guozhan2:"国战移植", sp_others:"其他", sp_waitforsort:'等待分包', - }, + } }; }); diff --git a/character/sp2.js b/character/sp2.js index a73de5d08..fec3c335a 100644 --- a/character/sp2.js +++ b/character/sp2.js @@ -10523,5 +10523,8 @@ game.import('character',function(lib,game,ui,get,ai,_status){ sp_danqi:'千里单骑', sp_decade:'其他新服武将', }, + pinyins:{ + 卑弥呼:['Himiko'] + } }; }); diff --git a/character/tw.js b/character/tw.js index 1e8e80656..606ca0d69 100644 --- a/character/tw.js +++ b/character/tw.js @@ -13956,6 +13956,47 @@ game.import('character',function(lib,game,ui,get,ai,_status){ } }, }, + //英文版特典武将凯撒 + zhengfu:{ + trigger:{ + player:"useCardToPlayered", + }, + check:function (event,player){ + return get.attitude(player,event.target)<0; + }, + filter:function(event,player){ + return event.card.name=='sha'; + }, + logTarget:"target", + line:false, + content:function(){ + 'step 0' + player.line(trigger.target,{color:[220, 90, 139]}); + player.chooseControl(['basic','trick','equip']).set('ai',function(){ + var player=_status.event.target; + if(!player.countCards('h','sha')&&player.countCards('h','shan')) return 'trick'; + return 'basic'; + }).set('prompt','请选择一种牌的类别').set('target',trigger.target); + 'step 1' + trigger.target.chooseCard('he','交给'+get.translation(player)+'一张'+get.translation(result.control)+'牌，否则此【杀】不可被闪避。',function(card){ + return get.type(card,'trick')==_status.event.getParent().result.control; + }).set('ai',function(card){ + var num=_status.event.num; + if(num==0) return 0; + if(card.name=='shan') return num>1?2:0; + return 8-get.value(card); + }).set('num',trigger.target.countCards('h','shan')) + 'step 2' + if(result.bool){ + var cards=result.cards; + trigger.target.give(cards,player); + } + else{ + trigger.getParent().directHit.add(trigger.target); + game.delay(); + } + } + } }, perfectPair:{ tw_liufuren:['yuanshao'], @@ -14516,6 +14557,9 @@ game.import('character',function(lib,game,ui,get,ai,_status){ twquanqian_info:'昂扬技。出牌阶段限一次，你可以将至多四张花色各不相同的手牌交给一名其他角色，然后若你交出的牌数大于1，则你从牌堆中获得一张装备牌，然后选择一项：①将手牌数摸至与其相同；②观看其手牌并获得其一种花色的所有牌。
激昂：你弃置六张手牌。', twrouke:'柔克', twrouke_info:'锁定技。当你于摸牌阶段外得到超过一张牌时，你摸一张牌。', + kaisa:"凯撒", + zhengfu:"征服", + zhengfu_info:"当你使用【杀】指定目标时，你可以选择一种牌的类别，然后除非目标角色交给你一种该类别的牌，否则其不能闪避此【杀】。", tw_mobile:'海外服·稀有专属', tw_yunchouzhi:'运筹帷幄·智', @@ -14529,6 +14573,10 @@ game.import('character',function(lib,game,ui,get,ai,_status){ tw_mobile2:'海外服·异构', tw_yijiang:'一将成名TW', tw_english:'英文版', + }, + pinyins:{ + 凯撒:['Caesar'], + 难升米:['Nashime'] } }; }); diff --git a/character/xianding.js b/character/xianding.js index c76af4b5b..897d03d13 100644 --- a/character/xianding.js +++ b/character/xianding.js @@ -11557,7 +11557,7 @@ game.import('character',function(lib,game,ui,get,ai,_status){ zhouyi:'周夷，游卡桌游旗下产品《三国杀》自行杜撰的人物。设定为周瑜的妹妹，和周瑜一同征战。', caojinyu:'金乡公主，本姓曹氏，名字不详，沛国谯县（今安徽省亳州市）人。魏武帝曹操的女儿，母为杜夫人。适婚的时候，嫁给曹操的养子何晏。高平陵之变，何晏作为大将军曹爽的党羽，遭到太傅司马懿处死。在何晏母亲尹夫人苦苦哀求下，何晏的儿子得以保全。', wufan:'吴范（？－226年），字文则，会稽上虞（今浙江绍兴上虞区）人。三国时期孙吴官员，擅长术数。与刘惇、赵达、严武、曹不兴、皇象、宋寿和郑妪合称“吴中八绝”。吴范以推算天象节气和观察气候闻名于郡中。孙权起于东南，他委身事奉，每推算灾祥多应验，遂显名。孙权委以骑都尉，领太史令。初，孙权为将军时，他曾说江南有王气。及孙权立为吴王，论功行封，欲以为都亭侯，但因不愿将其术要诀告知孙权，为权所怨恨，被除名。黄武中，病死。', - caomao:'曹髦（241年11月15日－260年6月2日）[1]，字彦士，沛国谯县（今安徽省亳州市）人，魏文帝曹丕之孙，东海王曹霖之子，曹魏第四位皇帝（254年11月1日－260年6月2日）。正始二年（241年），生于东海王宫，自幼聪明好学，才慧早成，正始五年（244年），封为高贵乡公，嘉平六年（254年），大将军司马师废除齐王曹芳后，拥立为帝，年号正元，曹髦文才武略，崇拜少康，不满司马氏专权秉政，甘露五年（260年），亲自讨伐司马昭，为太子舍人成济所弑，年仅十九岁，以王礼葬于洛阳西北。曹髦擅长诗文，创制了九言诗，传世文章有《伤魂赋并序》《颜子论》等。爱好儒学，亲赴太学论道，著有《春秋左氏传音》（失传）。精通绘画，一说为中国第一位成为画家的皇帝，唐张彦远《历代名画记》目曹髦为中品。', + caomao:'曹髦（241年11月15日－260年6月2日），字彦士，沛国谯县（今安徽省亳州市）人，魏文帝曹丕之孙，东海王曹霖之子，曹魏第四位皇帝（254年11月1日－260年6月2日）。正始二年（241年），生于东海王宫，自幼聪明好学，才慧早成，正始五年（244年），封为高贵乡公，嘉平六年（254年），大将军司马师废除齐王曹芳后，拥立为帝，年号正元，曹髦文才武略，崇拜少康，不满司马氏专权秉政，甘露五年（260年），亲自讨伐司马昭，为太子舍人成济所弑，年仅十九岁，以王礼葬于洛阳西北。曹髦擅长诗文，创制了九言诗，传世文章有《伤魂赋并序》《颜子论》等。爱好儒学，亲赴太学论道，著有《春秋左氏传音》（失传）。精通绘画，一说为中国第一位成为画家的皇帝，唐张彦远《历代名画记》目曹髦为中品。', laiyinger:'来莺儿，是个传说中的人物，正史及古代典籍并无记载。相传来莺儿是东汉歌妓，建安年间洛阳名妓，后爱上曹操的侍卫王图，王图因延误军机而押赴刑场，当时来莺儿奋不顾身以己命换王图一死。新编古装潮剧《曹营恋歌》，秦腔《雀台歌女》讲述了歌女来莺儿与情人王图及曹操三人之间催人泪下的故事。', caohua:'曹华，东汉末年人物，曹操之女，为汉献帝妃嫔。建安十八年（213年），曹操进为魏公，把曹宪、曹节、曹华三个女儿，一齐都送给汉献帝刘协做了妃子，皆封为夫人，聘以束帛五万匹，年龄尚小者在魏公国待年长而聘。', zhaoang:'赵昂，字伟章（一作伟璋），天水冀人。汉末时曹操部下。初为羌道令，建安中转参军事徒居州治冀城。建安十八年，马超围冀城多天，城中饥困，凉州刺史韦康不愿百姓再受苦而打算投降，赵昂进劝但不为所纳。后马超背信弃义杀韦康并劫其子赵月为人质，把他送至南郑。欲以此要迫使赵昂为己所用。后与梁宽、赵衢、庞恭、杨阜等结谋为康报仇，并举兵讨伐马超。马超兵败遂弃城，投奔张鲁。得张鲁之援后马超于建安十九年复寇，赵昂与妻子王异坚守祁山三十天至夏侯渊的救兵解围，其子赵月终为马超斩杀。自冀城之难，至于祁山，赵昂出九奇策。', diff --git a/game/game.js b/game/game.js index 5feb33e50..913b67f07 100644 --- a/game/game.js +++ b/game/game.js @@ -255,13 +255,22 @@ lib.groupnature[id]=id; } } + if(typeof config.image=='string') Object.defineProperty(lib.card,`group_${id}`,{ + configurable:true, + enumerable:false, + writable:true, + value:{ + fullskin:true, + image:config.image + } + }); }], }, hookmap:{}, imported:{}, layoutfixed:['chess','tafang','stone'], pinyins:{ - metadata:{ + _metadata:{ shengmu:['zh','ch','sh','b','p','m','f','d','t','l','n','g','k','h','j','q','x','r','z','c','s','y','w'], special_shengmu:['j','q','x','y'], feijiemu:{ @@ -39638,28 +39647,30 @@ } return node; }, - putDB:function(type,id,item,callback){ + putDB:function(type,id,item,onsuccess,onerror){ if(!lib.db) return item; if(lib.status.reload){ lib[_status.dburgent?'ondb2':'ondb'].push(['putDB',Array.from(arguments)]); return; } lib.status.reload++; - lib.db.transaction([type],'readwrite').objectStore(type).put(item,id).onsuccess=function(){ - if(callback){ + const record=lib.db.transaction([type],'readwrite').objectStore(type).put(item,id); + record.onsuccess=function(){ + if(onsuccess){ _status.dburgent=true; - callback.apply(this,arguments); + onsuccess.apply(this,arguments); delete _status.dburgent; } game.reload2(); }; + if(typeof onerror=='function') record.onerror=onerror; }, - getDB:function(type,id,callback){ + getDB:function(type,id,onsuccess,onerror){ if(!lib.db){ - if(callback) callback(null); + if(onsuccess) onsuccess(null); return; } - if(!callback) return; + if(!onsuccess) return; if(lib.status.reload){ lib[_status.dburgent?'ondb2':'ondb'].push(['getDB',Array.from(arguments)]); return; @@ -39667,31 +39678,34 @@ lib.status.reload++; const store=lib.db.transaction([type],'readwrite').objectStore(type); if(id){ - store.get(id).onsuccess=e=>{ + const record=store.get(id); + record.onsuccess=e=>{ _status.dburgent=true; - callback(e.target.result); + onsuccess(e.target.result); delete _status.dburgent; game.reload2(); }; + if(typeof onerror=='function') record.onerror=onerror; return; } - const obj={}; - store.openCursor().onsuccess=e=>{ - const cursor=e.target.result; - if(cursor){ - obj[cursor.key]=cursor.value; - cursor.continue(); + const cursor=store.openCursor(),obj={}; + cursor.onsuccess=e=>{ + const result=e.target.result; + if(result){ + obj[result.key]=result.value; + result.continue(); return; } _status.dburgent=true; - callback(obj); + onsuccess(obj); delete _status.dburgent; game.reload2(); - } + }; + if(typeof onerror=='function') cursor.onerror=onerror; }, - deleteDB:function(type,id,callback){ + deleteDB:function(type,id,onsuccess,onerror){ if(!lib.db){ - if(callback) callback(false); + if(onsuccess) onsuccess(false); return; } if(lib.status.reload){ @@ -39700,10 +39714,12 @@ } if(arguments.length>1){ lib.status.reload++; - lib.db.transaction([type],'readwrite').objectStore(type).delete(id).onsuccess=function(){ - if(callback) callback.apply(this,arguments); + const record=lib.db.transaction([type],'readwrite').objectStore(type).delete(id); + record.onsuccess=function(){ + if(onsuccess) onsuccess.apply(this,arguments); game.reload2(); }; + if(typeof onerror=='function') record.onerror=onerror; return; } game.getDB(type,null,obj=>{ @@ -53214,21 +53230,86 @@ else if(lib.config.favouriteCharacter.contains(name)){ fav.classList.add('active'); } - var intro=ui.create.div('.characterintro',get.characterIntro(name),uiintro); + const intro=ui.create.div('.characterintro',uiintro); if(lib.config.show_characternamepinyin){ - var charactername=get.rawName(name); - var characterpinyin=get.pinyin(charactername); - var nameinfo=get.character(name); - var charactersex=get.translation(nameinfo[0]); - const charactergroups=get.is.double(name,true); - let charactergroup; - if(charactergroups) charactergroup=charactergroups.map(i=>get.translation(i)).join('/') - else charactergroup=get.translation(nameinfo[1]); - var characterhp=nameinfo[2]; - var characterintroinfo=get.characterIntro(name); - intro.innerHTML=''+charactername+''+''+'['+characterpinyin+']'+''+' | '+charactersex+' | '+charactergroup+' | '+characterhp+'
'+characterintroinfo; + const span=document.createElement('span'); + span.style.fontWeight='bold'; + const nameInfo=get.character(name),nameExInfo=nameInfo[4],characterName=nameExInfo&&nameExInfo.includes('translateNameAsIs:get.charactercard')?lib.translate[name]:get.rawName(name); + span.textContent=characterName; + const ruby=document.createElement('ruby'); + ruby.appendChild(span); + const leftParenthesisRP=document.createElement('rp'); + leftParenthesisRP.textContent='（'; + ruby.appendChild(leftParenthesisRP); + const rt=document.createElement('rt'); + rt.textContent=get.pinyin(characterName).join(' '); + ruby.appendChild(rt); + const rightParenthesisRP=document.createElement('rp'); + rightParenthesisRP.textContent='）'; + ruby.appendChild(rightParenthesisRP); + const tr=document.createElement('tr'),characterNameTD=document.createElement('td'); + characterNameTD.appendChild(ruby); + tr.appendChild(characterNameTD); + const characterSexTD=document.createElement('td'); + characterSexTD.textContent=get.translation(nameInfo[0]); + tr.appendChild(characterSexTD); + const characterGroupTD=document.createElement('td'); + const characterGroups=get.is.double(name,true); + if(characterGroups) Promise.all(characterGroups.map(value=>new Promise((resolve,reject)=>{ + const info=lib.card[`group_${value}`]; + if(!info) resolve(`image/card/group_${value}.png`); + const image=info.image; + if(!image) resolve(`image/card/group_${value}.png`); + else if(image.indexOf('db:')==0) game.getDB('image',image.slice(3),src=>resolve(src),reject); + else if(image.indexOf('ext:')==0) resolve(image.replace(/ext:/,'extension/')); + else resolve(image); + }).then(element=>new Promise((resolve,reject)=>{ + const image=new Image(); + image.onload=()=>resolve(image); + image.onerror=reject; + image.src=element; + })))).then(value=>{ + const documentFragment=document.createDocumentFragment(); + value.forEach(documentFragment.appendChild,documentFragment); + characterGroupTD.appendChild(documentFragment); + }).catch(()=>characterGroupTD.textContent=characterGroups.reduce((previousValue,currentValue)=>previousValue?`${previousValue}/${get.translation(currentValue)}`:get.translation(currentValue),'')); + else{ + const characterGroup=nameInfo[1]; + new Promise((resolve,reject)=>{ + const info=lib.card[`group_${characterGroup}`]; + if(!info) resolve(`image/card/group_${characterGroup}.png`); + const image=info.image; + if(!image) resolve(`image/card/group_${characterGroup}.png`); + else if(image.indexOf('db:')==0) game.getDB('image',image.slice(3),src=>resolve(src),reject); + else if(image.indexOf('ext:')==0) resolve(image.replace(/ext:/,'extension/')); + else resolve(image); + }).then(value=>new Promise((resolve,reject)=>{ + const image=new Image(); + image.onload=()=>resolve(image); + image.onerror=reject; + image.src=value; + })).then(value=>characterGroupTD.appendChild(value)).catch(()=>characterGroupTD.textContent=get.translation(characterGroup)); + } + tr.appendChild(characterGroupTD); + const characterHPTD=document.createElement('td'),hpDiv=ui.create.div('.hp',characterHPTD),nameInfoHP=nameInfo[2],infoHP=get.infoHp(nameInfoHP); + hpDiv.dataset.condition=infoHP<4?'mid':'high'; + ui.create.div(hpDiv); + const hpTextDiv=ui.create.div('.text',hpDiv),infoMaxHP=get.infoMaxHp(nameInfoHP); + hpTextDiv.textContent=infoHP==infoMaxHP?infoHP:`${infoHP}/${infoMaxHP}`; + const infoShield=get.infoHujia(nameInfoHP); + if(infoShield){ + ui.create.div('.shield',hpDiv); + const shieldTextDiv=ui.create.div('.text',hpDiv); + shieldTextDiv.textContent=infoShield; + } + tr.appendChild(characterHPTD); + const table=document.createElement('table'); + table.appendChild(tr); + intro.appendChild(table); + intro.appendChild(document.createElement('hr')); } - var intro2=ui.create.div('.characterintro.intro2',uiintro); + intro.appendChild(new Text(get.characterIntro(name))); + const intro2=ui.create.div('.characterintro.intro2',uiintro); var list=get.character(name,3)||[]; var skills=ui.create.div('.characterskill',uiintro); if(lib.config.touchscreen){ @@ -53241,38 +53322,75 @@ skills.onmousewheel=ui.click.mousewheel; } var clickSkill=function(e){ + while(intro2.firstChild){ + intro2.removeChild(intro2.lastChild); + } var current=this.parentNode.querySelector('.active'); if(current){ current.classList.remove('active'); } this.classList.add('active'); - var skillname=get.translation(this.link); - var skilltranslationinfo=get.skillInfoTranslation(this.link); - if(lib.config.show_skillnamepinyin&&skillname!='阵亡'){ - var skillpinyin=get.pinyin(skillname); - intro2.innerHTML=''+skillname+''+''+'['+skillpinyin+']'+''+' '+skilltranslationinfo; - }else{ - intro2.innerHTML=''+skillname+''+skilltranslationinfo; + const skillNameSpan=document.createElement('span'),skillNameSpanStyle=skillNameSpan.style; + skillNameSpanStyle.fontWeight='bold'; + const skillName=get.translation(this.link); + skillNameSpan.textContent=skillName; + if(lib.config.show_skillnamepinyin&&skillName!='阵亡'){ + const ruby=document.createElement('ruby'); + ruby.appendChild(skillNameSpan); + const leftParenthesisRP=document.createElement('rp'); + leftParenthesisRP.textContent='（'; + ruby.appendChild(leftParenthesisRP); + const rt=document.createElement('rt'); + rt.textContent=get.pinyin(skillName).join(' '); + ruby.appendChild(rt); + const rightParenthesisRP=document.createElement('rp'); + rightParenthesisRP.textContent='）'; + ruby.appendChild(rightParenthesisRP); + const div=ui.create.div(intro2); + div.style.marginRight='5px'; + div.appendChild(ruby); } + else{ + skillNameSpanStyle.marginRight='5px'; + intro2.appendChild(skillNameSpan); + } + intro2.appendChild(new Text(get.skillInfoTranslation(this.link))); var info=get.info(this.link); var skill=this.link; var playername=this.linkname; var skillnode=this; - if(info.derivation){ - var derivation=info.derivation; - if(typeof derivation=='string'){ - derivation=[derivation]; - } - for(var i=0;i'+''+'['+derivationpinyin+']'+''+' '+derivationtranslationinfo; - }else{ - intro2.innerHTML+='

'+derivationname+''+derivationtranslationinfo; + let derivation=info.derivation; + if(derivation){ + if(typeof derivation=='string') derivation=[derivation]; + derivation.forEach(value=>{ + intro2.appendChild(document.createElement('br')); + intro2.appendChild(document.createElement('br')); + const derivationNameSpan=document.createElement('span'),derivationNameSpanStyle=derivationNameSpan.style; + derivationNameSpanStyle.fontWeight='bold'; + const derivationName=get.translation(value); + derivationNameSpan.textContent=derivationName; + if(lib.config.show_skillnamepinyin&&derivationName.length<=5&&value.indexOf('_faq')==-1){ + const ruby=document.createElement('ruby'); + ruby.appendChild(derivationNameSpan); + const leftParenthesisRP=document.createElement('rp'); + leftParenthesisRP.textContent='（'; + ruby.appendChild(leftParenthesisRP); + const rt=document.createElement('rt'); + rt.textContent=get.pinyin(derivationName).join(' '); + ruby.appendChild(rt); + const rightParenthesisRP=document.createElement('rp'); + rightParenthesisRP.textContent='）'; + ruby.appendChild(rightParenthesisRP); + const div=ui.create.div(intro2); + div.style.marginRight='5px'; + div.appendChild(ruby); } - } + else{ + derivationNameSpanStyle.marginRight='5px'; + intro2.appendChild(derivationNameSpan); + } + intro2.appendChild(new Text(get.skillInfoTranslation(value))); + }); } if(info.alter){ intro2.innerHTML+='

'; @@ -54394,40 +54512,36 @@ return []; }, //装备栏 END - pinyin:function(chinese,withtone){ - const util=window.pinyinUtilx; - if(!window.pinyinUtilx) return []; - if(lib.pinyins&&lib.pinyins[chinese]){ - const str=lib.pinyins[chinese]; - if(withtone===false){ - for(let i=0;i{ + const pinyinUtilx=window.pinyinUtilx; + if(!pinyinUtilx) return []; + const pinyins=lib.pinyins; + if(pinyins){ + const pinyin=pinyins[chinese]; + if(Array.isArray(pinyin)) return withTone===false?pinyin.map(pinyinUtilx.removeTone):pinyin.slice(); } - return util.getPinyin(chinese,null,withtone,true); + return pinyinUtilx.getPinyin(chinese,null,withTone,true); }, yunmu:function(str){ //部分整体认读音节特化处理 const util=window.pinyinUtilx; - if(util&&lib.pinyins.metadata.zhengtirendu.contains(util.removeTone(str))){ + if(util&&lib.pinyins._metadata.zhengtirendu.contains(util.removeTone(str))){ return '-'+str[str.length-1]; } //排除声母 - for(let i of lib.pinyins.metadata.shengmu){ + for(let i of lib.pinyins._metadata.shengmu){ if(str.indexOf(i)==0){ str=str.slice(i.length); - if(str[0]=='u'&&lib.pinyins.metadata.special_shengmu.contains(i)) str='ü'+str.slice(1); + if(str[0]=='u'&&lib.pinyins._metadata.special_shengmu.contains(i)) str='ü'+str.slice(1); break; } } //排除介母 if(str.length>0){ - for(let i in lib.pinyins.metadata.feijiemu){ + for(let i in lib.pinyins._metadata.feijiemu){ if(str[0]==i){ let goon=false; - for(let j of lib.pinyins.metadata.feijiemu[i]){ + for(let j of lib.pinyins._metadata.feijiemu[i]){ if(str.indexOf(j)==0) goon=true; } if(!goon) str=str.slice(1); @@ -54440,20 +54554,20 @@ yunjiao:function(str){ const util=window.pinyinUtilx; if(util) str=util.removeTone(str) - if(lib.pinyins.metadata.zhengtirendu.contains(str)){ + if(lib.pinyins._metadata.zhengtirendu.contains(str)){ str=('-'+str[str.length-1]); } else{ - for(let i of lib.pinyins.metadata.shengmu){ + for(let i of lib.pinyins._metadata.shengmu){ if(str.indexOf(i)==0){ str=str.slice(i.length); - if(str[0]=='u'&&lib.pinyins.metadata.special_shengmu.contains(i)) str='ü'+str.slice(1); + if(str[0]=='u'&&lib.pinyins._metadata.special_shengmu.contains(i)) str='ü'+str.slice(1); break; } } } - for(let i in lib.pinyins.metadata.yunjiao){ - if(lib.pinyins.metadata.yunjiao[i].contains(str)) return i; + for(let i in lib.pinyins._metadata.yunjiao){ + if(lib.pinyins._metadata.yunjiao[i].contains(str)) return i; } return null; }, diff --git a/layout/default/menu.css b/layout/default/menu.css index 12df29b8b..28e1a7683 100644 --- a/layout/default/menu.css +++ b/layout/default/menu.css @@ -1,33 +1,41 @@ -.menu-container{ - z-index:8; +.menu-container { + z-index: 8; } -.menu-container div{ - position: relative; + +.menu-container div { + position: relative; } -.menu-container.hidden{ - pointer-events: none; + +.menu-container.hidden { + pointer-events: none; } -#menu-button{ - z-index:6; + +#menu-button { + z-index: 6; } -.popup-container{ - z-index:10; + +.popup-container { + z-index: 10; } -.popup-container.filter-character{ + +.popup-container.filter-character { text-align: center; overflow: scroll; opacity: 0; transition: all 0.3s; } -.popup-container.filter-character.shown{ + +.popup-container.filter-character.shown { opacity: 1; } -.popup-container.filter-character.removing>div{ + +.popup-container.filter-character.removing>div { pointer-events: none; } -.popup-container.filter-character>div{ + +.popup-container.filter-character>div { left: 0; - top:0; + top: 0; left: 0; width: 100%; height: auto; @@ -36,11 +44,13 @@ transition: all 0s; position: relative; } -.popup-container.filter-character>div>div{ + +.popup-container.filter-character>div>div { position: relative; margin: 10px; } -.popup-container.filter-character>div>.capt{ + +.popup-container.filter-character>div>.capt { width: 80px; height: 80px; padding: 0; @@ -48,145 +58,178 @@ line-height: 90px; } -.menu-container,.popup-container{ - width:100%; - height:100%; - left:0; - top:0; +.menu-container, +.popup-container { + width: 100%; + height: 100%; + left: 0; + top: 0; position: absolute; } -.menu-buttons,.menu-sym{ + +.menu-buttons, +.menu-sym { padding-bottom: 5px !important; width: calc(100% - 10px) !important; padding-right: 5px !important; } -.menu-buttons.leftbutton{ + +.menu-buttons.leftbutton { text-align: left; margin-left: 10px; } -.menu-buttons.leftbutton:not(.commandbutton){ + +.menu-buttons.leftbutton:not(.commandbutton) { width: calc(100% - 30px) !important; } + .menu.main>.menu-content>div>.right.pane>.menu-buttons.leftbutton>.config.toggle:first-child, -.menu.main>.menu-content>div>.right.pane>.menu-buttons.leftbutton>.config.toggle:first-child+.config.toggle{ - margin-left: 3px !important; +.menu.main>.menu-content>div>.right.pane>.menu-buttons.leftbutton>.config.toggle:first-child+.config.toggle { + margin-left: 3px !important; width: calc(100% - 15px) !important; } -.menu-buttons div{ + +.menu-buttons div { position: absolute; } -.menu-buttons>.glow{ + +.menu-buttons>.glow { box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 133, 255, 0.8) 0 0 10px, rgba(0, 133, 255, 0.8) 0 0 10px, rgba(0, 133, 255, 0.8) 0 0 15px !important; } -.menu-cheat>div{ - margin:5px; + +.menu-cheat>div { + margin: 5px; } -.menu-cheat>.selecting{ + +.menu-cheat>.selecting { box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(255, 0, 0, 0.8) 0 0 5px, rgba(255, 0, 0, 0.8) 0 0 5px !important } -.menu-cheat.config>.menubutton{ - height:16px; + +.menu-cheat.config>.menubutton { + height: 16px; line-height: 16px; - transform: translateY(-10px); + transform: translateY(-10px); } -.menu-cheat.config{ + +.menu-cheat.config { transition-property: opacity; } + .menu-buttons>.toggle, -.menu-buttons>.config.more{ - position:relative; +.menu-buttons>.config.more { + position: relative; margin-bottom: 10px !important; margin-left: 10px !important; margin-right: 10px !important; width: calc(100% - 25px) !important; display: inline-block; } + .menu-buttons>.config.more, -.menu-buttons>.toggle.cardpilecfg{ +.menu-buttons>.toggle.cardpilecfg { margin-bottom: 0 !important; display: block; } -.menu-buttons>.config.more.pile{ + +.menu-buttons>.config.more.pile { margin-top: 5px !important; margin-left: 3px !important; } -.menu-buttons>.toggle.cardpilecfgadd:not(.hidden){ + +.menu-buttons>.toggle.cardpilecfgadd:not(.hidden) { margin-top: 0 !important; } -.menu-buttons>.toggle.cardpilecfg:not(.nomarginleft){ + +.menu-buttons>.toggle.cardpilecfg:not(.nomarginleft) { margin-left: 20px !important; width: calc(100% - 35px) !important; } -.menu-buttons>.config.more *{ + +.menu-buttons>.config.more * { position: relative; } -.menu-buttons>.button{ - zoom:0.75; + +.menu-buttons>.button { + zoom: 0.75; } + .menu-buttons .cardpiledelete, -.toggle>.cardpiledelete{ - display: inline-block; +.toggle>.cardpiledelete { position: relative; float: right; margin-right: 4px; } -.menu-buttons .menuplaceholder{ + +.menu-buttons .menuplaceholder { display: block; margin: 0; padding: 0; width: 100%; height: 10px; } -.menu-buttons .menuplaceholder.slim{ + +.menu-buttons .menuplaceholder.slim { height: 5px; } -#window:not(.nopointer) .cardpiledelete{ + +#window:not(.nopointer) .cardpiledelete { cursor: pointer; } -.menu-help{ + +.menu-help { width: calc(100% - 30px) !important; text-align: left !important; } -.menu-help li{ + +.menu-help li { margin-bottom: 10px !important; } -.menu-container>.menu.main{ + +.menu-container>.menu.main { left: 15px; top: 52px; } -.menu-container>.menu.main.center{ - left:calc(50% - 200px); - top:calc(50% - 150px); + +.menu-container>.menu.main.center { + left: calc(50% - 200px); + top: calc(50% - 150px); } -.menu-container.hidden>.menu.main{ - transform:scale(0.5); - transform-origin:2px -35px; - opacity:0; + +.menu-container.hidden>.menu.main { + transform: scale(0.5); + transform-origin: 2px -35px; + opacity: 0; } -.menu-container>.menu.main{ + +.menu-container>.menu.main { transition: all 0.3s; - transform-origin:2px -35px; + transform-origin: 2px -35px; } -.menu-container.hidden>.menu.main.center{ + +.menu-container.hidden>.menu.main.center { /*transform:translateY(300px);*/ transform-origin: center center; } -.menu-container>.menu.main.center{ + +.menu-container>.menu.main.center { transform-origin: center center; } -.menu.main{ + +.menu.main { width: 400px; - height:300px; + height: 300px; position: absolute; - overflow:hidden; - padding:0; + overflow: hidden; + padding: 0; } -.removing>.menubg.charactercard{ + +.removing>.menubg.charactercard { transform: scale(0.8); opacity: 0; transition: all 0.3s; } -.menubg.charactercard{ + +.menubg.charactercard { width: 500px; height: 300px; left: calc(50% - 250px); @@ -194,7 +237,8 @@ animation: dialog_start2 0.3s; -webkit-animation: dialog_start2 0.3s; } -.menubg.charactercard>.menubutton.large.ava{ + +.menubg.charactercard>.menubutton.large.ava { width: 180px; height: 240px; left: 10px; @@ -202,7 +246,8 @@ overflow: hidden; box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.45) 0 0 5px !important; } -.menubg.charactercard>.menubutton.large{ + +.menubg.charactercard>.menubutton.large { width: 85px; height: 30px; bottom: 10px; @@ -210,13 +255,16 @@ padding: 0; font-size: 20px; } -.menubg.charactercard>.menubutton.ban{ + +.menubg.charactercard>.menubutton.ban { left: 10px; } -.menubg.charactercard>.menubutton.fav{ + +.menubg.charactercard>.menubutton.fav { left: 105px; } -.menubg.charactercard>.ava>.changeskin{ + +.menubg.charactercard>.ava>.changeskin { bottom: 6px; left: 6px; font-family: 'xinwei'; @@ -229,21 +277,24 @@ pointer-events: none; opacity: 0.6; } + #window:not(.nopointer) .menubg.charactercard .menubutton:not(.ava):not(.intro):not(.unselectable), -#window:not(.nopointer) .menubg.charactercard>.ava>.avatars>div{ +#window:not(.nopointer) .menubg.charactercard>.ava>.avatars>div { cursor: pointer; } -.menubg.charactercard>.characterskill{ + +.menubg.charactercard>.characterskill { left: 191px; - padding-left: 9px; - padding-right: 10px; - width: 290px; - top: 125px; - height: 50px; - white-space: nowrap; - overflow-x: scroll; + padding-left: 9px; + padding-right: 10px; + width: 290px; + top: 125px; + height: 50px; + white-space: nowrap; + overflow-x: scroll; } -.menubg.charactercard>.characterskill>.menubutton.large{ + +.menubg.charactercard>.characterskill>.menubutton.large { height: 20px; line-height: 20px; padding: 5px; @@ -252,24 +303,90 @@ font-size: 20px; margin-right: 10px; } -.menubg.charactercard .characterintro{ + +.menubg.charactercard .characterintro .hp { + height: initial; + left: initial; + top: initial; + width: initial; +} + +.menubg.charactercard .characterintro .hp>div:first-child { + margin-left: initial; +} + +.menubg.charactercard .characterintro .hp>div:nth-child(odd) { + height: 10px; + width: 10px; +} + +.menubg.charactercard .characterintro .hp>div.text { + background: none !important; + border: none !important; + box-shadow: none !important; + filter: initial; + -webkit-filter: initial; + height: initial; + width: initial; +} + +.menubg.charactercard .characterintro div, +.menubg.charactercard .characterintro.intro2 div { + position: initial; +} + +.menubg.charactercard .characterintro rp, +.menubg.charactercard .characterintro rt, +.menubg.charactercard .characterintro.intro2 rp, +.menubg.charactercard .characterintro.intro2 rt { + font-size: smaller; +} + +.menubg.charactercard .characterintro table td img { + height: 1.5em; + vertical-align: middle; +} + +.menubg.charactercard .characterintro table td { + white-space: nowrap; +} + +.menubg.charactercard .characterintro table td:first-child { + width: 25%; +} + +.menubg.charactercard .characterintro table td:not(:first-child) { + text-align: center; +} + +.menubg.charactercard .characterintro table { + border-collapse: collapse; + border-color: currentColor; + table-layout: auto; + width: 100%; +} + +.menubg.charactercard .characterintro { left: 200px; width: 280px; height: 105px; padding: 5px; overflow: scroll; border-radius: 4px; - box-shadow: rgba(0,0,0,0.2) 0 0 0 1px; + box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px; } -.menubg.charactercard .characterintro:not(.intro2){ + +.menubg.charactercard .characterintro:not(.intro2) { top: 10px; bottom: auto; } -.menubg.charactercard .characterintro.intro2{ + +.menubg.charactercard .characterintro.intro2 { top: auto; bottom: 10px; } -.menubg.charactercard>.ava>.avatars{ + +.menubg.charactercard>.ava>.avatars { opacity: 0; pointer-events: none; width: 100%; @@ -279,16 +396,18 @@ margin: 0; padding: 0; overflow: hidden; - line-height: 0; + line-height: 0; text-align: left; transform: scale(0.8); } -.menubg.charactercard>.ava>.avatars.scroll{ + +.menubg.charactercard>.ava>.avatars.scroll { overflow: scroll; } -.menubg.charactercard>.ava>.avatars>div{ + +.menubg.charactercard>.ava>.avatars>div { position: relative; - margin:3px; + margin: 3px; width: 81px; height: 111px; border-radius: 4px; @@ -296,26 +415,32 @@ background-position: 50% 0; box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.45) 0 0 5px } + .menubg.charactercard>.ava>.avatars>div:first-child, -.menubg.charactercard>.ava>.avatars>div:first-child+div{ +.menubg.charactercard>.ava>.avatars>div:first-child+div { margin-top: 6px; } -.menubg.charactercard>.ava>.avatars>div:nth-of-type(odd){ + +.menubg.charactercard>.ava>.avatars>div:nth-of-type(odd) { margin-left: 6px; } -.menubg.charactercard>.ava.scroll>.avatars{ + +.menubg.charactercard>.ava.scroll>.avatars { opacity: 1; pointer-events: auto; transform: scale(1); } -.menubg.charactercard>.ava.scroll>.changeskin{ + +.menubg.charactercard>.ava.scroll>.changeskin { opacity: 0; } -.menubg.charactercard>.ava.scroll>.avatar{ + +.menubg.charactercard>.ava.scroll>.avatar { transform: translateX(-200px); pointer-events: none; } -.menubg.charactercard>.ava>.avatar{ + +.menubg.charactercard>.ava>.avatar { left: 5px; top: 5px; width: calc(100% - 10px); @@ -325,210 +450,250 @@ z-index: 1; box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.45) 0 0 5px; } -.menu.main>.menu-tab{ - height:37px; - text-align:center; - width:calc(100% - 30px); - padding-left:15px; - padding-right:15px; - position:relative; - text-align:center; + +.menu.main>.menu-tab { + height: 37px; + text-align: center; + width: calc(100% - 30px); + padding-left: 15px; + padding-right: 15px; + position: relative; + text-align: center; border-width: 0 0 1px; - border-style:solid; - border-image:linear-gradient(to right, transparent,rgba(0,0,0,0.2) 10%,rgba(0,0,0,0.2) 90%,transparent) 0 1 100%; + border-style: solid; + border-image: linear-gradient(to right, transparent, rgba(0, 0, 0, 0.2) 10%, rgba(0, 0, 0, 0.2) 90%, transparent) 0 1 100%; } -.menu.main>.menu-tab-bar{ - width:45px; - height:2px; - top:35px; - position:absolute; - background-color:rgb(0, 133, 255); - transition:transform 0.3s; + +.menu.main>.menu-tab-bar { + width: 45px; + height: 2px; + top: 35px; + position: absolute; + background-color: rgb(0, 133, 255); + transition: transform 0.3s; left: 0; } -.menu.main>.menu-tab>div{ - display:inline-block; - height:32px; - line-height:30px; - padding-top:5px; - width:45px; - margin-left:5px; - margin-right:5px; - transition:color 0.5s; + +.menu.main>.menu-tab>div { + display: inline-block; + height: 32px; + line-height: 30px; + padding-top: 5px; + width: 45px; + margin-left: 5px; + margin-right: 5px; + transition: color 0.5s; } + .menu.main>.menu-tab>div:not(.active):not(*:hover), -.menu.main>.menu-tab>.disabled{ - color:rgba(255,255,255,0.6); +.menu.main>.menu-tab>.disabled { + color: rgba(255, 255, 255, 0.6); } -.menu.main>.menu-content{ - height:calc(100% - 38px); - position:relative; - width:100%; + +.menu.main>.menu-content { + height: calc(100% - 38px); + position: relative; + width: 100%; } -.menu.main>.menu-content>div{ - width:100%; - height:100%; + +.menu.main>.menu-content>div { + width: 100%; + height: 100%; } -.menu.main>.menu-content>div>.pane{ - position:absolute; - display:inline-block; - height:100%; + +.menu.main>.menu-content>div>.pane { + position: absolute; + display: inline-block; + height: 100%; } -.menu.main>.menu-content>div>.left.pane{ - width:34%; - left:0; - overflow: scroll; + +.menu.main>.menu-content>div>.left.pane { + width: 34%; + left: 0; + overflow: scroll; } -.menu.main>.menu-content>div>.left.pane>div{ - width:calc(100% - 30px); - margin-top:9px; - margin-left:10px; - transition:all 0.3s; - height: 23px; - font-size: 26px; - line-height: 26px; + +.menu.main>.menu-content>div>.left.pane>div { + width: calc(100% - 30px); + margin-top: 9px; + margin-left: 10px; + transition: all 0.3s; + height: 23px; + font-size: 26px; + line-height: 26px; white-space: nowrap; } -.menu.main>.menu-content>div>.left.pane>.menubutton.off{ + +.menu.main>.menu-content>div>.left.pane>.menubutton.off { opacity: 0.5; } -.menu.main>.menu-content>div>.left.pane>.lefttext{ - font-family: 'xinwei'; - font-size: 20px; + +.menu.main>.menu-content>div>.left.pane>.lefttext { + font-family: 'xinwei'; + font-size: 20px; } -.menu.main>.menu-content>div>.left.pane>div:last-child{ + +.menu.main>.menu-content>div>.left.pane>div:last-child { margin-bottom: 9px; } -.menu.main>.menu-content>div>.left.pane.dim>div:not(.active){ - color:rgba(255,255,255,0.5); + +.menu.main>.menu-content>div>.left.pane.dim>div:not(.active) { + color: rgba(255, 255, 255, 0.5); } -.menu.main>.menu-content>div>.right.pane{ - left:34%; - width:66%; - overflow:scroll; + +.menu.main>.menu-content>div>.right.pane { + left: 34%; + width: 66%; + overflow: scroll; } -.menu.main>.menu-content>div>.right.pane>div{ - width:calc(100% - 5px); - position:absolute; - top:0; - left:0; - padding-left:5px; - padding-top:5px; + +.menu.main>.menu-content>div>.right.pane>div { + width: calc(100% - 5px); + position: absolute; + top: 0; + left: 0; + padding-left: 5px; + padding-top: 5px; } -.menu.main>.menu-content>div>.right.pane>.expanded{ - padding-bottom:80px; + +.menu.main>.menu-content>div>.right.pane>.expanded { + padding-bottom: 80px; } -.menu.main>.menu-content>div>.right.pane>.expanded.expanded2{ - padding-bottom:12px; + +.menu.main>.menu-content>div>.right.pane>.expanded.expanded2 { + padding-bottom: 12px; } -.menu.main>.menu-content>div>.right.pane>.morenodes{ - padding-bottom:10px; + +.menu.main>.menu-content>div>.right.pane>.morenodes { + padding-bottom: 10px; } -.menu.main>.menu-content>div>.right.pane>div>.config{ - left:2px; - margin-top:10px; + +.menu.main>.menu-content>div>.right.pane>div>.config { + left: 2px; + margin-top: 10px; margin-left: 3px; - transition:all 0.3s; - width:calc(100% - 20px); - overflow: visible; + transition: all 0.3s; + width: calc(100% - 20px); + overflow: visible; position: relative; } -.menu.main>.menu-content>div>.right.pane>div>.config.banskilladd{ + +.menu.main>.menu-content>div>.right.pane>div>.config.banskilladd { height: 50px; transition: all 0s; } -.menu.main>.menu-content>div>.right.pane>div>.config.banskilladd.hidden{ + +.menu.main>.menu-content>div>.right.pane>div>.config.banskilladd.hidden { margin-top: -50px !important; } + .menu.main>.menu-content>div>.right.pane>div>.config.banskilladd:not(.hidden), -.menu.main>.menu-content>div>.right.pane>div>.config.cardpileadd:not(.hidden){ - margin-top:0; +.menu.main>.menu-content>div>.right.pane>div>.config.cardpileadd:not(.hidden) { + margin-top: 0; } -.menu.main>.menu-content>div>.right.pane>div>.config.banskilladd>select{ + +.menu.main>.menu-content>div>.right.pane>div>.config.banskilladd>select { margin-right: 3px; } -.menu.main>.menu-content>div>.right.pane>div>.config.toggle{ - left:2px !important; - text-align: left !important; + +.menu.main>.menu-content>div>.right.pane>div>.config.toggle { + left: 2px !important; + text-align: left !important; white-space: nowrap; } -.menu.main>.menu-content>div>.right.pane>div>.config.toggle.pointerspan.cardpilecfg{ - left:0px !important; + +.menu.main>.menu-content>div>.right.pane>div>.config.toggle.pointerspan.cardpilecfg { + left: 0px !important; } + .menu.main>.menu-content>div>.right.pane>div>.config.indent, -.menu.main>.menu-content>div>.right.pane>div>.config.toggle.indent{ - left:12px !important; +.menu.main>.menu-content>div>.right.pane>div>.config.toggle.indent { + left: 12px !important; width: calc(100% - 32px) !important; } + #window:not(.low_performance) .menu.main>.menu-content>div>.right.pane>div:not(.expanded)>.config.auto-hide, -#window:not(.low_performance) .menu.main>.menu-content>div>.right.pane>div>.config.hidden{ - margin-top:-25px; - opacity:0; - z-index:-1; +#window:not(.low_performance) .menu.main>.menu-content>div>.right.pane>div>.config.hidden { + margin-top: -25px; + opacity: 0; + z-index: -1; } + #window.low_performance .menu.main>.menu-content>div>.right.pane>div:not(.expanded)>.config.auto-hide, -#window.low_performance .menu.main>.menu-content>div>.right.pane>div>.config.hidden{ +#window.low_performance .menu.main>.menu-content>div>.right.pane>div>.config.hidden { display: none; transition-property: transform; } -.menu.main>.menu-content>div>.menubutton.round{ - left:335px; - top:197px; - z-index:3; - transition-property: color, box-shadow; - transition-duration:0.3s; - position:absolute; + +.menu.main>.menu-content>div>.menubutton.round { + left: 335px; + top: 197px; + z-index: 3; + transition-property: color, box-shadow; + transition-duration: 0.3s; + position: absolute; } -.menu.main>.menu-content>div>.menubutton.round.glowing{ + +.menu.main>.menu-content>div>.menubutton.round.glowing { box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 133, 255, 0.8) 0 0 10px, rgba(0, 133, 255, 0.8) 0 0 15px !important; } -.popup-container.hidden{ - pointer-events:none; +.popup-container.hidden { + pointer-events: none; } -.popup-container>.menu{ - position:absolute; - overflow:scroll; + +.popup-container>.menu { + position: absolute; + overflow: scroll; max-height: 400px; transition-property: opacity; } -.popup-container>.menu.visual{ + +.popup-container>.menu.visual { padding: 5px; overflow: scroll; } -.popup-container>.menu>div{ - padding-top:5px; - padding-bottom:5px; - padding-left:10px; - padding-right:10px; - position: relative; - display: block; - transition: all 0s; + +.popup-container>.menu>div { + padding-top: 5px; + padding-bottom: 5px; + padding-left: 10px; + padding-right: 10px; + position: relative; + display: block; + transition: all 0s; } -.popup-container>.menu.visual>.button.transparent{ + +.popup-container>.menu.visual>.button.transparent { pointer-events: none; } -.popup-container>.menu.visual>.button.transparent:not(.shown){ + +.popup-container>.menu.visual>.button.transparent:not(.shown) { display: none; } -.popup-container>.menu.visual>.dashedmenubutton{ + +.popup-container>.menu.visual>.dashedmenubutton { box-shadow: none !important; width: 86px; height: 86px; - border: 2px dashed rgb(40,40,40); + border: 2px dashed rgb(40, 40, 40); } -.popup-container>.menu.visual>.controlbutton{ + +.popup-container>.menu.visual>.controlbutton { height: 26px; border-radius: 4px; } -.popup-container>.menu.visual>.controlbutton.dashedmenubutton{ + +.popup-container>.menu.visual>.controlbutton.dashedmenubutton { height: 22px; } -.popup-container>.menu.visual>.controlbutton.dashedmenubutton>div{ + +.popup-container>.menu.visual>.controlbutton.dashedmenubutton>div { line-height: 22px; } -.popup-container>.menu.visual>.controlbutton>div{ + +.popup-container>.menu.visual>.controlbutton>div { width: 100%; height: 100%; left: 0 !important; @@ -539,15 +704,18 @@ text-align: center; line-height: 26px; } -.popup-container>.menu.visual>.controlbutton>div>br{ + +.popup-container>.menu.visual>.controlbutton>div>br { display: none; } -.popup-container>.menu.visual>.hpbutton{ + +.popup-container>.menu.visual>.hpbutton { width: 60px; height: 60px; overflow: hidden; } -.popup-container>.menu.visual>.hpbutton>div{ + +.popup-container>.menu.visual>.hpbutton>div { width: 30px; height: 30px; margin: 0; @@ -557,27 +725,32 @@ background-repeat: no-repeat; background-position: 50% 50%; } -.popup-container>.menu.visual>.hpbutton>div:nth-child(1){ + +.popup-container>.menu.visual>.hpbutton>div:nth-child(1) { left: 0; top: 0; } -.popup-container>.menu.visual>.hpbutton>div:nth-child(2){ + +.popup-container>.menu.visual>.hpbutton>div:nth-child(2) { right: 0; left: auto; top: 0; } -.popup-container>.menu.visual>.hpbutton>div:nth-child(3){ + +.popup-container>.menu.visual>.hpbutton>div:nth-child(3) { left: 0; bottom: 0; top: auto; } -.popup-container>.menu.visual>.hpbutton>div:nth-child(4){ + +.popup-container>.menu.visual>.hpbutton>div:nth-child(4) { right: 0; left: auto; bottom: 0; top: auto; } -.popup-container>.menu.visual>.hpbutton>div>div{ + +.popup-container>.menu.visual>.hpbutton>div>div { width: 60%; height: 60%; margin: 0; @@ -586,103 +759,127 @@ left: 20%; top: 20%; border-radius: 100%; - box-shadow: rgba(0,0,0,0.2) 1px -1px 2px inset, rgba(255,255,255,0.15) -1px 1px 5px inset; - filter: brightness(1.5); - -webkit-filter: brightness(1.5); + box-shadow: rgba(0, 0, 0, 0.2) 1px -1px 2px inset, rgba(255, 255, 255, 0.15) -1px 1px 5px inset; + filter: brightness(1.5); + -webkit-filter: brightness(1.5); } -.popup-container>.menu.visual>.hpbutton>div:nth-child(1)>div{ - background: rgba(57, 123, 4,1); + +.popup-container>.menu.visual>.hpbutton>div:nth-child(1)>div { + background: rgba(57, 123, 4, 1); border: 1px solid rgba(39, 79, 7, 1); } -.popup-container>.menu.visual>.hpbutton>div:nth-child(2)>div{ - background: rgba(166, 140, 6,1); - border: 1px solid rgba(79, 64, 7, 1); + +.popup-container>.menu.visual>.hpbutton>div:nth-child(2)>div { + background: rgba(166, 140, 6, 1); + border: 1px solid rgba(79, 64, 7, 1); } -.popup-container>.menu.visual>.hpbutton>div:nth-child(3)>div{ - background: rgba(148, 27, 27,1); - border: 1px solid rgba(79, 7, 7, 1); + +.popup-container>.menu.visual>.hpbutton>div:nth-child(3)>div { + background: rgba(148, 27, 27, 1); + border: 1px solid rgba(79, 7, 7, 1); } -.popup-container>.menu.visual>.hpbutton>div:nth-child(4)>div{ - background: rgba(57, 123, 4,1); - border: 1px solid rgba(39, 79, 7, 1); + +.popup-container>.menu.visual>.hpbutton>div:nth-child(4)>div { + background: rgba(57, 123, 4, 1); + border: 1px solid rgba(39, 79, 7, 1); } -.themebutton>div{ - width:50px; - height:76px; - top:7px; - right:7px; - border-radius:4px; + +.themebutton>div { + width: 50px; + height: 76px; + top: 7px; + right: 7px; + border-radius: 4px; } -.themebutton>div>div{ - width:calc(100% - 10px); - height:12px; - display:block; - margin-left:5px; - margin-top:6px; - position:relative; - border-radius:2px; - box-shadow:rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 0, 0, 0.3) 0 0 5px; + +.themebutton>div>div { + width: calc(100% - 10px); + height: 12px; + display: block; + margin-left: 5px; + margin-top: 6px; + position: relative; + border-radius: 2px; + box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 0, 0, 0.3) 0 0 5px; transition: all 0s; } -.themebutton>div:first-child{ + +.themebutton>div:first-child { z-index: 2; } -.themebutton.woodden{ - background:url('../../theme/woodden/grid.png'),linear-gradient(#6c7989, #434b55) fixed; + +.themebutton.woodden { + background: url('../../theme/woodden/grid.png'), linear-gradient(#6c7989, #434b55) fixed; } -.themebutton.woodden>div:not(*:first-child){ + +.themebutton.woodden>div:not(*:first-child) { background: url('../../theme/woodden/wood2.png'); box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.45) 0 3px 10px; } -.themebutton.woodden>div.fakeplayer:not(*:first-child){ + +.themebutton.woodden>div.fakeplayer:not(*:first-child) { box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.45) 0 0px 10px; } -.themebutton.woodden>div>div{ + +.themebutton.woodden>div>div { background: url('../../theme/woodden/wood.png'); } -.themebutton.woodden>div>div.active{ + +.themebutton.woodden>div>div.active { box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 133, 255, 0.4) 0 0 0 2px, rgba(0, 133, 255, 1) 0 0 5px !important; } -.themebutton.music{ - background:url('../../theme/music/grid.png'),linear-gradient(#333333, #222222) fixed; + +.themebutton.music { + background: url('../../theme/music/grid.png'), linear-gradient(#333333, #222222) fixed; } -.themebutton.music>div:not(*:first-child){ + +.themebutton.music>div:not(*:first-child) { background: linear-gradient(#4b4b4b, #464646); box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px; } -.themebutton.music>div>div{ + +.themebutton.music>div>div { background: linear-gradient(#4b4b4b, #464646); } -.themebutton.ol{ - background:url('../../image/background/ol_bg.jpg'); + +.themebutton.ol { + background: url('../../image/background/ol_bg.jpg'); background-size: cover; } -.themebutton.ol>div:not(*:first-child){ + +.themebutton.ol>div:not(*:first-child) { background: linear-gradient(#4b4b4b, #464646); box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px; } -.themebutton.ol>div>div{ + +.themebutton.ol>div>div { background: linear-gradient(#4b4b4b, #464646); } -.themebutton.simple{ - background:url('../../image/background/ol_bg.jpg'); + +.themebutton.simple { + background: url('../../image/background/ol_bg.jpg'); background-size: cover; } -.themebutton.simple>div:not(*:first-child){ - background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)); + +.themebutton.simple>div:not(*:first-child) { + background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)); box-shadow: rgba(0, 0, 0, 0.4) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px; } -.themebutton.simple>div>div{ - background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.4)); + +.themebutton.simple>div>div { + background: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)); } + .themebutton.simple>div>div.active, -.themebutton.music>div>div.active{ - background-image: linear-gradient(rgba(47,101,150,1), rgba(43, 90, 132,1)); +.themebutton.music>div>div.active { + background-image: linear-gradient(rgba(47, 101, 150, 1), rgba(43, 90, 132, 1)); } -.themebutton>div>div:first-child{ - margin-top:5px; + +.themebutton>div>div:first-child { + margin-top: 5px; } -.themebutton>.fakeplayer>.avatar{ + +.themebutton>.fakeplayer>.avatar { width: calc(100% - 2px); height: calc(100% - 2px); left: 1px; @@ -691,12 +888,14 @@ position: absolute; margin: 0 !important; padding: 0; - box-shadow: rgba(0,0,0,0.2) 0 0 0 1px inset; + box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px inset; } -.themebutton>.fakeplayer.oldlayout>.avatar{ + +.themebutton>.fakeplayer.oldlayout>.avatar { width: calc(50% - 2px); } -.themebutton>.fakeplayer.me>.avatar{ + +.themebutton>.fakeplayer.me>.avatar { width: 22px; height: 22px; left: 3px; @@ -704,11 +903,13 @@ box-shadow: none; border-radius: 0px; } -.themebutton>.fakeplayer.me{ + +.themebutton>.fakeplayer.me { clip-path: polygon(-10px 0, 32px 0, 32px 32px, -10px 32px); -webkit-clip-path: polygon(-10px 0, 32px 0, 32px 32px, -10px 32px); } -.themebutton>div>div>div{ + +.themebutton>div>div>div { width: 200%; height: 200%; left: 0; @@ -721,49 +922,57 @@ text-align: center; box-shadow: none !important; } -.themebutton.woodden>div>div>div{ + +.themebutton.woodden>div>div>div { color: rgba(77, 60, 51, 0.8); text-shadow: none; } -#window:not(.nopointer) .popup-container>.menu>div{ +#window:not(.nopointer) .popup-container>.menu>div { cursor: pointer; } -.popup-container>.menu.visual>div{ + +.popup-container>.menu.visual>div { display: inline-block; - margin:5px !important; + margin: 5px !important; padding: 0 !important; width: 90px; height: 90px; } -.popup-container>.menu.visual.withbar>div:last-child{ + +.popup-container>.menu.visual.withbar>div:last-child { display: block; width: calc(100% - 10px); text-align: center; height: auto; cursor: default !important; } -.popup-container>.menu.visual.withbar>div:last-child>div{ + +.popup-container>.menu.visual.withbar>div:last-child>div { display: inline-block; position: relative; margin-left: 5px; margin-right: 5px; } -.popup-container>.menu.visual.withbar>div:not(.showdelete)>.deletebutton{ + +.popup-container>.menu.visual.withbar>div:not(.showdelete)>.deletebutton { display: none; } -.popup-container>.menu.visual.withbar>div.hideadd>.addbutton{ + +.popup-container>.menu.visual.withbar>div.hideadd>.addbutton { display: none; } -.popup-container>.menu.visual.withbar>div.showdelete>div:first-child:not(.addbutton){ + +.popup-container>.menu.visual.withbar>div.showdelete>div:first-child:not(.addbutton) { display: none; } -#window:not(.nopointer) .popup-container>.menu.visual.withbar>div:last-child>div{ + +#window:not(.nopointer) .popup-container>.menu.visual.withbar>div:last-child>div { cursor: pointer; } -input.fileinput{ +input.fileinput { margin: 0 !important; padding: 0 !important; position: absolute !important; @@ -773,124 +982,220 @@ input.fileinput{ top: 0 !important; opacity: 0 !important; } + input.fileinput::-webkit-file-upload-button { - cursor: pointer; -} -#window:not(.nopointer) input.fileinput{ cursor: pointer; } -.popup-container>.menu.visual>.button.character>.name{ + +#window:not(.nopointer) input.fileinput { + cursor: pointer; +} + +.popup-container>.menu.visual>.button.character>.name { top: 10px; } -.popup-container>.menu>div:first-child{ - margin-top:5px; -} -.popup-container>.menu>div:last-child{ - margin-bottom:5px; + +.popup-container>.menu>div:first-child { + margin-top: 5px; } -.config{ - height:25px; - line-height:25px; - position:relative; +.popup-container>.menu>div:last-child { + margin-bottom: 5px; } + +.config { + height: 25px; + line-height: 25px; + position: relative; +} + #window:not(.nopointer) .config.switcher>div, -#window:not(.nopointer) .config.toggle>div{ +#window:not(.nopointer) .config.toggle>div { cursor: pointer; } + .config.switcher>div, -.config.toggle>div{ - position:absolute; - right:0; - left:auto; - display:inline-block; - transition:all 0.3s; - height:25px; +.config.toggle>div { + position: absolute; + right: 0; + left: auto; + display: inline-block; + transition: all 0.3s; + height: 25px; } -.config.switcher>div{ - border-bottom-width:2px; - border-bottom-style:solid; - border-bottom-color:transparent; + +.config.switcher>div { + border-bottom-width: 2px; + border-bottom-style: solid; + border-bottom-color: transparent; margin-right: 4px; } -.config.switcher.on>div{ - border-bottom-color:rgb(0, 133, 255); -} -.config.toggle>div{ - width:60px; -} -.config.toggle>div>div{ - display:inline-block; - position:relative; - width:25px; - height:25px; - top:0; - left:0; - transition:all 0.3s; - padding: 0; -} -.config.toggle.on>div>div{ - left:calc(100% - 25px); -} -.config.more{ - z-index:1; -} -.config.more>div{ - display:inline-block; - transition:transform 0.3s -} -.config.more>div{ - transform:translateY(-2px); - font-family: 'huangcao','xinwei'; -} -.config.more.on>div{ - transform:rotate(90deg) translateX(-2px); + +.config.switcher.on>div { + border-bottom-color: rgb(0, 133, 255); } -.menubutton{ - text-align:center; - display:inline-block; - padding:5px; -} -.menubutton.large{ - font-size:30px; - line-height:30px; - font-family:'STXinwei','xinwei'; -} -.menubutton.round{ - width:40px; - height:40px; - border-radius:100%; - font-size:36px; - line-height:40px; - font-family:'xinwei' -} -.menubutton.left{ - float:left; -} -.menubutton.right{ - float:right; -} -.menubutton.search{ - text-align:left; -} -.menubutton.search:not(.focus){ - color:rgba(255,255,255,0.5); -} -.menubutton.dim{ - color:rgba(255,255,255,0.5); +.config.toggle>div { + width: 60px; } -@keyframes fadein{from{opacity:0}} -@-webkit-keyframes fadein{from{opacity:0}} -@keyframes menuslideup{from{top:100%}} -@-webkit-keyframes menuslideup{from{top:100%}} -@keyframes menuslidedown{to{top:100%}} -@-webkit-keyframes menuslidedown{to{top:100%}} -@keyframes menuzoomin{from{transform:scale(0.5);opacity:0;transform-origin:2px -35px}to{transform-origin:2px -35px}} -@-webkit-keyframes menuzoomin{from{transform:scale(0.5);opacity:0;transform-origin:2px -35px}to{transform-origin:2px -35px}} -@keyframes menuzoomout{from{transform-origin:2px -35px}to{transform:scale(0.5);opacity:0;transform-origin:2px -35px}} -@-webkit-keyframes menuzoomout{from{transform-origin:2px -35px}to{transform:scale(0.5);opacity:0;transform-origin:2px -35px}} +.config.toggle>div>div { + display: inline-block; + position: relative; + width: 25px; + height: 25px; + top: 0; + left: 0; + transition: all 0.3s; + padding: 0; +} + +.config.toggle.on>div>div { + left: calc(100% - 25px); +} + +.config.more { + z-index: 1; +} + +.config.more>div { + display: inline-block; + transition: transform 0.3s +} + +.config.more>div { + transform: translateY(-2px); + font-family: 'huangcao', 'xinwei'; +} + +.config.more.on>div { + transform: rotate(90deg) translateX(-2px); +} + +.menubutton { + text-align: center; + display: inline-block; + padding: 5px; +} + +.menubutton.large { + font-size: 30px; + line-height: 30px; + font-family: 'STXinwei', 'xinwei'; +} + +.menubutton.round { + width: 40px; + height: 40px; + border-radius: 100%; + font-size: 36px; + line-height: 40px; + font-family: 'xinwei' +} + +.menubutton.left { + float: left; +} + +.menubutton.right { + float: right; +} + +.menubutton.search { + text-align: left; +} + +.menubutton.search:not(.focus) { + color: rgba(255, 255, 255, 0.5); +} + +.menubutton.dim { + color: rgba(255, 255, 255, 0.5); +} + +@keyframes fadein { + from { + opacity: 0 + } +} + +@-webkit-keyframes fadein { + from { + opacity: 0 + } +} + +@keyframes menuslideup { + from { + top: 100% + } +} + +@-webkit-keyframes menuslideup { + from { + top: 100% + } +} + +@keyframes menuslidedown { + to { + top: 100% + } +} + +@-webkit-keyframes menuslidedown { + to { + top: 100% + } +} + +@keyframes menuzoomin { + from { + transform: scale(0.5); + opacity: 0; + transform-origin: 2px -35px + } + + to { + transform-origin: 2px -35px + } +} + +@-webkit-keyframes menuzoomin { + from { + transform: scale(0.5); + opacity: 0; + transform-origin: 2px -35px + } + + to { + transform-origin: 2px -35px + } +} + +@keyframes menuzoomout { + from { + transform-origin: 2px -35px + } + + to { + transform: scale(0.5); + opacity: 0; + transform-origin: 2px -35px + } +} + +@-webkit-keyframes menuzoomout { + from { + transform-origin: 2px -35px + } + + to { + transform: scale(0.5); + opacity: 0; + transform-origin: 2px -35px + } +} @@ -898,75 +1203,87 @@ input.fileinput::-webkit-file-upload-button { -.menu-buttons>.new_character{ +.menu-buttons>.new_character { display: block; position: relative; width: 100%; } -.menu-buttons>.new_character>.avatar{ + +.menu-buttons>.new_character>.avatar { background-size: cover; } + .menu-buttons>.new_character>.avatar, -.menu-buttons>.new_character>.card{ - top:8px; - left:12px; +.menu-buttons>.new_character>.card { + top: 8px; + left: 12px; position: absolute; width: 100px; height: 130px; margin: 0; } -.menu-buttons>.new_character>.card{ + +.menu-buttons>.new_character>.card { height: 100px; } -.menu-buttons>.new_character>.card:not(.fullskin){ + +.menu-buttons>.new_character>.card:not(.fullskin) { color: white; text-shadow: black 0px 0px 2px; transform: translateX(0px); background-image: url("image/card/hslingjian_jinjilengdong.jpg"); background-size: cover; } + .menu-buttons>.new_character>.avatar>input, -.menu-buttons>.new_character>.card>input{ +.menu-buttons>.new_character>.card>input { z-index: 3; border-radius: 8px; opacity: 0; width: 100%; height: 100%; - left:0; - top:0; + left: 0; + top: 0; position: absolute; } + #window[data-radius_size='reduce'] .menu-buttons>.new_character>.avatar>input, -#window[data-radius_size='reduce'] .menu-buttons>.new_character>.card>input{ - border-radius:4px; +#window[data-radius_size='reduce'] .menu-buttons>.new_character>.card>input { + border-radius: 4px; } + #window[data-radius_size='off'] .menu-buttons>.new_character>.avatar>input, -#window[data-radius_size='off'] .menu-buttons>.new_character>.card>input{ - border-radius:0px; +#window[data-radius_size='off'] .menu-buttons>.new_character>.card>input { + border-radius: 0px; } + #window[data-radius_size='increase'] .menu-buttons>.new_character>.avatar>input, -#window[data-radius_size='increase'] .menu-buttons>.new_character>.card>input{ - border-radius:16px; +#window[data-radius_size='increase'] .menu-buttons>.new_character>.card>input { + border-radius: 16px; } + .menu-buttons>.new_character>.avatar>.select_avatar, -.menu-buttons>.new_character>.card>.select_avatar{ +.menu-buttons>.new_character>.card>.select_avatar { font-family: 'xinwei'; font-size: 20px; width: 100%; height: 20px; line-height: 20px; - top:55px; - left:0; + top: 55px; + left: 0; text-align: center; } -.menu-buttons>.new_character>.card>.select_avatar{ - top:40px; + +.menu-buttons>.new_character>.card>.select_avatar { + top: 40px; } + .menu-buttons>.new_character>.avatar.inited>.select_avatar, -.menu-buttons>.new_character>.card.inited>.select_avatar{ +.menu-buttons>.new_character>.card.inited>.select_avatar { display: none; } -.menu-buttons>.new_character>.indent{ + +.menu-buttons>.new_character>.indent { display: block; margin-left: 123px; width: calc(100% - 135px); @@ -975,13 +1292,16 @@ input.fileinput::-webkit-file-upload-button { text-align: left; white-space: nowrap; } -.menu-buttons>.new_character>.indent>input{ + +.menu-buttons>.new_character>.indent>input { width: 60px; } -.menu-buttons>.new_character>div>select{ + +.menu-buttons>.new_character>div>select { margin-right: 3px; } -.menu-buttons>.new_character>.add_skill{ + +.menu-buttons>.new_character>.add_skill { position: absolute; left: 12px; top: 205px; @@ -989,35 +1309,44 @@ input.fileinput::-webkit-file-upload-button { line-height: 20px; white-space: nowrap; } -.menu-buttons>.new_character>.add_skill.options{ - top:160px; + +.menu-buttons>.new_character>.add_skill.options { + top: 160px; } -.menu-buttons>.new_character>.add_skill.options>span{ + +.menu-buttons>.new_character>.add_skill.options>span { margin-right: 10px; } -.menu-buttons>.new_character>.add_skill.create{ + +.menu-buttons>.new_character>.add_skill.create { top: 220px; } -.menu-buttons>.new_character>.add_skill.create>div{ + +.menu-buttons>.new_character>.add_skill.create>div { position: relative; } -.menu-buttons>.new_character>.add_skill.create>div.hidden{ + +.menu-buttons>.new_character>.add_skill.create>div.hidden { display: none; } -.menu-buttons>.new_character>.add_skill.create>div>textarea{ + +.menu-buttons>.new_character>.add_skill.create>div>textarea { resize: none; - width: 200px; - height: 100px; - margin-top: 5px; + width: 200px; + height: 100px; + margin-top: 5px; } -.menu-buttons>.new_character>.add_skill.create>div>div{ + +.menu-buttons>.new_character>.add_skill.create>div>div { position: relative; margin-top: 5px; } -.menu-buttons>.new_character>.add_skill.create>div>div>input{ + +.menu-buttons>.new_character>.add_skill.create>div>div>input { width: 120px; } -.menu-buttons>.new_character>.skill_list{ + +.menu-buttons>.new_character>.skill_list { position: absolute; left: 12px; top: 265px; @@ -1027,107 +1356,128 @@ input.fileinput::-webkit-file-upload-button { padding-bottom: 30px; transition: all 0s; } -.menu-buttons>.new_character>.skill_list>div{ + +.menu-buttons>.new_character>.skill_list>div { position: relative; width: 100%; margin: 0; padding: 0; height: auto; } -.menu-buttons>.new_character>.skill_list>div>div{ + +.menu-buttons>.new_character>.skill_list>div>div { position: relative; } -.menu-buttons>.new_character>.skill_list>div:first-child{ + +.menu-buttons>.new_character>.skill_list>div:first-child { margin-bottom: 10px; } -.menu-buttons>.new_character>.skill_list>div:first-child>div{ + +.menu-buttons>.new_character>.skill_list>div:first-child>div { width: calc(50% - 10px); margin-right: 10px; margin-top: 6px; } -.menu-buttons>.new_character>.skill_list>div:first-child>div>div{ + +.menu-buttons>.new_character>.skill_list>div:first-child>div>div { position: relative; } -.menu-buttons>.new_character>.skill_list>div:first-child>div>div:last-child{ + +.menu-buttons>.new_character>.skill_list>div:first-child>div>div:last-child { float: right; } -.menu-buttons>.new_character.export{ +.menu-buttons>.new_character.export { text-align: left; } -.menu-buttons>.new_character.export>div{ + +.menu-buttons>.new_character.export>div { position: relative; margin-left: 12px; margin-top: 5px; } -.menu-buttons>.new_character.export>div>input{ + +.menu-buttons>.new_character.export>div>input { width: 100px; margin-right: 5px; } -.menu-buttons>.new_character.export.import>div>input{ + +.menu-buttons>.new_character.export.import>div>input { width: 153px; } -.menubutton{ +.menubutton { box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px; - border-radius:4px; - background-image: linear-gradient(rgba(75,75,75,1), rgba(70,70,70,1)); + border-radius: 4px; + background-image: linear-gradient(rgba(75, 75, 75, 1), rgba(70, 70, 70, 1)); } + .menubutton.large.blue, .menubutton.large.red, -.redbg{ - color:white !important; +.redbg { + color: white !important; box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.3) 0 3px 10px !important; } + .menubutton.active, -.menubutton.blue{ - background-image: linear-gradient(rgba(47,101,150,1), rgba(43, 90, 132,1)); +.menubutton.blue { + background-image: linear-gradient(rgba(47, 101, 150, 1), rgba(43, 90, 132, 1)); } + .tdnodes.selected, .text.selected, -.bluebg{ - background-image: linear-gradient(rgba(47,101,150,1), rgba(43, 90, 132,1)) !important; +.bluebg { + background-image: linear-gradient(rgba(47, 101, 150, 1), rgba(43, 90, 132, 1)) !important; } -#system>div>.pressdown{ + +#system>div>.pressdown { transform: scale(0.97); } + .control:not(.disabled) { transition: all 0.1s; } + .control:not(.disabled).controlpressdownx { transition: all 0.5s; } -#system>div>.pressdown2{ - background-image: linear-gradient(rgba(47,101,150,1), rgba(43, 90, 132,1)); + +#system>div>.pressdown2 { + background-image: linear-gradient(rgba(47, 101, 150, 1), rgba(43, 90, 132, 1)); } + .menubutton.highlight, -.menubutton.red{ +.menubutton.red { background-image: linear-gradient(rgba(150, 47, 47, 1), rgba(132, 43, 43, 1)); } + .menubutton.large.active, -.menubutton.large.lighlight{ +.menubutton.large.lighlight { box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px, rgba(0, 0, 0, 0.3) 0 3px 10px; } -.config.toggle>div{ - border-radius:25px; +.config.toggle>div { + border-radius: 25px; box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 0 10px inset; } -.config.toggle.on>div{ - background-color:rgba(47,101,150,1); + +.config.toggle.on>div { + background-color: rgba(47, 101, 150, 1); } -.config.toggle>div>div{ - border-radius:25px; - background-image: linear-gradient(rgba(75,75,75,1), rgba(70,70,70,1)); + +.config.toggle>div>div { + border-radius: 25px; + background-image: linear-gradient(rgba(75, 75, 75, 1), rgba(70, 70, 70, 1)); box-shadow: rgba(51, 51, 51, 1) 0 0 0 1px, rgba(0, 0, 0, 0.2) 0 3px 10px; } -.popup-container>.menu:not(.visual)>div:hover{ - color:white; - background-image: linear-gradient(rgba(47,101,150,1), rgba(43, 90, 132,1)); - box-shadow: rgba(0,0,0,0.2) 0 0 0 1px; +.popup-container>.menu:not(.visual)>div:hover { + color: white; + background-image: linear-gradient(rgba(47, 101, 150, 1), rgba(43, 90, 132, 1)); + box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px; } -.videonode.menubutton{ + +.videonode.menubutton { width: calc(100% - 50px); height: 70px; margin-bottom: 6px; @@ -1135,34 +1485,41 @@ input.fileinput::-webkit-file-upload-button { margin-top: 6px; overflow: hidden; } -.videonode.menubutton.extension{ + +.videonode.menubutton.extension { text-align: left; height: auto; max-height: 90px; } -.videonode.menubutton.extension.current{ + +.videonode.menubutton.extension.current { max-height: 400px; } -.videonode.menubutton>div{ + +.videonode.menubutton>div { position: absolute; } -.videonode.menubutton.extension>div{ + +.videonode.menubutton.extension>div { position: relative; display: block; } -#window:not(.nopointer) .videonode.menubutton.extension>.caption>.menubutton:not(.transparent2):not(.nopointer){ + +#window:not(.nopointer) .videonode.menubutton.extension>.caption>.menubutton:not(.transparent2):not(.nopointer) { cursor: pointer; } -.videonode.menubutton.extension>.caption>.menubutton{ + +.videonode.menubutton.extension>.caption>.menubutton { position: relative; float: right; font-size: 16px; padding: 0; text-align: center; width: 80px; - font-family:'STHeiti','SimHei','Microsoft JhengHei','Microsoft YaHei','WenQuanYi Micro Hei',Helvetica,Arial,sans-serif; + font-family: 'STHeiti', 'SimHei', 'Microsoft JhengHei', 'Microsoft YaHei', 'WenQuanYi Micro Hei', Helvetica, Arial, sans-serif; } -.videonode.menubutton.extension>.caption>.menubutton>a{ + +.videonode.menubutton.extension>.caption>.menubutton>a { margin: 0; padding: 0; width: 100%; @@ -1173,47 +1530,54 @@ input.fileinput::-webkit-file-upload-button { cursor: pointer; position: absolute; } -.videonode.menubutton>.videoavatar{ + +.videonode.menubutton>.videoavatar { width: 56px; height: 56px; - top:7px; - left:7px; + top: 7px; + left: 7px; background-size: cover; } -.videonode.menubutton>.videoavatar2{ + +.videonode.menubutton>.videoavatar2 { width: 20px; height: 20px; - top:47px; - left:3px; + top: 47px; + left: 3px; background-size: cover; border-radius: 100%; } -.videonode.menubutton>.caption{ + +.videonode.menubutton>.caption { display: inline-block; left: 84px; top: 6px; padding-top: 0; white-space: nowrap; } -.videonode.menubutton.extension>.caption{ + +.videonode.menubutton.extension>.caption { left: 0; top: 0; margin-left: 2px; } -.videonode.menubutton>.text{ + +.videonode.menubutton>.text { font-size: 14px; left: 85px; top: 35px; line-height: 20px; text-align: left; - font-family:'STHeiti','SimHei','Microsoft JhengHei','Microsoft YaHei','WenQuanYi Micro Hei',Helvetica,Arial,sans-serif + font-family: 'STHeiti', 'SimHei', 'Microsoft JhengHei', 'Microsoft YaHei', 'WenQuanYi Micro Hei', Helvetica, Arial, sans-serif } -.videonode.menubutton.extension>.text{ + +.videonode.menubutton.extension>.text { left: 0; top: 0; margin-left: 5px; } -.videonode.menubutton.extension>.text.author>span{ + +.videonode.menubutton.extension>.text.author>span { /*float: right;*/ position: absolute; right: 0; @@ -1223,20 +1587,23 @@ input.fileinput::-webkit-file-upload-button { text-align: center; opacity: 0; } -.videonode.menubutton.extension.current>.text.author>span{ + +.videonode.menubutton.extension.current>.text.author>span { opacity: 1; } -.videonode.menubutton>.victory{ - font-family: 'huangcao','xinwei'; + +.videonode.menubutton>.victory { + font-family: 'huangcao', 'xinwei'; font-size: 25px; - text-shadow: black 0 0 1px,rgba(255, 203, 0,1) 0 0 2px,rgba(255, 203, 0,1) 0 0 5px,rgba(255, 203, 0,1) 0 0 5px, - rgba(255, 203, 0,1) 0 0 5px,black 0 0 1px; - color:white; + text-shadow: black 0 0 1px, rgba(255, 203, 0, 1) 0 0 2px, rgba(255, 203, 0, 1) 0 0 5px, rgba(255, 203, 0, 1) 0 0 5px, + rgba(255, 203, 0, 1) 0 0 5px, black 0 0 1px; + color: white; position: absolute; left: 48px; top: 48px; } -.videonode>.video_star{ + +.videonode>.video_star { opacity: 0; position: absolute; left: 196px; @@ -1247,23 +1614,26 @@ input.fileinput::-webkit-file-upload-button { line-height: 20px; text-align: center; } -.videonode:not(.starred):hover>.video_star{ + +.videonode:not(.starred):hover>.video_star { opacity: 0.5; } -.videonode.starred>.video_star{ + +.videonode.starred>.video_star { opacity: 1 } -.onlineclient .videonode{ +.onlineclient .videonode { margin: 5px; - padding: 0; - width: calc(100% - 20px); - height: 30px; + padding: 0; + width: calc(100% - 20px); + height: 30px; overflow: visible; - border-top-left-radius:10px; - border-bottom-left-radius:10px; + border-top-left-radius: 10px; + border-bottom-left-radius: 10px; } -.onlineclient .videonode>.videoavatar{ + +.onlineclient .videonode>.videoavatar { padding: 0; left: -4px; top: -2px; @@ -1271,15 +1641,18 @@ input.fileinput::-webkit-file-upload-button { height: 34px; border-radius: 100%; } -.onlineclient .videotext{ + +.onlineclient .videotext { margin-top: 0px; font-size: 14px; width: calc(100% - 30px); } -.onlineclient .onlineevent.videotext{ + +.onlineclient .onlineevent.videotext { margin-top: 2px; } -.onlineclient .videonode>.name{ + +.onlineclient .videonode>.name { left: 35px; max-width: 125px; overflow: hidden; @@ -1288,12 +1661,14 @@ input.fileinput::-webkit-file-upload-button { height: 30px; line-height: 30px; font-size: 18px; - font-family: 'lishu','xinwei'; + font-family: 'lishu', 'xinwei'; } -.onlineclient .videonode.videonodestatus{ + +.onlineclient .videonode.videonodestatus { height: auto; } -.onlineclient .videonode.videonodestatus>.videostatus{ + +.onlineclient .videonode.videonodestatus>.videostatus { position: relative; display: block; margin-left: 10px; @@ -1301,50 +1676,56 @@ input.fileinput::-webkit-file-upload-button { margin-bottom: 5px; width: calc(100% - 20px); } -.onlineevent>div{ + +.onlineevent>div { text-align: left; position: relative; display: block; margin-top: 5px; margin-bottom: 5px; } -.onlineevent>div.title{ + +.onlineevent>div.title { font-family: 'xinwei'; font-size: 18px; } -.button-downloading>.button-progress{ +.button-downloading>.button-progress { width: 100%; border-radius: 4px; z-index: 1; overflow: hidden; } -.button-downloading>.button-progress>div{ + +.button-downloading>.button-progress>div { width: 0; height: 100%; position: absolute; left: 0px; top: 0px; border-radius: 0px; - background: linear-gradient(rgb(29,206,68),rgb(1,148,46)); + background: linear-gradient(rgb(29, 206, 68), rgb(1, 148, 46)); } -.button-downloading>div:not(.button-progress){ + +.button-downloading>div:not(.button-progress) { width: 100% !important; z-index: 2; } -.button-downloading>span{ + +.button-downloading>span { opacity: 0; } -.button-downloading>div{ + +.button-downloading>div { height: 100%; margin: 0 !important; padding: 0 !important; position: absolute !important; left: 0 !important; - top:0; + top: 0; } -.menu-buttons .file-container{ +.menu-buttons .file-container { position: absolute; margin: 0; padding: 0; @@ -1354,7 +1735,8 @@ input.fileinput::-webkit-file-upload-button { height: 100%; overflow: scroll; } -.menu-buttons .file-container>div{ + +.menu-buttons .file-container>div { position: relative; left: 0; display: block; @@ -1363,37 +1745,43 @@ input.fileinput::-webkit-file-upload-button { white-space: nowrap; text-align: left; } -.menu-buttons .file-container>div>span{ + +.menu-buttons .file-container>div>span { cursor: pointer; text-decoration: underline; } -.menu-buttons .file-container>div>img{ + +.menu-buttons .file-container>div>img { display: block; margin-top: 5px; } -.menubutton.large.dashboard{ +.menubutton.large.dashboard { width: 80px; height: 80px; margin: 6px; position: relative !important; } -.menubutton.large.dashboard.dashboard2{ + +.menubutton.large.dashboard.dashboard2 { width: 60px; height: 60px; margin: 5px; margin-top: 10px; } -.menubutton.large.dashboard.dashboard2>div:first-child{ + +.menubutton.large.dashboard.dashboard2>div:first-child { font-size: 40px; line-height: 40px; } -.menubutton.large.dashboard.dashboard2>div:last-child{ + +.menubutton.large.dashboard.dashboard2>div:last-child { font-size: 16px; white-space: nowrap; } -.menubutton.large.dashboard>div:first-child{ - font-family: 'lishu','xiaozhuan'; + +.menubutton.large.dashboard>div:first-child { + font-family: 'lishu', 'xiaozhuan'; font-size: 60px; line-height: 60px; position: absolute; @@ -1402,22 +1790,26 @@ input.fileinput::-webkit-file-upload-button { width: 100%; height: 60px; } -.menubutton.large.dashboard>div:last-child{ + +.menubutton.large.dashboard>div:last-child { font-size: 18px; position: absolute; left: 0; bottom: 0; width: 100%; } -.favmode{ + +.favmode { float: right; } -#create-extension{ + +#create-extension { height: calc(100% - 5px); width: calc(100% - 10px); overflow: hidden; } -#create-extension>div{ + +#create-extension>div { position: absolute; width: 100%; height: 100%; @@ -1425,41 +1817,51 @@ input.fileinput::-webkit-file-upload-button { left: 0; top: 0; } -#create-extension>.menu-buttons{ - left:10px; + +#create-extension>.menu-buttons { + left: 10px; height: calc(100% - 5px); width: calc(100% - 15px) !important; } -#create-extension>.menu-buttons>.config.more{ + +#create-extension>.menu-buttons>.config.more { margin-left: 0px !important; margin-top: 10px !important; } -#create-extension>.menu-buttons>.config.more.margin-bottom{ + +#create-extension>.menu-buttons>.config.more.margin-bottom { margin-left: 0px !important; margin-top: 10px !important; margin-bottom: 5px !important; } -#create-extension>.hidden{ + +#create-extension>.hidden { pointer-events: none; } -#create-extension>div:not(*:first-child).hidden{ + +#create-extension>div:not(*:first-child).hidden { transform: translateX(200px); } -#create-extension>.menu-buttons>.new_character>.skill_list{ - top: 245px; + +#create-extension>.menu-buttons>.new_character>.skill_list { + top: 245px; } -#create-extension>.menu-buttons>.new_character>.skill_list>div:first-child{ + +#create-extension>.menu-buttons>.new_character>.skill_list>div:first-child { transition: all 0s; } -#create-extension>.menu-buttons>.new_character>.skill_list>div:first-child:not(*:empty){ + +#create-extension>.menu-buttons>.new_character>.skill_list>div:first-child:not(*:empty) { margin-top: 10px; margin-bottom: 10px; } -#create-extension>.menu-buttons>.new_character>.skill_list>div:first-child>button{ + +#create-extension>.menu-buttons>.new_character>.skill_list>div:first-child>button { margin-right: 3px; margin-bottom: 3px; } -.popup-container.editor>div{ + +.popup-container.editor>div { width: 80%; height: 90%; position: absolute; @@ -1470,10 +1872,11 @@ input.fileinput::-webkit-file-upload-button { background: white; overflow: hidden; } -.popup-container.editor>div>.editbutton{ + +.popup-container.editor>div>.editbutton { font-family: 'lishu'; font-size: 18px; - color: rgb(60,60,60); + color: rgb(60, 60, 60); text-shadow: none; position: absolute; left: 0; @@ -1481,71 +1884,84 @@ input.fileinput::-webkit-file-upload-button { font-size: 24px; cursor: pointer; } -.popup-container.editor>div>.editbutton:first-child{ + +.popup-container.editor>div>.editbutton:first-child { left: auto; right: 0; } -.popup-container.editor>div>div:last-child{ + +.popup-container.editor>div>div:last-child { width: 100%; height: calc(100% - 40px); position: absolute; - top:40px; + top: 40px; border-radius: 0 0 4px 4px; - border-top: 1px solid rgba(0,0,0,0.2); + border-top: 1px solid rgba(0, 0, 0, 0.2); } -.popup-container.editor>div>div:last-child>textarea{ + +.popup-container.editor>div>div:last-child>textarea { width: 100%; height: 100%; - border:none; - margin:0; + border: none; + margin: 0; padding: 0; resize: none; } + .menubutton.large.new_card, -.menubutton.large.new_card_delete{ +.menubutton.large.new_card_delete { left: 12px; top: 130px; margin-bottom: 20px; } -.menubutton.large.new_card_delete{ + +.menubutton.large.new_card_delete { left: 155px; } -.edit_pile{ + +.edit_pile { width: 100%; left: 0; padding-bottom: 20px; } -.edit_pile>div:last-child{ + +.edit_pile>div:last-child { width: 100%; position: relative; } -.edit_pile>div:last-child>button{ + +.edit_pile>div:last-child>button { margin-right: 3px; - margin-top: 3px; + margin-top: 3px; } -.new_character.new_skill>div{ + +.new_character.new_skill>div { position: relative; margin-top: 2px; white-space: nowrap; overflow: visible; } -.new_character.new_skill>div>button{ + +.new_character.new_skill>div>button { margin-right: 3px; } -.menu-buttons.new_skill>.menubutton{ + +.menu-buttons.new_skill>.menubutton { position: relative; - margin:5px; + margin: 5px; } -.new_character.new_skill>.menubutton.large{ + +.new_character.new_skill>.menubutton.large { left: 13px; position: absolute; top: 88px; } -.new_character.new_skill>.menubutton.large.new_card_delete{ + +.new_character.new_skill>.menubutton.large.new_card_delete { left: 155px; } -.popup-container>.prompt-container{ +.popup-container>.prompt-container { display: table; width: 100%; height: 100%; @@ -1554,17 +1970,20 @@ input.fileinput::-webkit-file-upload-button { margin: 0; padding: 0; } -.popup-container>.prompt-container>div{ + +.popup-container>.prompt-container>div { height: auto; display: table-cell; vertical-align: middle; text-align: center; position: relative; } -.popup-container>.prompt-container>div>div{ + +.popup-container>.prompt-container>div>div { position: relative; } -.popup-container>.prompt-container>div>div>div{ + +.popup-container>.prompt-container>div>div>div { display: block; width: calc(100% - 10px); margin-top: 15px; @@ -1575,13 +1994,15 @@ input.fileinput::-webkit-file-upload-button { position: relative; width: 230px; } + /* .popup-container>.prompt-container>div>div>div:first-child{ */ - /*text-align: left;*/ +/*text-align: left;*/ /* } */ -.popup-container>.prompt-container>div>div>div:last-child{ +.popup-container>.prompt-container>div>div>div:last-child { margin-bottom: 15px; } -.popup-container>.prompt-container>div>div>div>input{ + +.popup-container>.prompt-container>div>div>div>input { text-align: left; width: 100%; resize: none; @@ -1590,7 +2011,8 @@ input.fileinput::-webkit-file-upload-button { height: 20px; box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 0px 1px; } -.popup-container>.prompt-container>div>div>div>.menubutton{ + +.popup-container>.prompt-container>div>div>div>.menubutton { position: relative; margin-left: 6px; margin-right: 6px; @@ -1598,6 +2020,7 @@ input.fileinput::-webkit-file-upload-button { padding-top: 2px; padding-bottom: 2px; } -#window:not(.nopointer) .popup-container>.prompt-container>div>div>div>.menubutton{ + +#window:not(.nopointer) .popup-container>.prompt-container>div>div>div>.menubutton { cursor: pointer; -} +} \ No newline at end of file