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 25 kB

7 years ago
7 years ago
7 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
7 years ago
7 years ago
7 years ago
7 years ago
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125
  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. font-family: "Microsoft Yahei","Source Han Sans",Arial, Helvetica, sans-serif, "Malgun Gothic", "맑은 고딕", "Gulim", AppleGothic;
  22. --search-icon-unchecked: 0.4;
  23. }
  24. .display-none{
  25. display:none !important;
  26. }
  27. .disabled{
  28. cursor: not-allowed;
  29. pointer-events: none;
  30. opacity: 0.5;
  31. }
  32. .help-link::before{
  33. content: "Help & Tips";
  34. }
  35. .title{
  36. font-size: 2em;
  37. font-weight: bold;
  38. }
  39. .detail{
  40. min-height: 100px;
  41. font-size: 1.5em;
  42. font-family: "Microsoft Yahei","Source Han Sans",Arial, Helvetica, sans-serif, "Malgun Gothic", "맑은 고딕", "Gulim", AppleGothic;
  43. }
  44. .title,.detail{
  45. width:100%;
  46. border: none;
  47. background: none;
  48. box-sizing: border-box;
  49. padding: 1px;
  50. }
  51. .title:focus,.detail:focus{
  52. border: black solid 1px;;
  53. background-color: #eee;
  54. padding: 0;
  55. }
  56. .status{
  57. line-height: 16px;
  58. }
  59. /*.status.loading-mon-info .text::before{
  60. content: "正在加载怪物数据";
  61. }*/
  62. .status.loading-mon-info .icon,
  63. .status.loading-skill-info .icon{
  64. display: inline-block;
  65. width: 16px;
  66. height: 16px;
  67. border: 4px SteelBlue dotted;
  68. border-radius: 50%;
  69. animation: loading-animate 50s infinite linear;
  70. vertical-align: middle;
  71. }
  72. ul{
  73. margin: 0;
  74. padding: 0;
  75. list-style: none;
  76. }
  77. /*队伍的整个盒子*/
  78. .formation-box{
  79. width: 648px;
  80. min-width: 648px;
  81. }
  82. /*单个怪物*/
  83. .monster{
  84. font-family: 'FOT-KurokaneStd-EB',"Microsoft Yahei","Source Han Sans",Arial, Helvetica, sans-serif, "Malgun Gothic", "맑은 고딕", "Gulim", AppleGothic;
  85. width: 100px;
  86. height: 100px;
  87. margin: 0;
  88. display: block;
  89. background-repeat: no-repeat;
  90. position: relative;
  91. cursor: pointer;
  92. border-radius: 5px;
  93. }
  94. .null .monster,.delay .monster,
  95. .null .property,.delay .property,
  96. .null .subproperty,.delay .subproperty
  97. {
  98. box-sizing: border-box;
  99. background-image: none !important;
  100. }
  101. .null .monster{
  102. background-color: rgba(230,230,230,0.5);
  103. border: 3px grey dashed;
  104. }
  105. .edit-box .null .monster{
  106. background-color: #653;
  107. border: none;
  108. box-shadow: inset black 0 0 7px;
  109. }
  110. .delay .monster{
  111. background-color: yellow;
  112. box-shadow: inset orange 0 0 7px;
  113. border: 3px black solid;
  114. }
  115. .delay .monster::before{
  116. display: block;
  117. width: 94px;
  118. height: 94px;
  119. color: black;
  120. font-size: 30px;
  121. line-height: 47px;
  122. text-align: center;
  123. font-weight: bold;
  124. /*content: "应 对\A威 吓";*/
  125. font-family: "Microsoft Yahei","Source Han Sans",Arial, Helvetica, sans-serif, "Malgun Gothic", "맑은 고딕", "Gulim", AppleGothic;
  126. white-space: pre-wrap;
  127. display: inline-block;
  128. }
  129. /*怪物属性*/
  130. .property,.subproperty{
  131. position:absolute;
  132. left:0;top:0;
  133. width: 100px;
  134. height: 100px;
  135. background-repeat: no-repeat;
  136. background-image: url(images/CARDFRAME2.PNG);
  137. background-position: 100px 100px; /*默认都不显示*/
  138. }
  139. /*怪物-加值*/
  140. .monster .plus{
  141. color: yellow;
  142. font-size: 17px;
  143. line-height: 17px;
  144. text-shadow: black 0 0 1px,black 0 0 2px, black 2px 2px 0;
  145. position: absolute;
  146. left:10px;
  147. }
  148. .null .monster>div,.delay .monster>div{
  149. display:none !important;
  150. }
  151. .monster .plus .hp::before,
  152. .monster .plus .atk::before,
  153. .monster .plus .rcv::before,
  154. .monster .plus ._297::before{
  155. content: "+";
  156. }
  157. .monster .plus ._297{ /*297默认不显示*/
  158. display:none;
  159. }
  160. .monster .plus.has297 .hp,.monster .plus.zero .hp,
  161. .monster .plus.has297 .atk,.monster .plus.zero .atk,
  162. .monster .plus.has297 .rcv,.monster .plus.zero .rcv{ /*当是297时隐藏3维*/
  163. display:none;
  164. }
  165. .monster .plus.has297 ._297{ /*当是297时显示297*/
  166. display:block;
  167. }
  168. /*怪物-觉醒*/
  169. .monster .awoken-count{
  170. color: yellow;
  171. text-shadow: black 0 0 4px;
  172. text-align: center;
  173. background-image: url(images/awoken-count-bg.png);
  174. background-repeat: no-repeat;
  175. width: 34px;
  176. height: 38px;
  177. position: absolute;
  178. top: -4px;
  179. right: 0;
  180. transform: scale(0.75) translateX(4px);
  181. }
  182. .monster .awoken-count,
  183. .monster .awoken-count.full-awoken::before{
  184. font-size: 20px;
  185. line-height: 28px;
  186. }
  187. .monster .awoken-count.full-awoken{
  188. font-size: 0;
  189. }
  190. .monster .awoken-count.full-awoken::before{
  191. content: "★";
  192. }
  193. .monster .awoken-count.allowable-assist.full-awoken::before{
  194. content: none;
  195. }
  196. .monster .awoken-count.allowable-assist{
  197. font-size: 0;
  198. text-shadow: none;
  199. background-position: 0 -38px;
  200. }
  201. /*怪物-超觉醒*/
  202. .monster .super-awoken{
  203. position: absolute;
  204. right:0;
  205. top: 25px;
  206. transform: scale(0.75) translateX(4px);
  207. }
  208. /*怪物-等级*/
  209. .monster .level{
  210. color: white;
  211. height: 17px;
  212. text-shadow: black 0 0 2px, black 2px 2px 0;
  213. position: absolute;
  214. left: 5px;
  215. bottom: 0;
  216. vertical-align: top;
  217. }
  218. .monster .level,.monster .level.max::before{
  219. font-size: 15px;
  220. line-height: 17px;
  221. }
  222. .monster .level.max{
  223. font-size: 0;
  224. }
  225. .monster .level._110{
  226. color: lightskyblue;
  227. }
  228. /*.monster .level::before{
  229. content: "Lv.";
  230. }.monster .level.max::before{
  231. content: "Lv.最大";
  232. }*/
  233. .monster .id{
  234. display: block;
  235. color: white;
  236. font-family: "Microsoft Yahei","Source Han Sans",Arial, Helvetica, sans-serif, "Malgun Gothic", "맑은 고딕", "Gulim", AppleGothic;
  237. font-size: 15px;
  238. line-height: 17px;
  239. height: 17px;
  240. text-shadow: black 0px 0px 2px,black -1px -1px 1px,black 1px 1px 1px;
  241. position: absolute;
  242. left: 5px;
  243. bottom: 15px;
  244. }
  245. .not-show-mon-id .monster .id{
  246. display: none;
  247. }
  248. .monster .id::before{
  249. font-size: 12px;
  250. }
  251. /*.monster .id::before{
  252. content: "No.";
  253. }*/
  254. .monster .skill::before{
  255. content:"CD";
  256. font-size: 10px;
  257. }
  258. .monster .skill{
  259. font-size: 13px;
  260. line-height: 13px;
  261. color:white;
  262. text-shadow: black 0 0 1px,black 0 0 2px, black 2px 2px 0;
  263. position: absolute;
  264. right:0;
  265. bottom:0;
  266. }
  267. .monster .skill.max-skill{
  268. display: none;
  269. }
  270. .show-mon-skill-cd .monster .skill.max-skill{
  271. display: block;
  272. }
  273. /*辅助和队伍的每一只框架*/
  274. .member, .acquisitus-awoken-icon{
  275. display: block;
  276. float: left;
  277. position: relative;
  278. width: 108px;
  279. }
  280. .formation-box .monster{
  281. margin: 4px; /*留给队长边框的*/
  282. }
  283. .formation-assist, .formation-team,.formation-badge{
  284. display: inline-block;
  285. }
  286. /*队伍的背景色*/
  287. .formation-A-box .formation-team,.formation-A-box .formation-latents{
  288. background-color:pink;
  289. }
  290. .formation-B-box .formation-team,.formation-B-box .formation-latents{
  291. background-color:lightblue;
  292. }
  293. .formation-A-bigbox, .formation-B-bigbox{
  294. position: relative;
  295. font-size:0;
  296. }
  297. .formation-B-bigbox{
  298. margin-top:15px;
  299. }
  300. /*队伍A、B的文字*/
  301. .formation-A-bigbox::after, .formation-B-bigbox::before{
  302. font-size: 30px;
  303. font-weight: bold;
  304. text-align: center;
  305. line-height: 50px;
  306. white-space: pre-wrap;
  307. display: inline-block;
  308. width: 108px;
  309. height: 108px;
  310. }
  311. .formation-A-bigbox::after{
  312. color:red;
  313. background-color:pink;
  314. /*content: "队伍\A A";*/
  315. }
  316. .formation-B-bigbox::before{
  317. color:blue;
  318. background-color:lightblue;
  319. /*content: "队伍\A B";*/
  320. vertical-align:top;
  321. }
  322. .formation-A-box, .formation-B-box{
  323. display: inline-block;
  324. vertical-align:bottom;
  325. }
  326. .formation-A-box .formation-assist .member::after, .formation-B-box .formation-assist .member::before{
  327. width: 108px;
  328. text-align: center;
  329. font-size: 18px;
  330. font-weight: bold;
  331. display: inline-block;
  332. position: relative;
  333. }
  334. .formation-A-box .formation-assist .member::after{
  335. color:red;
  336. /*content: "▼辅助";*/
  337. }
  338. .formation-B-box .formation-assist .member::before{
  339. color:blue;
  340. /*content: "▲辅助";*/
  341. }
  342. .formation-box .team-info{
  343. font-size: 15px;
  344. }
  345. .team-info .tIf-total-hp,.team-info .tIf-total-rcv{
  346. display:inline-block;
  347. }
  348. /*队伍的潜觉*/
  349. .formation-latents .latents{
  350. width: 108px;
  351. /*float:left;*/
  352. margin-bottom: -20px;
  353. display: inline-block;
  354. }
  355. .formation-latents .latent-ul{
  356. font-size: 0;
  357. width: 152px;
  358. transform: translate(-22px,-8px) scale(0.63);
  359. }
  360. .formation-latents .latent-icon{
  361. margin-left: 3px;
  362. margin-right: 3px;
  363. }
  364. .formation-latents .latent-icon-12,
  365. .formation-latents .latent-icon-13,
  366. .formation-latents .latent-icon-14,
  367. .formation-latents .latent-icon-15,
  368. .formation-latents .latent-icon-16,
  369. .formation-latents .latent-icon-17,
  370. .formation-latents .latent-icon-18,
  371. .formation-latents .latent-icon-19,
  372. .formation-latents .latent-icon-20,
  373. .formation-latents .latent-icon-21,
  374. .formation-latents .latent-icon-22,
  375. .formation-latents .latent-icon-23,
  376. .formation-latents .latent-icon-24,
  377. .formation-latents .latent-icon-25,
  378. .formation-latents .latent-icon-26,
  379. .formation-latents .latent-icon-27,
  380. .formation-latents .latent-icon-28,
  381. .formation-latents .latent-icon-29,
  382. .formation-latents .latent-icon-30,
  383. .formation-latents .latent-icon-31,
  384. .formation-latents .latent-icon-32,
  385. .formation-latents .latent-icon-33{
  386. margin: 0;
  387. }
  388. /*队长的边框*/
  389. .formation-A-box .formation-team .team-leader .monster, .formation-B-box .formation-team .team-leader .monster{
  390. border-radius: 10px;
  391. border-width:4px;
  392. border-style:solid;
  393. box-sizing: initial;
  394. margin: 0;
  395. }
  396. .formation-A-box .formation-team .team-leader .monster{
  397. border-color: red;
  398. }
  399. .formation-B-box .formation-team .team-leader .monster{
  400. border-color: blue;
  401. }
  402. /*三维计算值*/
  403. .formation-ability .abilitys{
  404. padding-left: 5px;
  405. box-sizing: border-box;
  406. font-size: 15px;
  407. width: 108px;
  408. display: inline-block;
  409. }
  410. .abilitys .hp::before,.abilitys .atk::before,.abilitys .rcv::before{
  411. width: 45px;
  412. display: inline-block;
  413. }
  414. /*.abilitys .hp::before{
  415. content: "HP:";
  416. }
  417. .abilitys .atk::before{
  418. content: "攻击:";
  419. }
  420. .abilitys .rcv::before{
  421. content: "回复:";
  422. }*/
  423. /*编辑窗口*/
  424. .blur-bg{
  425. filter:blur(5px);
  426. pointer-events: none;
  427. }
  428. .edit-box{
  429. background-color: rgba(82, 53, 30, 0.8);
  430. color: white;
  431. position: absolute;
  432. left:0;
  433. top:0;
  434. width:100%;
  435. box-sizing: border-box;
  436. min-width:664px;
  437. }
  438. .edit-box-title{
  439. text-align: center;
  440. font-size: 2em;
  441. font-weight: bold;
  442. }
  443. /*.edit-box .edit-box-title::before{
  444. content: "修改队员";
  445. }
  446. .edit-box .edit-box-title.edit-box-title-assist::before{
  447. content: "修改辅助";
  448. }*/
  449. .edit-box .monsterinfo-box{
  450. font-family: 'FOT-KurokaneStd-EB', "Malgun Gothic", "맑은 고딕", "Gulim", AppleGothic;
  451. color: white;
  452. text-shadow: black 2px 2px 0;
  453. height: 100px;
  454. margin: 5px 0;
  455. background-image: linear-gradient(#798421,#394914);
  456. border-top: #B1BB39 solid 4px;
  457. border-bottom: #72941D ridge 7px;
  458. box-shadow: black 0 3px 3px;
  459. padding: 5px 10px;
  460. }
  461. .edit-box .search-box,
  462. .edit-box .setting-box{
  463. padding: 0 10px;
  464. }
  465. /*.edit-box .setting-box .row-mon-id::before{
  466. content: "▼怪物ID";
  467. }*/
  468. .edit-box .setting-box .row-mon-id .m-id{
  469. box-sizing: border-box;
  470. font-size: 25px;
  471. height: 40px;
  472. width: 100%;
  473. }
  474. .edit-box .setting-box .row-mon-id .unable-monster{
  475. pointer-events: none;
  476. opacity: 0.5;
  477. }
  478. .edit-box .setting-box .row-mon-id .unable-monster .monster{
  479. box-sizing: border-box;
  480. border: 5px solid red;
  481. border-radius: 10px;
  482. overflow: hidden;
  483. }
  484. .edit-box .setting-box .row-mon-id .unable-monster .id{
  485. display: none;
  486. }
  487. .edit-box .setting-box .row-mon-id .search-button{
  488. width: 100%;
  489. height: 40px;
  490. font-size: 25px;
  491. }
  492. .edit-box .setting-box .row-mon-id .evo-card-list li,
  493. .edit-box .search-box .search-mon-list li,
  494. .edit-box .setting-box .skill-box .detail-mon{
  495. display: inline-block;
  496. vertical-align: top;
  497. top: 0;
  498. width: 78px;
  499. height: 80px;
  500. }
  501. .edit-box .setting-box .skill-box .detail-mon{
  502. vertical-align: bottom;
  503. }
  504. .edit-box .setting-box .row-mon-id .evo-card-list .monster,
  505. .edit-box .search-box .search-mon-list .monster,
  506. .edit-box .setting-box .skill-box .detail-mon .monster{
  507. float: none;
  508. transform: scale(0.75) translate(-13px,-13px);
  509. }
  510. .edit-box .setting-box .row-mon-id .evo-card-list .monster .id,
  511. .edit-box .search-box .search-mon-list .monster .id,
  512. .edit-box .setting-box .skill-box .detail-mon .monster .id{
  513. bottom: 5px;
  514. font-size: 20px;
  515. }
  516. /*.setting-box .row-mon-id .open-search::before{
  517. content: "搜索怪物";
  518. }
  519. .search-box::before{
  520. content: "▼简易搜索";
  521. }
  522. .attrs .attr-all::before{
  523. content: "不限";
  524. }
  525. .attrs .attr-none::before{
  526. content: "无";
  527. }*/
  528. .search-box>div{
  529. margin-bottom: 5px;
  530. }
  531. .search-box>div ul{
  532. display: inline-block;
  533. }
  534. .search-box .attrs ul{
  535. display: block;
  536. }
  537. .search-box>div ul>li{
  538. display: inline-block;
  539. vertical-align: top;
  540. font-size:16px;
  541. overflow: hidden;
  542. }
  543. .search-box>div ul>li>label{
  544. cursor: pointer;
  545. display: block;
  546. text-align: center;
  547. }
  548. .attrs .attr-list-1::before,
  549. .attrs .attr-list-2::before,
  550. .types-div::before,
  551. .awoken-div::before,
  552. .sawoken-div::before{
  553. /*float: left;*/
  554. font-size: 16px;
  555. /*width: 55px;*/
  556. margin-right: 3px;
  557. display: inline-block;
  558. }
  559. /*.search-box .attrs .attr-list-1::before{
  560. content: "属性1";
  561. }
  562. .search-box .attrs .attr-list-2::before{
  563. content: "属性2";
  564. }
  565. .search-box .attrs .fix-main-color-label::after{
  566. content: "限制属性1为主属性,属性2为副属性";
  567. }*/
  568. .attr-radio,.type-check,.sawoken-check{
  569. display: none;
  570. }
  571. .attrs .attr-list{
  572. font-size:0;
  573. }
  574. .attrs .attr-list li{
  575. border: 1px solid white;
  576. border-left: none;
  577. background: #947244;
  578. }
  579. .attrs .attr-list li:hover{
  580. background: #E9CB9E;
  581. }
  582. .attrs .attr-list li:first-of-type{
  583. border-radius: 8px 0 0 8px;
  584. border-left: 1px solid white;
  585. }
  586. .attrs .attr-list li:last-of-type{
  587. border-radius: 0 8px 8px 0;
  588. }
  589. .attrs .attr-list li label{
  590. line-height: 30px;
  591. width: 55px;
  592. height: 30px;
  593. }
  594. .attrs .attr-list input:checked~label{
  595. background-color:#8C4242;
  596. box-shadow: inset black 0 0 5px;
  597. cursor: auto;
  598. }
  599. .attr-list-1{
  600. margin-bottom: 5px;
  601. }
  602. /*.search-box .types-div::before{
  603. content: "类型";
  604. }*/
  605. .types-div .type-list li label{
  606. opacity: var(--search-icon-unchecked);
  607. }
  608. .types-div .type-list input:checked~label{
  609. opacity: 1;
  610. }
  611. /*.search-box .awoken-div::before{
  612. content: "觉醒";
  613. }*/
  614. .search-box .awoken-div .awoken-clear::before,
  615. .search-box .sawoken-div .sawoken-clear::before
  616. {
  617. content: "❌";
  618. }
  619. .search-box .awoken-div .awoken-clear,
  620. .search-box .sawoken-div .sawoken-clear
  621. {
  622. padding: 0;
  623. float: right;
  624. }
  625. .search-box .awoken-list button{
  626. border: none;
  627. background-color: unset;
  628. font-family: 'FOT-KurokaneStd-EB', "Malgun Gothic", "맑은 고딕", "Gulim", AppleGothic;
  629. color: white;
  630. line-height: 32px;
  631. font-size: 16px;
  632. padding: 0;
  633. }
  634. .search-box .awoken-list .awoken-count.zero{
  635. opacity: var(--search-icon-unchecked);
  636. }
  637. .search-box .awoken-list .count{
  638. width: 30px;
  639. }
  640. .search-box .awoken-list .awoken-count .awoken-icon{
  641. cursor: pointer;
  642. }
  643. .search-box .awoken-list .awoken-count .count{
  644. cursor: pointer;
  645. }
  646. .search-box .awoken-list .awoken-count.zero .count{
  647. cursor: auto;
  648. }
  649. /*.search-box .sawoken-div::before{
  650. content: "超觉醒";
  651. }*/
  652. .sawoken-div .sawoken-list li label{
  653. opacity: var(--search-icon-unchecked);
  654. }
  655. .sawoken-div .sawoken-list input:checked~label{
  656. opacity: 1;
  657. }
  658. .control-div button{
  659. font-size: 20px;
  660. }
  661. .control-div .search-start{
  662. float: right;
  663. margin-left: 5px;
  664. }
  665. /*.control-div .search-start::before{
  666. content: "开始搜索";
  667. }
  668. .control-div .search-clear::before{
  669. content: "清空搜索条件";
  670. }
  671. .control-div .search-close::before{
  672. content: "关闭搜索";
  673. }*/
  674. .search-box .search-mon-list{
  675. border: 1px solid white;
  676. border-radius: 5px;
  677. background: grey;
  678. }
  679. .setting-box .row-mon-id .open-search{
  680. float: right;
  681. }
  682. .edit-box .setting-row{
  683. width: 100%;
  684. }
  685. .monsterinfo-box .monster-head{
  686. float: left;
  687. margin-right:5px;
  688. }
  689. .monsterinfo-box .monsterinfo-line>div,
  690. .monsterinfo-box .monsterinfo-line>ul
  691. {
  692. display:inline-block;
  693. vertical-align: top;
  694. font-size: 22px;
  695. line-height: 22px;
  696. }
  697. .monsterinfo-box .monster-id{
  698. width:150px;
  699. }
  700. .monsterinfo-box .monster-collabId,
  701. .monsterinfo-box .monster-altName{
  702. cursor: pointer;
  703. font-size: 14px;
  704. line-height: 16px;
  705. vertical-align: bottom;
  706. max-width: 270px;
  707. white-space:nowrap;
  708. text-overflow:ellipsis;
  709. overflow:hidden;
  710. }
  711. /*.monsterinfo-box .monster-id::before{
  712. content: "No.";
  713. }*/
  714. .monsterinfo-box .monster-rare{
  715. width: 230px;
  716. }
  717. .monsterinfo-box .monster-rare::before{
  718. color:gold;
  719. text-shadow: black 0 0 3px,black 0 2px 3px;
  720. }
  721. .rare-1::before{content: "★";}
  722. .rare-2::before{content: "★★";}
  723. .rare-3::before{content: "★★★";}
  724. .rare-4::before{content: "★★★★";}
  725. .rare-5::before{content: "★★★★★";}
  726. .rare-6::before{content: "★★★★★★";}
  727. .rare-7::before{content: "★★★★★★★";}
  728. .rare-8::before{content: "★★★★★★★★";}
  729. .rare-9::before{content: "★★★★★★★★★";}
  730. .rare-10::before{content: "★★★★★★★★★★";}
  731. .monsterinfo-box .monster-type{
  732. font-size: 0;
  733. }
  734. .monsterinfo-box .monster-type .type-name{
  735. display:inline-block;
  736. margin-right: 10px;
  737. }
  738. .monsterinfo-box .monster-type .type-icon{
  739. margin-right:3px;
  740. }
  741. .monsterinfo-box .monster-type .type-name::after{
  742. vertical-align: middle;
  743. font-size: 22px;
  744. line-height: 22px;
  745. }
  746. .edit-box .setting-box .row-mon-level::before{
  747. /*content: "▼怪物等级";*/
  748. display: block;
  749. }
  750. .edit-box .setting-box .m-level{
  751. font-size: 25px;
  752. height: 40px;
  753. width: calc(100% - 220px);
  754. box-sizing: border-box;
  755. }
  756. .m-level-btn-min,.m-level-btn-max{
  757. height: 40px;
  758. box-sizing: border-box;
  759. font-size: 25px;
  760. padding: 0;
  761. }
  762. .m-level-btn-min{
  763. width: 65px;
  764. }
  765. .m-level-btn-max{
  766. width: 145px;
  767. }
  768. /*.m-level-btn-max::before{
  769. content: "最高Lv";
  770. }
  771. .edit-box .setting-box .row-mon-awoken::before{
  772. content: "▼怪物觉醒";
  773. }*/
  774. .row-mon-awoken .awoken-ul, .row-mon-super-awoken .awoken-ul{
  775. font-size: 0;
  776. height: 32px;
  777. }
  778. .awoken-ul li{
  779. margin-right: 5px;
  780. }
  781. .awoken-ul li:last-of-type{
  782. margin-right: 0;
  783. }
  784. .edit-box .awoken-ul .awoken-icon{
  785. cursor: pointer;
  786. }
  787. .awoken-ul .awoken-icon.unselected-awoken{
  788. opacity: var(--search-icon-unchecked);
  789. }
  790. .row-mon-awoken .awoken-icon.awoken-count,
  791. .row-mon-awoken .awoken-icon.awoken-count.full-awoken::before
  792. {
  793. color: yellow;
  794. font-size: 22px;
  795. line-height: 28px;
  796. font-weight: bold;
  797. text-shadow: black 0 0 4px;
  798. text-align: center;
  799. }
  800. .row-mon-awoken .awoken-icon.awoken-count.full-awoken{
  801. font-size: 0;
  802. }
  803. .row-mon-awoken .awoken-icon.awoken-count.full-awoken::before{
  804. content: "★";
  805. }
  806. .row-mon-awoken .m-super-awoken-ul{
  807. margin-top: 5px;
  808. }
  809. /*.edit-box .setting-box .row-mon-super-awoken::before{
  810. content: "▼超觉醒";
  811. }*/
  812. .edit-box .setting-box .row-mon-plus::before{
  813. /*content: "▼怪物加值";*/
  814. display: block;
  815. }
  816. .row-mon-plus .ability-value::before{content: "(";}
  817. .row-mon-plus .ability-value::after{content: ")";}
  818. .setting-box .m-plus-hp,.setting-box .m-plus-atk,.setting-box .m-plus-rcv{
  819. font-size: 25px;
  820. height: 40px;
  821. width: calc(100% - 288px);
  822. box-sizing: border-box;
  823. }
  824. .m-plus-hp-li::before,.m-plus-atk-li::before,.m-plus-rcv-li::before,.row-mon-plus .ability-value{
  825. font-size: 25px;
  826. width: 55px;
  827. display: inline-block;
  828. }
  829. .row-mon-plus .ability-value{
  830. width: 90px;
  831. }
  832. /*.m-plus-hp-li::before{content: "HP";}
  833. .m-plus-atk-li::before{content: "攻击";}
  834. .m-plus-rcv-li::before{content: "回复";}*/
  835. .m-plus-btn{
  836. height: 40px;
  837. width: 55px;
  838. box-sizing: border-box;
  839. font-size: 25px;
  840. }
  841. .m-plus-btn::before,.m-plus-btn-297::before{
  842. content: "+";
  843. }
  844. .m-plus-btn-297{
  845. float:right;
  846. width: 85px;
  847. height: 120px;
  848. box-sizing: border-box;
  849. font-size: 25px;
  850. }
  851. /*.edit-box .setting-box .row-mon-latent::before{
  852. content: "▼潜在觉醒";
  853. }*/
  854. .m-latent-ul{
  855. text-align: center;
  856. font-size: 0;
  857. }
  858. .m-latent-ul .latent-icon{
  859. margin-left: 12px;
  860. }
  861. .m-latent-ul .latent-icon:first-of-type{
  862. margin-left: 0;
  863. }
  864. .m-latent-allowable-ul{
  865. margin-top: 5px;
  866. }
  867. .m-latent-allowable-ul .latent-icon,
  868. .m-latent-ul .latent-icon-1,
  869. .m-latent-ul .latent-icon-2,
  870. .m-latent-ul .latent-icon-3,
  871. .m-latent-ul .latent-icon-4,
  872. .m-latent-ul .latent-icon-5,
  873. .m-latent-ul .latent-icon-6,
  874. .m-latent-ul .latent-icon-7,
  875. .m-latent-ul .latent-icon-8,
  876. .m-latent-ul .latent-icon-9,
  877. .m-latent-ul .latent-icon-10,
  878. .m-latent-ul .latent-icon-11,
  879. .m-latent-ul .latent-icon-12,
  880. .m-latent-ul .latent-icon-13,
  881. .m-latent-ul .latent-icon-14,
  882. .m-latent-ul .latent-icon-15,
  883. .m-latent-ul .latent-icon-16,
  884. .m-latent-ul .latent-icon-17,
  885. .m-latent-ul .latent-icon-18,
  886. .m-latent-ul .latent-icon-19,
  887. .m-latent-ul .latent-icon-20,
  888. .m-latent-ul .latent-icon-21,
  889. .m-latent-ul .latent-icon-22,
  890. .m-latent-ul .latent-icon-23,
  891. .m-latent-ul .latent-icon-24{
  892. cursor: pointer;
  893. }
  894. .m-latent-allowable-ul .latent-icon.unselected-latent{
  895. cursor: default;
  896. opacity: var(--search-icon-unchecked);
  897. }
  898. .edit-box .setting-box .row-mon-skill,
  899. .edit-box .setting-box .row-mon-leader-skill{
  900. margin-top:5px;
  901. }
  902. /*.skill-box .skill-cd::before{
  903. content: "冷却回合:";
  904. }
  905. .skill-box .skill-level-label::before{
  906. content: "Lv";
  907. }
  908. .skill-box .m-skill-lv-1::before{
  909. content: "Lv";
  910. }
  911. .skill-box .m-skill-lv-max::before{
  912. content: "最高Lv";
  913. }*/
  914. .skill-box .m-skill-level {
  915. height: 30px;
  916. width: 45px;
  917. box-sizing: border-box;
  918. border: none;
  919. background: none;
  920. font-size: inherit;
  921. font-family: inherit;
  922. color: inherit;
  923. text-shadow: inherit;
  924. }
  925. .skill-box .m-skill-lv-1,
  926. .skill-box .m-skill-lv-max{
  927. padding: 0 3px;
  928. height: 30px;
  929. box-sizing: border-box;
  930. font-size: 18px;
  931. }
  932. .skill-box{
  933. font-family: 'FOT-KurokaneStd-EB', "Malgun Gothic", "맑은 고딕", "Gulim", AppleGothic;
  934. font-size: 20px;
  935. border: #9C743E solid 2px;
  936. border-radius: 10px;
  937. background-color: #B1AAA0;
  938. overflow: hidden;
  939. box-shadow: inset black 0 0 5px;
  940. }
  941. .skill-title{
  942. background-color: #39180F;
  943. box-shadow: inset black 0 5px 5px;
  944. padding: 0 10px 0 5px;
  945. text-shadow:black 3px 3px 0;
  946. }
  947. .skill-title::before{
  948. background-color: #774433;
  949. border: #BBAA55 solid 2px;
  950. border-radius: 10px;
  951. margin-right: 5px;
  952. padding: 0 5px;
  953. text-shadow:black 0 0 3px;
  954. line-height: 25px;
  955. display: inline-block;
  956. }
  957. .row-mon-skill .skill-title::before{
  958. /*content: "主動技能";*/
  959. color: #DDEEEE;
  960. }
  961. .row-mon-skill .skill-title .skill-name{
  962. color: #84BAFC;
  963. }
  964. .row-mon-leader-skill .skill-title::before{
  965. /*content: "隊長技能";*/
  966. color: #FF9955;
  967. }
  968. .row-mon-leader-skill .skill-title .skill-name{
  969. color: #85FD80;
  970. }
  971. .skill-box .skill-cd-control{
  972. float: right;
  973. }
  974. .skill-box .skill-cd{
  975. margin-left: 10px;
  976. }
  977. .skill-datail{
  978. color: black;
  979. padding: 0 8px 6px 8px;
  980. line-height: 25px;
  981. }
  982. .skill-datail .spColor{
  983. color: #ff3600;
  984. }
  985. .skill-datail .detail-search{
  986. cursor: pointer;
  987. color: blue;
  988. }
  989. .skill-datail .detail-search::before{
  990. content: "🔍";
  991. }
  992. .skill-datail .random-active-skill{
  993. padding-left: 1em;
  994. }
  995. .skill-datail .random-active-skill>.active-skill-li{
  996. list-style: decimal;
  997. }
  998. .edit-box .button-box{
  999. border-top: black solid 3px;
  1000. background-color: rgba(0,0,0,0.5);
  1001. margin-top: 10px;
  1002. padding: 5px;
  1003. height: 50px;
  1004. }
  1005. .edit-box .button-box .button-null,
  1006. .edit-box .button-box .button-delay,
  1007. .edit-box .button-box .button-cancel,
  1008. .edit-box .button-box .button-done{
  1009. height: 50px;
  1010. box-sizing: border-box;
  1011. font-size: 25px;
  1012. font-weight: bold;
  1013. }
  1014. .edit-box .button-box .button-null,
  1015. .edit-box .button-box .button-delay{
  1016. float: left;
  1017. margin-right:5px;
  1018. }
  1019. .edit-box .button-box .button-cancel,
  1020. .edit-box .button-box .button-done{
  1021. float: right;
  1022. margin-left:5px;
  1023. }
  1024. /*.edit-box .button-box .button-null::after{
  1025. content: "留空格子";
  1026. }
  1027. .edit-box .button-box .button-delay::after{
  1028. content: "应对威吓";
  1029. }
  1030. .edit-box .button-box .button-cancel::after{
  1031. content: "取消修改";
  1032. }
  1033. .edit-box .button-box .button-done::after{
  1034. content: "确认修改";
  1035. }
  1036. .edit-box .button-box .button-done.cant-assist::after{
  1037. content: "不能辅助";
  1038. }*/
  1039. .awoken-total-box::before{
  1040. font-size: 20px;
  1041. margin-top:5px;
  1042. /*content: "觉醒总计:";*/
  1043. }
  1044. .detail-box{
  1045. margin-top:5px;
  1046. }
  1047. .awoken-total-box .awoken-ul .awoken-count,
  1048. .search-box .awoken-list .awoken-count{
  1049. font-size: 16px;
  1050. line-height: 32px;
  1051. font-family: 'FOT-KurokaneStd-EB',"Malgun Gothic", "맑은 고딕", "Gulim", AppleGothic;
  1052. float: left;
  1053. margin-right: 3px;
  1054. }
  1055. .awoken-total-box .awoken-ul .count,
  1056. .search-box .awoken-list .count{
  1057. height: 32px;
  1058. width: 37px;
  1059. display: inline-block;
  1060. vertical-align: middle;
  1061. }
  1062. .awoken-total-box .awoken-ul .count::before,
  1063. .search-box .awoken-list .count::before{
  1064. content: "×";
  1065. }
  1066. /*控制框*/
  1067. .control-box{
  1068. margin-bottom: 10px;
  1069. }
  1070. .control-box .languages-label::before{
  1071. content: "Lanuage:";
  1072. }
  1073. .control-box .solo-link::before{
  1074. content: "Jump To Solo Version";
  1075. }
  1076. .control-box .multi-link::before{
  1077. content: "Jump To 2-Player Version";
  1078. }
  1079. .control-box .btn-show-mon-id{
  1080. margin-left: 5px;
  1081. }
  1082. /*.control-box .btn-show-mon-id::before{
  1083. content: "隐藏怪物ID";
  1084. }
  1085. .not-show-mon-id .control-box .btn-show-mon-skill-cd::before{
  1086. content: "显示怪物ID";
  1087. }
  1088. .show-mon-skill-cd .control-box .btn-show-mon-skill-cd::before{
  1089. content: "⬜隐藏已满技能CD";
  1090. }
  1091. .control-box .btn-show-mon-skill-cd::before{
  1092. content: "❄️显示已满技能CD";
  1093. }
  1094. */
  1095. #interchange-line{
  1096. pointer-events: none;
  1097. position: absolute;
  1098. left: 0;
  1099. top: 0;
  1100. }
  1101. #interchange-line g line {
  1102. fill: none;
  1103. stroke: blue;
  1104. stroke-linecap: round;
  1105. stroke-width: 5;
  1106. stroke-dasharray: 10;
  1107. }

智龙迷城队伍图制作工具