@charset "UTF-8"; .damage { padding-top: 0.8em; overflow: hidden; position: relative; /* 伤害统计 */ /* 乘区数据 */ /* buff统计 */ /* 差异计算 */ } .damage .uid { font-size: 0.6em; text-align: center; position: absolute; border-image-source: url("./images/CurseBG08.png"); border-image-slice: 30 60 30 60 fill; border-image-width: 0.5em 1em 0.5em 1em; border-image-outset: 0em 0em 0em 0em; border-image-repeat: stretch stretch; padding: 0.5em 1.2em; font-size: 1em; top: 0.5em; left: 0.5em; color: rgb(255, 255, 255); stroke: 0.05em rgba(0, 0, 0, 0.6); -webkit-text-stroke: 0.05em rgba(0, 0, 0, 0.6); z-index: 1; } .damage .star { width: 5.5em; height: 1.5em; } .damage .star.star0 { background-size: cover; background-repeat: no-repeat; background-position: center; background-image: url("./images/star/0.png"); } .damage .star.star1 { background-size: cover; background-repeat: no-repeat; background-position: center; background-image: url("./images/star/1.png"); } .damage .star.star2 { background-size: cover; background-repeat: no-repeat; background-position: center; background-image: url("./images/star/2.png"); } .damage .star.star3 { background-size: cover; background-repeat: no-repeat; background-position: center; background-image: url("./images/star/3.png"); } .damage .star.star4 { background-size: cover; background-repeat: no-repeat; background-position: center; background-image: url("./images/star/4.png"); } .damage .star.star5 { background-size: cover; background-repeat: no-repeat; background-position: center; background-image: url("./images/star/5.png"); } .damage .basic { display: flex; align-items: stretch; overflow: hidden; } .damage .basic .char { width: 55%; position: relative; flex-grow: 1; } .damage .basic .char .avatar { height: 100%; padding-top: 1em; overflow: hidden; } .damage .basic .char .avatar img { width: 100%; height: 100%; object-fit: cover; object-position: top center; position: absolute; } .damage .basic .char .skills { position: absolute; width: 120%; height: 3.5em; background: url("./images/skill_bg.png"); background-size: contain; background-repeat: no-repeat; background-position: center; bottom: 3em; right: -1.6em; display: flex; align-items: flex-end; padding-left: 2.5em; padding-bottom: 0.2em; } .damage .basic .char .skills .skill { width: 1.4em; aspect-ratio: 1; margin-right: 1.38em; display: flex; justify-content: center; align-items: center; } .damage .basic .info { width: 45%; flex-grow: 0; flex-shrink: 0; font-size: 1.2em; position: relative; z-index: 2; } .damage .basic .info .char_info { width: 140%; position: relative; right: 20%; padding: 0.3em 0.2em; padding-right: 20%; padding-left: 8%; border-image-slice: 0 30 0 40 fill; border-image-width: 0em 1.5em 0em 2em; border-image-outset: 0 0 0 0; border-image-repeat: stretch stretch; border-image-source: url("./images/CurseBG04.png"); filter: drop-shadow(0 0 0.1em rgb(0, 0, 0)); } .damage .basic .info .char_info .base { display: flex; align-items: center; gap: 0.2em; overflow: hidden; } .damage .basic .info .char_info .base .rank { width: 1.2em; flex-grow: 0; flex-shrink: 0; } .damage .basic .info .char_info .base .property { width: 1em; flex-grow: 0; flex-shrink: 0; } .damage .basic .info .char_info .base .name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .damage .basic .info .char_info .addition { display: flex; align-items: center; font-size: 0.7em; gap: 0.2em; padding-left: 1em; } .damage .basic .info .char_info .addition .level { background-color: #000; padding: 0em 0.7em; border-radius: 1em; } .damage .basic .info .char_info .addition .role_ranks { display: flex; gap: 0.1em; } .damage .basic .info .char_info .addition .role_ranks span { width: 1.2em; aspect-ratio: 1; border-radius: 1em; background-size: contain; background-repeat: no-repeat; background-position: center; opacity: 0.4; } .damage .basic .info .char_info .addition .role_ranks span:nth-child(1) { background-image: url("./images/ranks/1.png"); } .damage .basic .info .char_info .addition .role_ranks.r1 span:nth-child(1) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks span:nth-child(2) { background-image: url("./images/ranks/2.png"); } .damage .basic .info .char_info .addition .role_ranks.r2 span:nth-child(1) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks.r2 span:nth-child(2) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks span:nth-child(3) { background-image: url("./images/ranks/3.png"); } .damage .basic .info .char_info .addition .role_ranks.r3 span:nth-child(1) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks.r3 span:nth-child(2) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks.r3 span:nth-child(3) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks span:nth-child(4) { background-image: url("./images/ranks/4.png"); } .damage .basic .info .char_info .addition .role_ranks.r4 span:nth-child(1) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks.r4 span:nth-child(2) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks.r4 span:nth-child(3) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks.r4 span:nth-child(4) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks span:nth-child(5) { background-image: url("./images/ranks/5.png"); } .damage .basic .info .char_info .addition .role_ranks.r5 span:nth-child(1) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks.r5 span:nth-child(2) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks.r5 span:nth-child(3) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks.r5 span:nth-child(4) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks.r5 span:nth-child(5) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks span:nth-child(6) { background-image: url("./images/ranks/6.png"); } .damage .basic .info .char_info .addition .role_ranks.r6 span:nth-child(1) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks.r6 span:nth-child(2) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks.r6 span:nth-child(3) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks.r6 span:nth-child(4) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks.r6 span:nth-child(5) { opacity: 1 !important; } .damage .basic .info .char_info .addition .role_ranks.r6 span:nth-child(6) { opacity: 1 !important; } .damage .basic .info .property_info { background-color: rgb(47, 47, 47); border-left: 0.1em solid rgb(0, 0, 0); padding-top: 0.2em; background: url("./images/BgFrame01.png") center/150% no-repeat; } .damage .basic .info .property_info .title { font-size: 0.6em; } .damage .basic .info .property_info .title .special-title { margin-bottom: 0; padding-bottom: 0; } .damage .basic .info .property_info .list { display: flex; flex-direction: column; gap: 0.2em; padding-bottom: 0.2em; } .damage .basic .info .property_info .list .properties { display: flex; align-items: center; gap: 0.4em; padding: 0.05em 1em 0em 0.05em; } .damage .basic .info .property_info .list .properties:nth-child(odd) { background-color: rgba(221, 224, 221, 0.25); } .damage .basic .info .property_info .list .properties .prop-icon { width: 1em; flex-grow: 0; flex-shrink: 0; margin: 0 0.4em; } .damage .basic .info .property_info .list .properties .label { flex-grow: 1; flex-shrink: 1; font-size: 0.65em; color: rgb(166, 166, 166); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .damage .basic .info .property_info .list .properties .label.yellow { color: rgb(247, 199, 54); } .damage .basic .info .property_info .list .properties .label.blue { color: rgb(65, 147, 237); } .damage .basic .info .property_info .list .properties .label.white { color: rgb(233, 233, 233); } .damage .basic .info .property_info .list .properties .value { flex-grow: 0; flex-shrink: 0; font-size: 0.8em; } .damage .basic .info .weapon_info { border-image-slice: 118 0 68 43 fill; border-image-width: 4.5em 0em 2.7em 1.7em; border-image-outset: 0em 0em 0em 0em; border-image-repeat: stretch stretch; border-image-source: url("./images/weapon_bg.png"); margin-top: -0.8em; width: 115%; margin-left: -15%; font-size: 0.8em; padding: 2em 1.2em; padding-bottom: 3em; position: relative; overflow: hidden; } .damage .basic .info .weapon_info .info { width: 100%; position: relative; z-index: 2; } .damage .basic .info .weapon_info .info .base { width: 100%; display: flex; align-items: center; gap: 0.5em; } .damage .basic .info .weapon_info .info .base .rarity-icon { width: 2em; } .damage .basic .info .weapon_info .info .base .name { text-shadow: 0 0 0.2em rgb(0, 0, 0); } .damage .basic .info .weapon_info .info .main { display: flex; flex-direction: column; justify-content: stretch; width: max-content; } .damage .basic .info .weapon_info .info .main .addition { font-size: 0.8em; display: flex; align-items: center; gap: 0.4em; } .damage .basic .info .weapon_info .info .main .addition .level { -webkit-clip-path: polygon(0.2em 0%, calc(100% - 0.2em) 0%, 100% 0.2em, 100% calc(100% - 0.2em), calc(100% - 0.2em) 100%, 0.2em 100%, 0% calc(100% - 0.2em), 0% 0.2em); clip-path: polygon(0.2em 0%, calc(100% - 0.2em) 0%, 100% 0.2em, 100% calc(100% - 0.2em), calc(100% - 0.2em) 100%, 0.2em 100%, 0% calc(100% - 0.2em), 0% 0.2em); padding: 0 0.4em; font-size: 0.9em; display: flex; justify-content: center; align-items: center; color: rgb(43, 38, 40); margin: 0.1em 0; background-color: rgb(243, 203, 69); } .damage .basic .info .weapon_info .info .main .properties { display: flex; align-items: center; background-color: rgb(65, 147, 237); gap: 0.2em; padding: 0 0.5em; border-radius: 1em; margin: 0.2em 0; } .damage .basic .info .weapon_info .info .main .properties.sub { background-color: rgb(0, 0, 0); } .damage .basic .info .weapon_info .info .main .properties .prop-icon { width: 1em; flex-grow: 0; flex-shrink: 0; } .damage .basic .info .weapon_info .info .main .properties .label { flex-grow: 1; flex-shrink: 1; font-size: 0.7em; color: rgb(222, 222, 222); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .damage .basic .info .weapon_info .icon { position: absolute; top: 1.2em; right: 0; z-index: 1; height: 70%; margin-right: -1em; } .damage .basic .info .weapon_info .icon img { height: 100%; } .damage .damage-data { border-image-source: url("./images/BgFrame01.png"); border-image-slice: 200 100 70 280 fill; border-image-width: 2em 1em 0.7em 2.8em; border-image-outset: 2em 1em 0.7em 2.8em; border-image-repeat: stretch stretch; padding-bottom: 3.3em; margin-top: -1.4em; position: relative; z-index: 5; } .damage .title:nth-child(n+2) { padding-top: 0.5em; } .damage .data-list { margin: 0 1.2em; text-align: center; backdrop-filter: blur(0.2em); border-radius: 0.5em; overflow: hidden; box-shadow: 0 0 3em rgba(0, 0, 0, 0.6); border: 0.1em solid rgba(255, 255, 255, 0.3); } .damage .data-list .tr { display: grid; border-bottom: 0.1em solid rgba(255, 255, 255, 0.3); } .damage .data-list .tr:first-child { font-size: 1.1em; background: rgba(0, 0, 0, 0.2); text-shadow: 0 0 0.2em rgba(0, 0, 0, 0.6); color: rgb(206, 190, 149); } .damage .data-list .tr:last-child { border-bottom: none; } .damage .data-list .tr:nth-child(even) { background-color: rgba(255, 255, 255, 0.12); } .damage .data-list .td { padding: 0.5em 0.5em; font-size: 0.9em; border-right: 0.1em solid rgba(255, 255, 255, 0.3); } .damage .data-list .td:last-child { border-right: none; } .damage .data-list .info-tr { font-size: 0.8em !important; display: grid !important; grid-template-columns: 1fr !important; padding: 0.3em !important; color: #bbb !important; } .damage .data-list .info-tr span { color: #fff !important; } .damage .damage-list .dmg-tr { grid-template-columns: 0.25fr 1.6fr 1fr 1fr; } .damage .damage-list .dmg-tr.current { background: rgb(120, 104, 73); } .damage .damage-list .dmg-tr.current .dmg-td:nth-child(2) { color: rgb(251, 198, 65) !important; font-weight: bold !important; } .damage .damage-list .dmg-td:nth-child(2) { background: rgba(0, 0, 0, 0.2); color: rgb(206, 190, 149); } .damage .area-list .area-tr { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; } .damage .area-list .area-tr:nth-child(odd) { font-size: 1.1em; background: rgba(0, 0, 0, 0.2); text-shadow: 0 0 0.2em rgba(0, 0, 0, 0.6); color: rgb(206, 190, 149); } .damage .area-list .area-tr.anomaly { grid-template-columns: 1fr 1fr 1fr; } .damage .buff-list .buff-tr { grid-template-columns: 0.7fr 5fr 3fr 2fr; } .damage .buff-list .buff-td:nth-child(2) { background: rgba(0, 0, 0, 0.2); color: rgb(206, 190, 149); } .damage .difference-list .difference-tr.d2 { grid-template-columns: repeat(3, 1fr); } .damage .difference-list .difference-tr.d3 { grid-template-columns: repeat(4, 1fr); } .damage .difference-list .difference-tr.d4 { grid-template-columns: repeat(5, 1fr); } .damage .difference-list .difference-tr.d5 { grid-template-columns: repeat(6, 1fr); } .damage .difference-list .difference-tr.d6 { grid-template-columns: repeat(7, 1fr); } .damage .difference-list .difference-tr.d7 { grid-template-columns: repeat(8, 1fr); } .damage .difference-list .difference-tr.d8 { grid-template-columns: repeat(9, 1fr); } .damage .difference-list .difference-tr.d9 { grid-template-columns: repeat(10, 1fr); } .damage .difference-list .difference-td { display: flex; flex-direction: column; justify-content: center; align-items: center; } .damage .difference-list .difference-td span { font-size: 0.8em; color: #bbb; } .damage .difference-list .difference-td.zero { background-color: #222; } .damage .difference-list .difference-td:first-child { background: rgba(0, 0, 0, 0.2); color: rgb(206, 190, 149); } .damage .difference-list .difference-td.positive { background-color: rgb(82, 38, 32); } .damage .difference-list .difference-td.negative { background-color: rgb(22, 65, 33); } .copyright { margin-top: -3.3em; position: relative; z-index: 5; } /*# sourceMappingURL=damage.css.map */