You can not select more than 25 topics Topics must start with a chinese character,a letter or number, can include dashes ('-') and can be up to 35 characters long.

style.css 41 kB

7 years ago
6 years ago
7 years ago
7 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815
  1. @charset "utf-8";
  2. @font-face {
  3. font-family: 'FOT-KurokaneStd-EB';
  4. font-style: normal;
  5. /*font-weight: 400;*/
  6. src: url("fonts/FOT-KurokaneStd-EB.woff2") format('woff2'),
  7. url("fonts/FOT-KurokaneStd-EB.woff") format('woff'),
  8. url("fonts/FOT-KurokaneStd-EB.ttf") format('truetype'),
  9. url("fonts/FOT-KurokaneStd-EB.eot") format('embedded-opentype'),
  10. url("fonts/FOT-KurokaneStd-EB.svg") format('svg');
  11. }
  12. @keyframes loading-animate{
  13. from {
  14. transform: rotate(0deg);
  15. }
  16. to {
  17. transform: rotate(3600deg);
  18. }
  19. }
  20. body{
  21. --head-block-width: 108px;
  22. --head-block-height: 108px;
  23. --search-icon-unchecked: 0.4;
  24. --team-1-bgcolor : pink;
  25. --team-2-bgcolor : lightblue;
  26. --team-3-bgcolor : lightgreen;
  27. --team-1-color : red;
  28. --team-2-color : blue;
  29. --team-3-color : green;
  30. --font-family : "Microsoft Yahei","Source Han Sans",Arial, Helvetica, sans-serif, "Malgun Gothic", "맑은 고딕", "Gulim", AppleGothic;
  31. --game-font-family : 'FOT-KurokaneStd-EB',"Microsoft Yahei","Source Han Sans",Arial, Helvetica, sans-serif, "Malgun Gothic", "맑은 고딕", "Gulim", AppleGothic;
  32. --border-width: 2px;
  33. font-family: var(--font-family);
  34. }
  35. .display-none{
  36. display:none !important;
  37. }
  38. .disabled{
  39. cursor: not-allowed;
  40. pointer-events: none;
  41. opacity: 0.5;
  42. }
  43. .help-link::before{
  44. content: "Help & Tips";
  45. }
  46. .datasource-updatetime
  47. {
  48. cursor: pointer;
  49. }
  50. .title,
  51. .title-display
  52. {
  53. font-size: 2em;
  54. font-weight: bold;
  55. }
  56. .detail,
  57. .detail-display
  58. {
  59. min-height: 1.5em;
  60. font-size: 1.5em;
  61. }
  62. .title,
  63. .detail,
  64. .title-display,
  65. .detail-display
  66. {
  67. font-family: var(--font-family);
  68. width:100%;
  69. border: none;
  70. background: none;
  71. box-sizing: border-box;
  72. padding: 1px;
  73. margin: 0;
  74. }
  75. .guide-mod .formation-box,
  76. .guide-mod .control-box>div
  77. {
  78. display: none;
  79. }
  80. .guide-mod .control-box>div.status
  81. {
  82. display: block;
  83. }
  84. .formation-box .title:focus,
  85. .formation-box .detail:focus
  86. {
  87. border: black solid 1px;;
  88. background-color: #eee;
  89. padding: 0;
  90. }
  91. .formation-box .title,
  92. .formation-box .detail
  93. {
  94. display: none;
  95. }
  96. .formation-box .edit .title,
  97. .formation-box .edit .detail
  98. {
  99. display: block;
  100. }
  101. .formation-box .edit .title-display,
  102. .formation-box .edit .detail-display
  103. {
  104. display: none;
  105. }
  106. .config-checkbox-ipt{
  107. display:none;
  108. }
  109. .config-checkbox-lbl .config-checkbox-lbl-cicle{
  110. width: 28px;
  111. height: 12px;
  112. display: inline-block;
  113. position: relative;
  114. background-color: #8884;
  115. border-radius: 16px;
  116. margin-right: 5px;
  117. }
  118. .config-checkbox-lbl .config-checkbox-lbl-cicle::before{
  119. content:"";
  120. width: 20px;
  121. height: 20px;
  122. position: absolute;
  123. transition: .3s ease-out;
  124. background-color: #c6c6c6;
  125. box-shadow: 0 2px 4px 0 #0003;
  126. border-radius: 50%;
  127. left: -4px;
  128. top: -4px;
  129. }
  130. .config-checkbox-ipt:checked+.config-checkbox-lbl .config-checkbox-lbl-cicle {
  131. background: rgba(0,160,216,0.8);
  132. }
  133. .config-checkbox-ipt:checked+.config-checkbox-lbl .config-checkbox-lbl-cicle::before {
  134. background: #00A0D8;
  135. box-shadow: 0 2px 4px 0 rgba(0,160,216,0.4);
  136. left: calc(100% - 16px);
  137. }
  138. .config-checkbox-lbl{
  139. cursor: pointer;
  140. line-height: 25px;
  141. margin-right: 20px;
  142. display: inline-block;
  143. }
  144. .config-checkbox-lbl[for$=and-or]::after{
  145. content: "OR";
  146. }
  147. input:checked+ .config-checkbox-lbl[for$=and-or]::after{
  148. content: "AND";
  149. }
  150. .status{
  151. line-height: 16px;
  152. }
  153. /*.status.loading-mon-info .text::before{
  154. content: "正在加载怪物数据";
  155. }*/
  156. .status.loading-check-version .icon,
  157. .status.loading-mon-info .icon,
  158. .status.loading-skill-info .icon,
  159. .status.prepare-cauture .icon
  160. {
  161. display: inline-block;
  162. width: 16px;
  163. height: 16px;
  164. border: 4px SteelBlue dotted;
  165. border-radius: 50%;
  166. animation: loading-animate 50s infinite linear;
  167. vertical-align: middle;
  168. }
  169. ul{
  170. margin: 0;
  171. padding: 0;
  172. list-style: none;
  173. }
  174. /*队伍的整个盒子*/
  175. .formation-box{
  176. width: 648px;
  177. min-width: 648px;
  178. }
  179. /*单个怪物*/
  180. .monster{
  181. font-family: var(--game-font-family);
  182. width: 100px;
  183. height: 100px;
  184. margin: 0;
  185. display: block;
  186. background-repeat: no-repeat;
  187. position: relative;
  188. cursor: pointer;
  189. border-radius: 5px;
  190. }
  191. .null .monster,.delay .monster,
  192. .null .property,.delay .property,
  193. .null .subproperty,.delay .subproperty
  194. {
  195. box-sizing: border-box;
  196. background-image: none !important;
  197. }
  198. .null .monster{
  199. background-color: rgba(230,230,230,0.5);
  200. border: 3px grey dashed;
  201. }
  202. .edit-box .null .monster{
  203. background-color: #653;
  204. border: none;
  205. box-shadow: inset black 0 0 7px;
  206. }
  207. .member{
  208. vertical-align: top;
  209. }
  210. .delay .monster{
  211. background-color: yellow;
  212. box-shadow: inset orange 0 0 7px;
  213. border: 3px black solid;
  214. }
  215. .delay .monster::before{
  216. width: 94px;
  217. height: 94px;
  218. color: black;
  219. font-size: 30px;
  220. line-height: 47px;
  221. text-align: center;
  222. font-weight: bold;
  223. /*content: "应 对\A威 吓";*/
  224. font-family: var(--font-family);
  225. white-space: pre-wrap;
  226. display: inline-block;
  227. }
  228. /*怪物属性*/
  229. .property,.subproperty{
  230. position:absolute;
  231. left:0;top:0;
  232. width: 100px;
  233. height: 100px;
  234. background-repeat: no-repeat;
  235. background-image: url(images/CARDFRAME2.PNG);
  236. background-position: 100px 100px; /*默认都不显示*/
  237. }
  238. .property[data-property='6']{
  239. background-image: url(images/CARDFRAMEW.PNG);
  240. background-position: 0 0;
  241. }
  242. /*怪物-加值*/
  243. .monster .plus{
  244. color: yellow;
  245. font-size: 17px;
  246. line-height: 17px;
  247. text-shadow: black 0 0 1px,black 0 0 2px, black 2px 2px 0;
  248. position: absolute;
  249. left:10px;
  250. }
  251. .null .monster>div,.delay .monster>div{
  252. display:none !important;
  253. }
  254. .monster .plus .hp::before,
  255. .monster .plus .atk::before,
  256. .monster .plus .rcv::before,
  257. .monster .plus.has297::before
  258. {
  259. content: "+";
  260. }
  261. .monster .plus.has297::after{
  262. content: "297";
  263. }
  264. .monster .plus.has297 .hp,
  265. .monster .plus.has297 .atk,
  266. .monster .plus.has297 .rcv
  267. { /*当是297时隐藏3维*/
  268. display:none;
  269. }
  270. /*怪物-觉醒*/
  271. .monster .awoken-count,
  272. .row-mon-awoken .awoken-count
  273. {
  274. color: yellow;
  275. text-shadow: black 0 0 4px;
  276. text-align: center;
  277. background-image: url(images/awoken-count-bg.png);
  278. background-repeat: no-repeat;
  279. width: 34px;
  280. height: 38px;
  281. }
  282. .monster .awoken-count{
  283. position: absolute;
  284. top: -4px;
  285. right: 0;
  286. transform: scale(0.75) translateX(4px);
  287. }
  288. .monster .awoken-count,
  289. .monster .awoken-count.full-awoken::before,
  290. .row-mon-awoken .awoken-count,
  291. .row-mon-awoken .awoken-count.full-awoken::before
  292. {
  293. font-size: 20px;
  294. line-height: 28px;
  295. }
  296. .awoken-count.full-awoken{
  297. font-size: 0;
  298. }
  299. .awoken-count.full-awoken::before{
  300. content: "★";
  301. }
  302. .allowable-assist .awoken-count.full-awoken{
  303. font-size: 0;
  304. text-shadow: none;
  305. background-position-y: -38px;
  306. }
  307. .allowable-assist .awoken-count.full-awoken::before{
  308. content: none;
  309. }
  310. /*武器*/
  311. .monster.wepon .awoken-count.full-awoken{
  312. transform: scale(0.79) translateY(4px);
  313. width:32px;height:32px;
  314. background-image: url(images/awoken.png);
  315. background-position-x: 0;
  316. background-position-y: -1568px;
  317. }
  318. /*怪物-超觉醒*/
  319. .monster .super-awoken{
  320. position: absolute;
  321. right:0;
  322. top: 25px;
  323. transform: scale(0.75) translateX(4px);
  324. }
  325. /*怪物-等级*/
  326. .monster .level{
  327. color: white;
  328. height: 17px;
  329. text-shadow: black 0 0 2px, black 2px 2px 0;
  330. position: absolute;
  331. left: 5px;
  332. bottom: 0;
  333. vertical-align: top;
  334. }
  335. .monster .level,.monster .level.max::before{
  336. font-size: 15px;
  337. line-height: 17px;
  338. }
  339. .monster .level.max{
  340. font-size: 0;
  341. }
  342. .monster .level._110{
  343. color: lightskyblue;
  344. }
  345. /*.monster .level::before{
  346. content: "Lv.";
  347. }.monster .level.max::before{
  348. content: "Lv.最大";
  349. }*/
  350. .monster .id{
  351. display: block;
  352. color: white;
  353. font-family: var(--font-family);
  354. font-size: 15px;
  355. font-weight: 500;
  356. line-height: 17px;
  357. height: 17px;
  358. text-shadow: black 0px 0px 2px,black -1px -1px 1px,black 1px 1px 1px;
  359. position: absolute;
  360. left: 5px;
  361. bottom: 15px;
  362. }
  363. .not-show-mon-id .monster .id{
  364. display: none;
  365. }
  366. .monster .id::before{
  367. font-size: 12px;
  368. }
  369. /*.monster .id::before{
  370. content: "No.";
  371. }*/
  372. .monster .skill::before{
  373. content:"CD";
  374. font-size: 10px;
  375. }
  376. .monster .skill{
  377. font-size: 13px;
  378. line-height: 13px;
  379. color:white;
  380. text-shadow: black 0 0 1px,black 0 0 2px, black 2px 2px 0;
  381. position: absolute;
  382. right:0;
  383. bottom:0;
  384. }
  385. .monster .skill.max-skill{
  386. display: none;
  387. }
  388. .show-mon-skill-cd .monster .skill.max-skill{
  389. display: block;
  390. }
  391. .not-show-awoken-count .formation-box .team-total-info, /*单个队伍血量统计*/
  392. .not-show-awoken-count .formation-box .team-ability, /*单个队伍三维*/
  393. .not-show-awoken-count .formation-box .team-awoken, /*单个队伍觉醒统计*/
  394. .not-show-awoken-count .formation-box .team-total-info /*单个队伍血量统计*/
  395. {
  396. display: none !important;
  397. }
  398. .not-show-awoken-count .formation-box .team-bigbox
  399. {
  400. margin-bottom: 5px;
  401. }
  402. .not-show-awoken-count .formation-box .team-badge
  403. {
  404. position: absolute;
  405. z-index: 10;
  406. }
  407. /*辅助和队伍的每一只框架*/
  408. .member, .acquisitus-awoken-icon{
  409. display: inline-block;
  410. position: relative;
  411. width: var(--head-block-width);
  412. }
  413. .formation-box .monster{
  414. margin: 4px; /*留给队长边框的*/
  415. }
  416. .team-assist, .team-members,.team-badge{
  417. display: inline-block;
  418. }
  419. /* 徽章,平时都隐藏 */
  420. .team-badge li{
  421. display: inline-block;
  422. }
  423. .badge-radio{
  424. display: none;
  425. }
  426. .badge{
  427. display: none;
  428. cursor: pointer;
  429. }
  430. /* 显示所有徽章时则打开 */
  431. .show-all-badges .badge{
  432. display: inline-block;
  433. }
  434. /* 选中的徽章平时也打开 */
  435. .team-badge .badge-radio:checked+.badge{
  436. display: inline-block;
  437. }
  438. /*队伍的背景色*/
  439. .team-1 .team-members,
  440. .team-1 .team-latents,
  441. .team-1 .team-box-name::before,
  442. .team-1 .team-box-name::after
  443. {
  444. background-color: var(--team-1-bgcolor);
  445. }
  446. .team-2 .team-members,
  447. .team-2 .team-latents,
  448. .team-2 .team-box-name::before,
  449. .team-2 .team-box-name::after
  450. {
  451. background-color: var(--team-2-bgcolor);
  452. }
  453. .team-3 .team-members,
  454. .team-3 .team-latents,
  455. .team-3 .team-box-name::before,
  456. .team-3 .team-box-name::after
  457. {
  458. background-color: var(--team-3-bgcolor);
  459. }
  460. .team-bigbox{
  461. position: relative;
  462. font-size:0;
  463. margin-bottom:10px;
  464. }
  465. .team-bigbox:last-of-type{
  466. margin-bottom:0;
  467. }
  468. /*队伍A、B的文字*/
  469. .team-box-name::after,
  470. .team-box-name::before
  471. {
  472. font-size: 30px;
  473. font-weight: bold;
  474. text-align: center;
  475. line-height: 54px;
  476. white-space: pre-wrap;
  477. display: none;
  478. width: var(--head-block-width);
  479. height: var(--head-block-height);
  480. }
  481. .show-team-name-left .team-box-name::before{
  482. display: inline-block;
  483. }
  484. .show-team-name-right .team-box-name::after{
  485. display: inline-block;
  486. }
  487. .reverse-member-assist .team-box-name::after,
  488. .reverse-member-assist .team-box-name::before
  489. {
  490. vertical-align:top;
  491. }
  492. .team-1 .team-box-name::after,
  493. .team-1 .team-box-name::before,
  494. .team-1 .team-assist .member::after,
  495. .team-1 .team-assist .member::before
  496. {
  497. color: var(--team-1-color);
  498. }
  499. .team-2 .team-box-name::after,
  500. .team-2 .team-box-name::before,
  501. .team-2 .team-assist .member::after,
  502. .team-2 .team-assist .member::before
  503. {
  504. color: var(--team-2-color);
  505. /*vertical-align:top;*/
  506. }
  507. .team-3 .team-box-name::after,
  508. .team-3 .team-box-name::before,
  509. .team-3 .team-assist .member::after,
  510. .team-3 .team-assist .member::before
  511. {
  512. color: var(--team-3-color);
  513. }
  514. .team-box{
  515. display: inline-block;
  516. vertical-align:bottom;
  517. }
  518. .team-box .team-assist .member::after,
  519. .team-box .team-assist .member::before
  520. {
  521. width: var(--head-block-width);
  522. text-align: center;
  523. font-size: 18px;
  524. font-weight: bold;
  525. position: relative;
  526. }
  527. /*平时的显示*/
  528. .team-box .team-assist .member::after
  529. {
  530. display: inline-block;
  531. }
  532. .team-box .team-assist .member::before
  533. {
  534. display: none;
  535. }
  536. /*反向时的显示*/
  537. .reverse-member-assist .team-assist .member::after
  538. {
  539. display: none;
  540. }
  541. .reverse-member-assist .team-assist .member::before
  542. {
  543. display: inline-block;
  544. }
  545. .formation-box .formation-total-info,
  546. .formation-box .team-total-info
  547. {
  548. font-size: 15px;
  549. vertical-align: bottom;
  550. }
  551. .formation-box .team-badge .team-total-info
  552. {
  553. display: inline-block;
  554. }
  555. /*
  556. .team-info .tIf-total-hp,.team-info .tIf-total-rcv{
  557. display:inline-block;
  558. }
  559. */
  560. /*队伍的潜觉*/
  561. .team-latents .latents{
  562. width: var(--head-block-width);
  563. display: inline-block;
  564. vertical-align: top;
  565. }
  566. .team-latents .latent-ul{
  567. font-size: 0;
  568. width: 152px;
  569. transform: scale(0.65);
  570. transform-origin: left top;
  571. margin-left: 5px;
  572. margin-bottom: calc(-64px * (1 - 0.65) + 1px);
  573. /*margin: calc(-64px * (1 - 0.63) / 2 + 3px) calc((108px - 152px) / 2);*/
  574. /*-152 * (1 - 0.63) + 108 - 152 * 0.63,化简为108 - 152*/
  575. min-height: 47px; /* 为了防止只有一层6格大潜觉的时候,被缩减太多的问题*/
  576. }
  577. .team-latents .latent-icon
  578. {
  579. margin-top: 3px;
  580. margin-left: 3px;
  581. margin-right: 3px;
  582. }
  583. .team-latents .latent-icon[data-latent-icon='12'],
  584. .team-latents .latent-icon[data-latent-icon='13'],
  585. .team-latents .latent-icon[data-latent-icon='14'],
  586. .team-latents .latent-icon[data-latent-icon='15'],
  587. .team-latents .latent-icon[data-latent-icon='16'],
  588. .team-latents .latent-icon[data-latent-icon='17'],
  589. .team-latents .latent-icon[data-latent-icon='18'],
  590. .team-latents .latent-icon[data-latent-icon='19'],
  591. .team-latents .latent-icon[data-latent-icon='20'],
  592. .team-latents .latent-icon[data-latent-icon='21'],
  593. .team-latents .latent-icon[data-latent-icon='22'],
  594. .team-latents .latent-icon[data-latent-icon='23'],
  595. .team-latents .latent-icon[data-latent-icon='24'],
  596. .team-latents .latent-icon[data-latent-icon='25'],
  597. .team-latents .latent-icon[data-latent-icon='26'],
  598. .team-latents .latent-icon[data-latent-icon='27'],
  599. .team-latents .latent-icon[data-latent-icon='28'],
  600. .team-latents .latent-icon[data-latent-icon='29'],
  601. .team-latents .latent-icon[data-latent-icon='30'],
  602. .team-latents .latent-icon[data-latent-icon='31'],
  603. .team-latents .latent-icon[data-latent-icon='32'],
  604. .team-latents .latent-icon[data-latent-icon='33'],
  605. .team-latents .latent-icon[data-latent-icon='34'],
  606. .team-latents .latent-icon[data-latent-icon='35'],
  607. .team-latents .latent-icon[data-latent-icon='36'],
  608. .team-latents .latent-icon[data-latent-icon='37'],
  609. .team-latents .latent-icon[data-latent-icon='38'],
  610. .team-latents .latent-icon[data-latent-icon='39']
  611. {
  612. margin-left: 0;
  613. margin-right: 0;
  614. }
  615. .team-latents .latent-ul .latent-icon[data-latent-icon='13']::before,
  616. .team-latents .latent-ul .latent-icon[data-latent-icon='14']::before,
  617. .team-latents .latent-ul .latent-icon[data-latent-icon='15']::before,
  618. .team-latents .latent-ul .latent-icon[data-latent-icon='37']::before,
  619. .team-latents .latent-ul .latent-icon[data-latent-icon='38']::before
  620. { /*6格的潜觉*/
  621. width: 152px;
  622. margin-left: -50px;
  623. margin-right: 47px;
  624. }
  625. .team-latents .latent-ul .latent-icon[data-latent-icon='13'],
  626. .team-latents .latent-ul .latent-icon[data-latent-icon='14'],
  627. .team-latents .latent-ul .latent-icon[data-latent-icon='15'],
  628. .team-latents .latent-ul .latent-icon[data-latent-icon='37'],
  629. .team-latents .latent-ul .latent-icon[data-latent-icon='38']
  630. {
  631. border-radius: 5px 5px 5px 0;
  632. box-shadow: black 1px 1px 1px;
  633. }
  634. .team-latents .latent-icon[data-latent-icon='13']+.latent-icon,
  635. .team-latents .latent-icon[data-latent-icon='14']+.latent-icon,
  636. .team-latents .latent-icon[data-latent-icon='15']+.latent-icon,
  637. .team-latents .latent-icon[data-latent-icon='37']+.latent-icon,
  638. .team-latents .latent-icon[data-latent-icon='38']+.latent-icon
  639. {
  640. width: 76px;
  641. margin-left: 0;
  642. margin-right: 0;
  643. display: inline-block !important;
  644. background: linear-gradient(#2277EE , #1155AA 80%);
  645. border-color: #CCEEFF;
  646. box-shadow: black 1px 1px 1px;
  647. border-radius: 0 0 5px 5px;
  648. border-top: none;
  649. margin-top: 4px;;
  650. transform: translatey(-4px) scaley(1.2);
  651. }
  652. .team-latents .latent-icon[data-latent-icon='13']+.latent-icon::before,
  653. .team-latents .latent-icon[data-latent-icon='14']+.latent-icon::before,
  654. .team-latents .latent-icon[data-latent-icon='15']+.latent-icon::before,
  655. .team-latents .latent-icon[data-latent-icon='37']+.latent-icon::before,
  656. .team-latents .latent-icon[data-latent-icon='38']+.latent-icon::before
  657. {
  658. background: none;
  659. }
  660. /*队长的边框*/
  661. .team-box .team-members .team-leader .monster{
  662. border-radius: 10px;
  663. border-width:4px;
  664. border-style:solid;
  665. box-sizing: initial;
  666. margin: 0;
  667. }
  668. .team-1 .team-members .team-leader .monster{
  669. border-color: var(--team-1-color);
  670. }
  671. .team-2 .team-members .team-leader .monster{
  672. border-color: var(--team-2-color);
  673. }
  674. .team-3 .team-members .team-leader .monster{
  675. border-color: var(--team-3-color);
  676. }
  677. /*三维计算值*/
  678. .team-ability::after,
  679. .team-ability::before,
  680. .team-ability .abilitys
  681. {
  682. padding-left: 5px;
  683. box-sizing: border-box;
  684. font-size: 15px;
  685. width: var(--head-block-width);
  686. }
  687. .team-ability .abilitys
  688. {
  689. display: inline-block;
  690. }
  691. .team-ability::after,
  692. .team-ability::before
  693. {
  694. display: none;
  695. content: "";
  696. }
  697. .show-team-name-left .team-ability::before{
  698. display: inline-block;
  699. }
  700. .show-team-name-right .team-ability::after{
  701. display: inline-block;
  702. }
  703. .abilitys .hp::before,
  704. .abilitys .atk::before,
  705. .abilitys .rcv::before
  706. {
  707. width: 45px;
  708. display: inline-block;
  709. }
  710. /*.abilitys .hp::before{
  711. content: "HP:";
  712. }
  713. .abilitys .atk::before{
  714. content: "攻击:";
  715. }
  716. .abilitys .rcv::before{
  717. content: "回复:";
  718. }*/
  719. /*编辑窗口*/
  720. .blur-bg{
  721. filter:blur(5px);
  722. pointer-events: none;
  723. }
  724. .guide-mod .blur-bg{
  725. filter: unset;
  726. }
  727. .edit-box{
  728. background-color: rgba(82, 53, 30, 0.8);
  729. color: white;
  730. position: absolute;
  731. left:0;
  732. top:0;
  733. width:100%;
  734. box-sizing: border-box;
  735. min-width:664px;
  736. }
  737. .guide-mod .edit-box{
  738. background-color: rgb(102, 73, 50);
  739. padding-bottom: 10px;
  740. }
  741. .edit-box-title{
  742. text-align: center;
  743. font-size: 2em;
  744. font-weight: bold;
  745. }
  746. .guide-mod .edit-box-title,
  747. .guide-mod .button-box
  748. {
  749. display: none;
  750. }
  751. /*.edit-box .edit-box-title::before{
  752. content: "修改队员";
  753. }
  754. .edit-box .edit-box-title.edit-box-title-assist::before{
  755. content: "修改辅助";
  756. }*/
  757. .edit-box .monsterinfo-box{
  758. font-family: var(--game-font-family);
  759. color: white;
  760. text-shadow: black 2px 2px 0;
  761. min-height: 100px;
  762. margin: 5px 0;
  763. background-image: linear-gradient(#798421,#394914);
  764. border-top: #B1BB39 solid 4px;
  765. border-bottom: #72941D ridge 7px;
  766. box-shadow: black 0 3px 3px;
  767. padding: 5px 10px;
  768. }
  769. .edit-box .search-box,
  770. .edit-box .setting-box{
  771. padding: 0 10px;
  772. }
  773. /*.edit-box .setting-box .row-mon-id::before{
  774. content: "▼怪物ID";
  775. }*/
  776. .edit-box .setting-box .row-mon-id .m-id{
  777. box-sizing: border-box;
  778. font-size: 25px;
  779. height: 40px;
  780. width: 100%;
  781. }
  782. .edit-box .setting-box .row-mon-id .unable-monster{
  783. pointer-events: none;
  784. opacity: 0.5;
  785. }
  786. .edit-box .setting-box .row-mon-id .unable-monster .monster{
  787. box-sizing: border-box;
  788. border: 5px solid red;
  789. border-radius: 10px;
  790. overflow: hidden;
  791. }
  792. .edit-box .setting-box .row-mon-id .unable-monster .id{
  793. display: none;
  794. }
  795. .edit-box .setting-box .row-mon-id .search-button{
  796. width: 100%;
  797. height: 40px;
  798. font-size: 25px;
  799. }
  800. .edit-box .setting-box .row-mon-id .evo-card-list li,
  801. .edit-box .search-box .search-mon-list li
  802. {
  803. display: inline-block;
  804. vertical-align: top;
  805. margin: 2px;
  806. }
  807. .detail-mon{
  808. display: inline-block;
  809. vertical-align: bottom;
  810. }
  811. .edit-box .setting-box .row-mon-id .evo-card-list .monster,
  812. .edit-box .search-box .search-mon-list .monster,
  813. .detail-mon .monster
  814. {
  815. float: none;
  816. transform: scale(0.75);
  817. margin: calc(-100px * (1 - 0.75) / 2);
  818. }
  819. .edit-box .setting-box .row-mon-id .evo-card-list .monster .id,
  820. .edit-box .search-box .search-mon-list .monster .id,
  821. .detail-mon .monster .id{
  822. bottom: 5px;
  823. font-size: 20px;
  824. }
  825. .detail-box .detail-mon{
  826. width: 50px;
  827. height: 50px;
  828. }
  829. .detail-box .detail-mon .monster{
  830. transform: scale(0.5);
  831. margin: calc(-100px * (1 - 0.5) / 2);
  832. }
  833. .detail-box .detail-mon .monster .id{
  834. font-weight: bold;
  835. font-size: 23px;
  836. }
  837. .detail-box .detail-mon .monster .id::before {
  838. font-size: 15px;
  839. }
  840. /*搜索结果显示觉醒列表的相关css*/
  841. .awoken-preview .awoken-ul{
  842. width: 75px;
  843. }
  844. .awoken-preview .awoken-preview-superAwakenings{
  845. margin-top:3px;
  846. background-color: #432;
  847. }
  848. .awoken-preview .awoken-preview-superAwakenings .awoken-icon{
  849. opacity: 0.6;
  850. }
  851. .awoken-preview .awoken-ul li{
  852. margin: 0.5px !important;
  853. }
  854. .awoken-preview .awoken-icon{
  855. filter: unset;
  856. transform: scale(0.75);
  857. margin: calc(-32px * (1 - 0.75) / 2);
  858. }
  859. /*.setting-box .row-mon-id .open-search::before{
  860. content: "搜索怪物";
  861. }
  862. .search-box::before{
  863. content: "▼简易搜索";
  864. }
  865. .attrs .attr-all::before{
  866. content: "不限";
  867. }
  868. .attrs .attr-none::before{
  869. content: "无";
  870. }*/
  871. .search-box::before{
  872. font-weight: bold;
  873. font-size: 1.2em;
  874. }
  875. .search-box>div{
  876. margin-bottom: 5px;
  877. }
  878. .search-box>div ul{
  879. display: inline-block;
  880. }
  881. .search-box .attrs ul{
  882. display: block;
  883. }
  884. .search-box>div ul>li{
  885. display: inline-block;
  886. vertical-align: top;
  887. font-size:16px;
  888. overflow: hidden;
  889. }
  890. .search-box>div ul>li>label{
  891. cursor: pointer;
  892. display: block;
  893. text-align: center;
  894. }
  895. .attrs .attr-list-1::before,
  896. .attrs .attr-list-2::before,
  897. .types-div::before,
  898. .awoken-div::before,
  899. .sawoken-div::before{
  900. /*float: left;*/
  901. font-size: 16px;
  902. /*width: 55px;*/
  903. margin-right: 3px;
  904. display: inline-block;
  905. }
  906. /*.search-box .attrs .attr-list-1::before{
  907. content: "属性1";
  908. }
  909. .search-box .attrs .attr-list-2::before{
  910. content: "属性2";
  911. }
  912. .search-box .attrs .fix-main-color-label::after{
  913. content: "限制属性1为主属性,属性2为副属性";
  914. }*/
  915. .attr-radio,.type-check,.sawoken-check{
  916. display: none;
  917. }
  918. .attrs .attr-list{
  919. font-size:0;
  920. }
  921. .attrs .attr-list li{
  922. border: 1px solid white;
  923. border-left: none;
  924. background: #947244;
  925. }
  926. .attrs .attr-list li:hover{
  927. background: #E9CB9E;
  928. }
  929. .attrs .attr-list li:first-of-type{
  930. border-radius: 8px 0 0 8px;
  931. border-left: 1px solid white;
  932. }
  933. .attrs .attr-list li:last-of-type{
  934. border-radius: 0 8px 8px 0;
  935. }
  936. .attrs .attr-list li label{
  937. line-height: 30px;
  938. width: 55px;
  939. height: 30px;
  940. }
  941. .attrs .attr-list input:checked+label{
  942. background-color:#8C4242;
  943. box-shadow: inset black 0 0 5px;
  944. cursor: auto;
  945. }
  946. .attr-list-1{
  947. margin-bottom: 5px;
  948. }
  949. /*.search-box .types-div::before{
  950. content: "类型";
  951. }*/
  952. .types-div .type-list li label{
  953. opacity: var(--search-icon-unchecked);
  954. }
  955. .types-div .type-list input:checked~label{
  956. opacity: 1;
  957. }
  958. .types-div .type-and-or-label{
  959. margin-left: 10px;
  960. margin-right: 0;
  961. }
  962. .types-div .type-list li
  963. {
  964. position: relative;
  965. }
  966. .types-div .type-list li:after
  967. {
  968. content: "⚔️";
  969. font-size: 10px;
  970. position: absolute;
  971. right: 0;
  972. bottom: 0;
  973. display: none;
  974. pointer-events:none;
  975. }
  976. .types-div .type-list.type-killer-5 li[data-type-icon="7"]:after,
  977. .types-div .type-list.type-killer-4 li[data-type-icon="8"]:after,
  978. .types-div .type-list.type-killer-4 li[data-type-icon="3"]:after,
  979. .types-div .type-list.type-killer-7 li[data-type-icon="5"]:after,
  980. .types-div .type-list.type-killer-8 li[data-type-icon="5"]:after,
  981. .types-div .type-list.type-killer-8 li[data-type-icon="1"]:after,
  982. .types-div .type-list.type-killer-1 li[data-type-icon="5"]:after,
  983. .types-div .type-list.type-killer-1 li[data-type-icon="4"]:after,
  984. .types-div .type-list.type-killer-1 li[data-type-icon="7"]:after,
  985. .types-div .type-list.type-killer-1 li[data-type-icon="8"]:after,
  986. .types-div .type-list.type-killer-1 li[data-type-icon="1"]:after,
  987. .types-div .type-list.type-killer-1 li[data-type-icon="6"]:after,
  988. .types-div .type-list.type-killer-1 li[data-type-icon="2"]:after,
  989. .types-div .type-list.type-killer-1 li[data-type-icon="3"]:after,
  990. .types-div .type-list.type-killer-6 li[data-type-icon="7"]:after,
  991. .types-div .type-list.type-killer-6 li[data-type-icon="2"]:after,
  992. .types-div .type-list.type-killer-2 li[data-type-icon="8"]:after,
  993. .types-div .type-list.type-killer-2 li[data-type-icon="3"]:after,
  994. .types-div .type-list.type-killer-3 li[data-type-icon="4"]:after,
  995. .types-div .type-list.type-killer-3 li[data-type-icon="6"]:after
  996. {
  997. display: block;
  998. }
  999. .types-div .latent-list .latent-icon
  1000. {
  1001. cursor: pointer;
  1002. box-shadow: none;
  1003. }
  1004. .types-div .latent-list .latent-icon:before
  1005. {
  1006. margin-left: -23px;
  1007. margin-right: -25px;
  1008. margin-top: -3px;
  1009. margin-bottom: -5px;
  1010. }
  1011. /*.search-box .awoken-div::before{
  1012. content: "觉醒";
  1013. }*/
  1014. .search-box .awoken-div .awoken-clear::before,
  1015. .search-box .sawoken-div .sawoken-clear::before
  1016. {
  1017. content: "❌";
  1018. }
  1019. .search-box .awoken-div .awoken-clear,
  1020. .search-box .sawoken-div .sawoken-clear
  1021. {
  1022. padding: 0;
  1023. float: right;
  1024. }
  1025. .awoken-ul .awoken-count
  1026. {
  1027. font-size: 16px;
  1028. line-height: 32px;
  1029. font-family: var(--game-font-family);
  1030. display: inline-block;
  1031. margin-right: 3px;
  1032. }
  1033. .awoken-ul .count
  1034. {
  1035. height: 32px;
  1036. width: 37px;
  1037. display: inline-block;
  1038. vertical-align: middle;
  1039. }
  1040. .awoken-ul .count::before,
  1041. .search-box .awoken-div .count-symbol::before
  1042. {
  1043. content: "×";
  1044. }
  1045. .search-box .awoken-ul button,
  1046. .search-box .awoken-ul input[type='button']
  1047. {
  1048. border: none;
  1049. background-color: unset;
  1050. font-family: var(--game-font-family);
  1051. color: white;
  1052. line-height: 32px;
  1053. font-size: 16px;
  1054. padding: 0;
  1055. text-align: left;
  1056. }
  1057. .search-box .awoken-ul .awoken-count.zero{
  1058. opacity: var(--search-icon-unchecked);
  1059. }
  1060. .search-box .awoken-ul .count{
  1061. width: 1em;
  1062. height: auto;
  1063. }
  1064. .search-box .awoken-ul .awoken-count .awoken-icon,
  1065. .search-box .awoken-ul .awoken-count .count-symbol,
  1066. .search-box .awoken-ul .awoken-count .count-symbol .count
  1067. {
  1068. cursor: pointer;
  1069. display: inline-block;
  1070. vertical-align: bottom;
  1071. }
  1072. .search-box .awoken-ul .awoken-count.zero .count-symbol,
  1073. .search-box .awoken-ul .awoken-count.zero .count-symbol .count
  1074. {
  1075. cursor: auto;
  1076. }
  1077. /*.search-box .sawoken-div::before{
  1078. content: "超觉醒";
  1079. }*/
  1080. .sawoken-div .sawoken-ul li label{
  1081. opacity: var(--search-icon-unchecked);
  1082. }
  1083. .sawoken-div .sawoken-ul input:checked+label{
  1084. opacity: 1;
  1085. }
  1086. .control-div button{
  1087. font-size: 20px;
  1088. }
  1089. .control-div .search-start{
  1090. float: right;
  1091. margin-left: 5px;
  1092. }
  1093. /*.control-div .search-start::before{
  1094. content: "开始搜索";
  1095. }
  1096. .control-div .search-clear::before{
  1097. content: "清空搜索条件";
  1098. }
  1099. .control-div .search-close::before{
  1100. content: "关闭搜索";
  1101. }*/
  1102. .search-box .search-mon-list{
  1103. border: 1px solid white;
  1104. border-radius: 5px;
  1105. background: grey;
  1106. }
  1107. .guide-mod .search-box .search-mon-list{
  1108. max-height: 790px;
  1109. overflow: auto;
  1110. }
  1111. .search-mon-list.only-display-can-assist .monster,
  1112. .search-mon-list.only-display-can-assist .awoken-preview
  1113. {
  1114. opacity: 0.25;
  1115. }
  1116. .search-mon-list.only-display-can-assist .monster.allowable-assist,
  1117. .search-mon-list.only-display-can-assist .allowable-assist+.awoken-preview
  1118. {
  1119. opacity: 1;
  1120. }
  1121. .setting-box .row-mon-id .open-search{
  1122. float: right;
  1123. }
  1124. .can-assist-label,
  1125. .sort-reverse-label
  1126. {
  1127. margin-left: 5px;
  1128. }
  1129. .edit-box .setting-row{
  1130. width: 100%;
  1131. }
  1132. .monsterinfo-box .monster-head{
  1133. float: left;
  1134. margin-right:5px;
  1135. }
  1136. .monsterinfo-box .monsterinfo-line>div
  1137. {
  1138. display:inline-block;
  1139. vertical-align: top;
  1140. font-size: 22px;
  1141. line-height: 22px;
  1142. }
  1143. .monsterinfo-box .monster-id{
  1144. width:120px;
  1145. }
  1146. .monsterinfo-box .monster-seriesId,
  1147. .monsterinfo-box .monster-collabId,
  1148. .monsterinfo-box .monster-altName
  1149. {
  1150. cursor: pointer;
  1151. font-size: 14px;
  1152. line-height: 16px;
  1153. vertical-align: bottom;
  1154. max-width: 270px;
  1155. white-space:nowrap;
  1156. text-overflow:ellipsis;
  1157. overflow:hidden;
  1158. }
  1159. .monsterinfo-box .monster-seriesId:hover::after,
  1160. .monsterinfo-box .monster-collabId:hover::after,
  1161. .monsterinfo-box .monster-altName:hover::after
  1162. {
  1163. content: "🔍";
  1164. }
  1165. /*.monsterinfo-box .monster-id::before{
  1166. content: "No.";
  1167. }*/
  1168. .monsterinfo-box .monster-rare{
  1169. width: 260px;
  1170. }
  1171. .monsterinfo-box .monster-rare::before,
  1172. .monsterinfo-box .monster-rare::after
  1173. {
  1174. color:gold;
  1175. text-shadow: black 0 0 3px,black 0 2px 3px;
  1176. }
  1177. .monsterinfo-box .monster-rare::before
  1178. {
  1179. display: inline-block;
  1180. width: 30px;
  1181. text-align: right;
  1182. }
  1183. .monster-rare[data-rarity='1']::after{content: "★";}
  1184. .monster-rare[data-rarity='2']::after{content: "★★";}
  1185. .monster-rare[data-rarity='3']::after{content: "★★★";}
  1186. .monster-rare[data-rarity='4']::after{content: "★★★★";}
  1187. .monster-rare[data-rarity='5']::after{content: "★★★★★";}
  1188. .monster-rare[data-rarity='6']::after{content: "★★★★★★";}
  1189. .monster-rare[data-rarity='7']::after{content: "★★★★★★★";}
  1190. .monster-rare[data-rarity='8']::after{content: "★★★★★★★★";}
  1191. .monster-rare[data-rarity='9']::after{content: "★★★★★★★★★";}
  1192. .monster-rare[data-rarity='10']::after{content: "★★★★★★★★★★";}
  1193. .monster-rare[data-rarity='1']::before{content: "1";}
  1194. .monster-rare[data-rarity='2']::before{content: "2";}
  1195. .monster-rare[data-rarity='3']::before{content: "3";}
  1196. .monster-rare[data-rarity='4']::before{content: "4";}
  1197. .monster-rare[data-rarity='5']::before{content: "5";}
  1198. .monster-rare[data-rarity='6']::before{content: "6";}
  1199. .monster-rare[data-rarity='7']::before{content: "7";}
  1200. .monster-rare[data-rarity='8']::before{content: "8";}
  1201. .monster-rare[data-rarity='9']::before{content: "9";}
  1202. .monster-rare[data-rarity='10']::before{content: "10";}
  1203. .monsterinfo-box .monster-mp::before
  1204. {
  1205. content: " ";
  1206. background-image: url(images/icon-MP.png);
  1207. background-size: cover;
  1208. display: inline-block;
  1209. width: 24px;
  1210. height: 24px;
  1211. vertical-align: top;
  1212. }
  1213. .monsterinfo-box .monster-type {
  1214. display: inline;
  1215. }
  1216. .monsterinfo-box .monster-type .type-name{
  1217. display:inline-block;
  1218. margin-right: 10px;
  1219. }
  1220. .monsterinfo-box .monster-type .type-icon{
  1221. margin-right:3px;
  1222. }
  1223. .monsterinfo-box .monster-type .type-name::after{
  1224. vertical-align: middle;
  1225. font-size: 22px;
  1226. line-height: 22px;
  1227. }
  1228. /*
  1229. .edit-box .setting-box .row-mon-awoken::before{
  1230. content: "▼怪物觉醒";
  1231. }
  1232. */
  1233. .row-mon-awoken{
  1234. margin-right: 20px;
  1235. }
  1236. .row-mon-awoken .awoken-ul, .row-mon-super-awoken .awoken-ul{
  1237. font-size: 0;
  1238. height: 32px;
  1239. }
  1240. .edit-box .awoken-ul .awoken-icon,
  1241. .edit-box .awoken-count
  1242. {
  1243. cursor: pointer;
  1244. }
  1245. .row-mon-awoken .awoken-count.full-awoken{
  1246. font-size: 0;
  1247. }
  1248. .row-mon-awoken .awoken-count,
  1249. .row-mon-awoken .awoken-count.full-awoken::before
  1250. {
  1251. font-size: 22px;
  1252. line-height: 28px;
  1253. }
  1254. .row-mon-awoken .awoken-count{
  1255. transform: scale(0.84) translateY(-2px);
  1256. }
  1257. .row-mon-awoken .awoken-count,
  1258. .row-mon-awoken .awoken-icon
  1259. {
  1260. vertical-align: top;
  1261. }
  1262. /*选中的觉醒后面部分半透明,前面的不透明*/
  1263. .row-mon-awoken .awoken-number{display:none;}
  1264. .row-mon-awoken .awoken-number:checked~label
  1265. {
  1266. opacity: var(--search-icon-unchecked);
  1267. }
  1268. /*.edit-box .setting-box .row-mon-super-awoken::before{
  1269. content: "▼超觉醒";
  1270. }*/
  1271. .row-mon-awoken,
  1272. .row-mon-super-awoken
  1273. {
  1274. display: inline-block;
  1275. box-sizing: border-box;
  1276. vertical-align: top;
  1277. }
  1278. .row-mon-awoken .awoken-icon,
  1279. .row-mon-super-awoken .awoken-icon
  1280. {
  1281. margin-right: 5px;
  1282. }
  1283. .row-mon-awoken .awoken-icon:last-of-type,
  1284. .row-mon-super-awoken .awoken-icon:last-of-type
  1285. {
  1286. margin-left: unset;
  1287. }
  1288. /*未选中的超觉醒半透明,选中的不透明*/
  1289. .row-mon-super-awoken .sawoken-choice{display:none;}
  1290. .row-mon-super-awoken .sawoken-choice+label
  1291. {
  1292. opacity: var(--search-icon-unchecked);
  1293. }
  1294. .row-mon-super-awoken .sawoken-choice:checked+label
  1295. {
  1296. opacity: unset;
  1297. }
  1298. /*怪物能力横条*/
  1299. /*.row-ability{
  1300. border-color: #D5AF5B;
  1301. border-style: solid;
  1302. border-width: var(--border-width);
  1303. border-radius: 8px;
  1304. background-color: #B68E4A;
  1305. background-image: radial-gradient(ellipse at top,#B68E4A, #60492C);
  1306. }*/
  1307. /*.edit-box .setting-box .row-mon-ability::before{
  1308. content: "▼怪物能力";
  1309. }*/
  1310. .row-mon-ability ul{
  1311. margin-top: var(--border-width);
  1312. }
  1313. .row-mon-ability ul li::before{
  1314. width: 55px;
  1315. display: inline-block;
  1316. }
  1317. .row-mon-ability .ability-value{
  1318. width: 85px;
  1319. display: inline-block;
  1320. text-align: right;
  1321. }
  1322. .edit-box .setting-box .row-mon-plus::before{
  1323. /*content: "▼怪物加值";*/
  1324. display:block;
  1325. }
  1326. .row-mon-ability ul,
  1327. .row-mon-plus ul,
  1328. .row-mon-level .level-value,
  1329. .row-mon-level .monster-cost
  1330. {
  1331. font-family: var(--game-font-family );
  1332. font-size: 22px;
  1333. line-height: 35px;
  1334. text-shadow: black 2px 2px 0;
  1335. }
  1336. .row-mon-level .monster-cost
  1337. {
  1338. background-color: #2F2B28;
  1339. border: solid 3px #563E22;
  1340. border-radius: 12px;
  1341. padding: 0 5px;
  1342. font-size: 0.8em;
  1343. box-shadow: inset 0 3px 3px black;
  1344. }
  1345. .row-mon-plus .plus-box{
  1346. border-color: #A07740;
  1347. border-style: solid;
  1348. border-width: var(--border-width);
  1349. border-radius: 8px;
  1350. background-color: #44392C;
  1351. box-shadow: inset black 0 3px 5px;
  1352. white-space: nowrap; /*避免纵向297跑到下一行*/
  1353. }
  1354. .row-mon-plus li{
  1355. height: 35px;
  1356. padding: 0 5px;
  1357. }
  1358. /*.m-plus-hp-li::before{content: "HP";}
  1359. .m-plus-atk-li::before{content: "攻击";}
  1360. .m-plus-rcv-li::before{content: "回复";}*/
  1361. .row-mon-plus .plus-value{
  1362. color: yellow;
  1363. }
  1364. .row-mon-plus .plus-value::before{content: "(+";}
  1365. .row-mon-plus .plus-value::after{content: ")";}
  1366. .row-mon-plus .plus-value input
  1367. {
  1368. color: inherit;
  1369. font-family: inherit;
  1370. font-size: inherit;
  1371. text-shadow: inherit;
  1372. box-sizing: border-box;
  1373. width: 2em;
  1374. line-height: 30px;
  1375. height: 30px;
  1376. padding: 0;
  1377. -moz-appearance: textfield; /*火狐去掉数字加减*/
  1378. }
  1379. /*webkit去掉数字加减*/
  1380. .row-mon-plus .plus-value input::-webkit-outer-spin-button,
  1381. .row-mon-plus .plus-value input::-webkit-inner-spin-button{
  1382. -webkit-appearance: none !important;
  1383. margin: 0;
  1384. }
  1385. .row-mon-plus .m-plus-btn::before,
  1386. .row-mon-plus .m-plus-btn-297 span::before
  1387. {
  1388. content: "+";
  1389. }
  1390. .row-mon-plus .m-plus-btn
  1391. {
  1392. padding: 0 3px;
  1393. box-sizing: border-box;
  1394. font-size: inherit;
  1395. line-height: 20px;;
  1396. height: 30px;
  1397. }
  1398. .m-plus-btn-297{
  1399. padding: 0;
  1400. box-sizing: border-box;
  1401. height: 105px;
  1402. font-size: 22px;
  1403. writing-mode: vertical-lr;
  1404. min-width: 32px; /*先给297一个默认宽度*/
  1405. }
  1406. .m-plus-btn-297 span{
  1407. /*Chrome浏览器不支持按钮本身的纵向,只能加一层*/
  1408. -webkit-writing-mode: vertical-lr;
  1409. }
  1410. .row-mon-plus .plus-box ul,
  1411. .m-plus-btn-297
  1412. {
  1413. display: inline-block;
  1414. vertical-align: top;
  1415. }
  1416. /*.edit-box .setting-box .row-mon-level::before{
  1417. content: "▼怪物等级";
  1418. }*/
  1419. .row-mon-level
  1420. {
  1421. margin-left: 10px;
  1422. }
  1423. .row-mon-level .subrow
  1424. {
  1425. font-family: var(--game-font-family );
  1426. font-size: 22px;
  1427. line-height: 35px;
  1428. }
  1429. /*.row-mon-level .level-value::before{
  1430. content: "Lv.";
  1431. }*/
  1432. .edit-box .setting-box .m-level
  1433. {
  1434. color: inherit;
  1435. font-family: inherit;
  1436. font-size: inherit;
  1437. text-shadow: inherit;
  1438. box-sizing: border-box;
  1439. line-height: inherit;
  1440. width: 100px;
  1441. height: 40px;
  1442. }
  1443. .m-level-btn-min,
  1444. .m-level-btn-max,
  1445. .m-level-btn-110
  1446. {
  1447. box-sizing: border-box;
  1448. font-size: 18px;
  1449. padding: 0 3px;
  1450. }
  1451. .m-level-btn-110
  1452. {
  1453. color: blue;
  1454. }
  1455. /*
  1456. .m-level-exp::before{
  1457. content: "需要经验:";
  1458. }
  1459. .m-level-btn-max::before{
  1460. content: "最高Lv";
  1461. }
  1462. */
  1463. .row-mon-ability,
  1464. .row-mon-plus,
  1465. .row-mon-level
  1466. {
  1467. display: inline-block;
  1468. box-sizing: border-box;
  1469. vertical-align: top;
  1470. }
  1471. .m-level,
  1472. .m-plus-hp,.m-plus-atk,.m-plus-rcv,
  1473. .m-skill-level
  1474. {
  1475. border: 1px solid grey;
  1476. background: none;
  1477. }
  1478. /*.edit-box .setting-box .row-mon-latent::before{
  1479. content: "▼潜在觉醒";
  1480. }*/
  1481. .m-latent-ul-div{
  1482. text-align: center;
  1483. }
  1484. .m-latent-ul{
  1485. font-size: 0;
  1486. display: inline-block;
  1487. background: rgba(88,75,56,154);
  1488. border: 2px ridge #94733f;
  1489. border-radius: 7px;
  1490. padding: 2px;
  1491. }
  1492. .guide-mod .m-latent-ul-div,
  1493. .guide-mod .m-latent-allowable-ul
  1494. {
  1495. display: inline-block;
  1496. }
  1497. .m-latent-ul .latent-icon{
  1498. margin-left: 12px;
  1499. }
  1500. .m-latent-ul .latent-icon:first-of-type{
  1501. margin-left: 0;
  1502. }
  1503. .m-latent-allowable-ul{
  1504. margin-top: 5px;
  1505. font-size: 0;
  1506. }
  1507. .m-latent-allowable-ul .latent-icon{
  1508. margin-right: 4px;
  1509. margin-bottom: 4px;
  1510. }
  1511. .m-latent-allowable-ul .latent-icon:last-of-type{
  1512. margin-right: unset;
  1513. }
  1514. .m-latent-allowable-ul.hide-less-use-latent .latent-icon{
  1515. display: none;
  1516. }
  1517. .m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="11"],
  1518. .m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="20"],
  1519. .m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="21"],
  1520. .m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="22"],
  1521. .m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="23"],
  1522. .m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="24"],
  1523. .m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="25"],
  1524. .m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="26"],
  1525. .m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="27"]
  1526. {
  1527. display: inline-block;
  1528. }
  1529. .guide-mod .m-latent-allowable-ul.hide-less-use-latent .latent-icon[data-latent-icon="11"]{
  1530. display: none;
  1531. }
  1532. .hide-less-use-latent-label{
  1533. margin-left: 5px;
  1534. }
  1535. /*没有打觉醒的空格,没有手指*/
  1536. .m-latent-ul .latent-icon{
  1537. cursor: default;
  1538. }
  1539. .m-latent-allowable-ul .latent-icon,
  1540. .m-latent-ul .latent-icon[data-latent-icon]{
  1541. cursor: pointer;
  1542. }
  1543. /*不允许使用的潜觉,不是手指,半透明,灰度*/
  1544. .m-latent-allowable-ul .latent-icon.unallowable-latent{
  1545. cursor: default;
  1546. opacity: var(--search-icon-unchecked);
  1547. filter: grayscale(100%);
  1548. }
  1549. .edit-box .setting-box .row-mon-skill
  1550. {
  1551. margin-bottom:5px;
  1552. }
  1553. /*.edit-box .setting-box .row-mon-skill,
  1554. .edit-box .setting-box .row-mon-leader-skill
  1555. {
  1556. margin-top:5px;
  1557. }*/
  1558. /*.skill-box .skill-cd::before{
  1559. content: "冷却回合:";
  1560. }
  1561. .skill-box .skill-level-label::before{
  1562. content: "Lv";
  1563. }
  1564. .skill-box .m-skill-lv-1::before{
  1565. content: "Lv";
  1566. }
  1567. .skill-box .m-skill-lv-max::before{
  1568. content: "最高Lv";
  1569. }*/
  1570. .skill-box{
  1571. font-family: var(--game-font-family);
  1572. font-size: 16px;
  1573. border: #9C743E solid 2px;
  1574. border-radius: 10px;
  1575. background-color: #B1AAA0;
  1576. overflow: hidden;
  1577. box-shadow: inset black 0 0 5px;
  1578. }
  1579. .row-mon-leader-skill .skill-box{
  1580. background-color: #D0CD81;
  1581. }
  1582. .skill-box .m-skill-level {
  1583. height: 30px;
  1584. width: 3em;
  1585. line-height: 25px;
  1586. box-sizing: border-box;
  1587. font-size: inherit;
  1588. font-family: inherit;
  1589. color: inherit;
  1590. text-shadow: inherit;
  1591. }
  1592. .skill-box .m-skill-lv-1,
  1593. .skill-box .m-skill-lv-max{
  1594. padding: 0 3px;
  1595. /*height: 30px;*/
  1596. box-sizing: border-box;
  1597. font-size: 18px;
  1598. }
  1599. .skill-box .skill-title{
  1600. background-color: #39180F;
  1601. box-shadow: inset black 0 5px 5px;
  1602. padding: 0 10px 0 2px;
  1603. text-shadow:black 3px 3px 0;
  1604. }
  1605. .skill-title .type-title{
  1606. background-color: #774433;
  1607. border: #BBAA55 solid 2px;
  1608. border-radius: 8px;
  1609. margin-right: 5px;
  1610. padding: 0 5px;
  1611. line-height: 24px;
  1612. display: inline-block;
  1613. position: relative;
  1614. }
  1615. .skill-title .type-title::after{
  1616. -webkit-background-clip: text;
  1617. background-clip: text;
  1618. color: transparent;
  1619. text-shadow: none;
  1620. position: absolute;
  1621. left: 5px;
  1622. }
  1623. .skill-title .type-title::before{
  1624. text-shadow: none;
  1625. -webkit-text-stroke: 3px black;
  1626. text-stroke: 3px black;
  1627. }
  1628. /*.row-mon-skill .type-title::before,
  1629. .row-mon-skill .type-title::after
  1630. {
  1631. content: "主動技能";
  1632. }*/
  1633. .row-mon-skill .type-title::after
  1634. {
  1635. background-image: linear-gradient(white 25%, #3377AA 80%);
  1636. }
  1637. /*.row-mon-leader-skill .type-title::before,
  1638. .row-mon-leader-skill .type-title::after
  1639. {
  1640. content: "隊長技能";
  1641. }*/
  1642. .row-mon-leader-skill .type-title::after
  1643. {
  1644. background-image: linear-gradient(#FFFF99 25%, #EE7744 80%);
  1645. }
  1646. .row-mon-skill .skill-title .skill-name{
  1647. color: #84BAFC;
  1648. cursor: pointer;
  1649. }
  1650. .row-mon-skill .skill-title .skill-name:hover::after{
  1651. content: "🔍";
  1652. }
  1653. .row-mon-leader-skill .skill-title .skill-name{
  1654. color: #85FD80;
  1655. }
  1656. .skill-box .skill-cd-control{
  1657. float: right;
  1658. }
  1659. .skill-box .skill-cd{
  1660. margin-left: 10px;
  1661. }
  1662. .skill-datail{
  1663. color: black;
  1664. padding: 0 8px 6px 8px;
  1665. line-height: 25px;
  1666. }
  1667. .skill-datail .spColor{
  1668. color: #ff3600;
  1669. }
  1670. .skill-datail .detail-search{
  1671. cursor: pointer;
  1672. color: blue;
  1673. }
  1674. .skill-datail .detail-search::before{
  1675. content: "🔍";
  1676. }
  1677. .skill-datail .random-active-skill{
  1678. padding-left: 1em;
  1679. }
  1680. .skill-datail .random-active-skill>.active-skill-li{
  1681. list-style: decimal;
  1682. }
  1683. .edit-box .button-box{
  1684. border-top: black solid 3px;
  1685. background-color: rgba(0,0,0,0.5);
  1686. margin-top: 10px;
  1687. padding: 5px;
  1688. height: 50px;
  1689. }
  1690. .edit-box .button-box .button-null,
  1691. .edit-box .button-box .button-delay,
  1692. .edit-box .button-box .button-cancel,
  1693. .edit-box .button-box .button-done{
  1694. height: 50px;
  1695. box-sizing: border-box;
  1696. font-size: 25px;
  1697. font-weight: bold;
  1698. }
  1699. .edit-box .button-box .button-null,
  1700. .edit-box .button-box .button-delay{
  1701. float: left;
  1702. margin-right:5px;
  1703. }
  1704. .edit-box .button-box .button-cancel,
  1705. .edit-box .button-box .button-done{
  1706. float: right;
  1707. margin-left:5px;
  1708. }
  1709. /*.edit-box .button-box .button-null::after{
  1710. content: "留空格子";
  1711. }
  1712. .edit-box .button-box .button-delay::after{
  1713. content: "应对威吓";
  1714. }
  1715. .edit-box .button-box .button-cancel::after{
  1716. content: "取消修改";
  1717. }
  1718. .edit-box .button-box .button-done::after{
  1719. content: "确认修改";
  1720. }
  1721. .edit-box .button-box .button-done.cant-assist::after{
  1722. content: "不能辅助";
  1723. }*/
  1724. .formation-awoken::before,
  1725. .team-awoken::before
  1726. {
  1727. font-size: 20px;
  1728. margin-top:5px;
  1729. /*content: "觉醒总计:";*/
  1730. }
  1731. .detail-box{
  1732. margin-top:5px;
  1733. }
  1734. /*控制框*/
  1735. .control-box{
  1736. margin-bottom: 10px;
  1737. }
  1738. .control-box .languages-label::before{
  1739. content: "Lanuage:";
  1740. }
  1741. .control-box .solo-link::before{
  1742. content: "Jump To Solo Version";
  1743. }
  1744. .control-box .multi-link::before{
  1745. content: "Jump To 2-Player Version";
  1746. }
  1747. /*.control-box .btn-show-mon-id::before{
  1748. content: "隐藏怪物ID";
  1749. }
  1750. .not-show-mon-id .control-box .btn-show-mon-skill-cd::before{
  1751. content: "显示怪物ID";
  1752. }
  1753. .show-mon-skill-cd .control-box .btn-show-mon-skill-cd::before{
  1754. content: "⬜隐藏已满技能CD";
  1755. }
  1756. .control-box .btn-show-mon-skill-cd::before{
  1757. content: "❄️显示已满技能CD";
  1758. }
  1759. */
  1760. #interchange-line{
  1761. pointer-events: none;
  1762. position: absolute;
  1763. left: 0;
  1764. top: 0;
  1765. }
  1766. #interchange-line g line {
  1767. fill: none;
  1768. stroke: blue;
  1769. stroke-linecap: round;
  1770. stroke-width: 5;
  1771. stroke-dasharray: 10;
  1772. }

智龙迷城队伍图制作工具