Miao-Yunzai/plugins/genshin/resources/StarRail/html/ledger/ledger.css

310 lines
10 KiB
CSS
Raw Normal View History

2023-08-18 10:19:48 +08:00
@font-face {
font-family: "HYWenHei-55W";
src: url("../../../../../../resources/font/HYWenHei-55W.ttf");
font-weight: normal;
font-style: normal;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
user-select: none;
font-family: HYWenHei-55W;
font-weight: bold;
}
body {
font-size: 18px;
color: #1e1f20;
font-family: PingFangSC-Medium, PingFang SC, sans-serif;
transform: scale(1.5);
transform-origin: 0 0;
width: 1200px;
}
.container {
width: 1200px;
height: 1835px;
background-color: #f5f6fb;
background-image: url("../../img/note/bg.png");
}
.uid {
border-radius: 0 25px 25px 0px;
display: flex;
width: 670px;
height: 200px;
justify-content: center;
flex-direction: column;
margin-top: 195px;
margin-left: 50px;
background-image: url('../../img/note/uidbg.png');
}
.uid_item {
/* background-color: #302b25; */
color: #fff;
margin-left: 50px;
align-items: center;
justify-content: left;
display: flex;
padding: 8px 10px;
font-size: 45px;
height: 100px;
border-radius: 0 12px 0 0px;
font-family: MiSans-Demibold;
}
.uid_span {
text-indent: 1em;
font-size: 48px;
display: flex;
}
.uid_name {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-width: 10em;
}
.day_span {
text-indent: 1em;
font-size: 48px;
display: flex;
margin-left: -30px;
}
.uid_item:nth-child(2) {
/* background-color: #595045; */
border-radius: 0 0 12px 0px;
font-size: 40px;
font-family: MiSans-Medium;
}
.uid_text {
width: 150px;
text-align: right;
}
.title {
display: flex;
position: relative;
}
.title_date {
width: 370px;
height: 470px;
2023-08-18 10:19:48 +08:00
position: absolute;
right: 83px;
top: 27px;
padding: 10px;
transform: rotate(4deg);
background-color: #fff;
border-bottom: 10px solid #b47f4c;
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
}
.icon {
width: 350px;
height: 350px;
}
.title_date_text {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
font-size: 36px;
color: #808080;
height: 100px;
2023-08-18 10:19:48 +08:00
}
img {
width: 100%;
height: 100%;
}
.subject {
width: 1000px;
margin: 0 auto;
margin-top: 60px;
height: 400px;
background-color: #e5e5e5;
padding-left: 60px;
}
.subject_note {
font-size: 24px;
margin-top: 49px;
padding-top: 24px;
color: #000000;
}
.subject_note span:nth-child(1) {
font-size: 82px;
color: #b47f4c;
}
.subject_solid {
display: flex;
width: 880px;
border-radius: 10px;
background-color: #a1a1a1;
height: 20px;
margin-top: 44px;
margin-bottom: 20px;
}
.subject_solid span {
background-color: #b47f4c;
width: 50%;
border-radius: 10px;
}
.data-box {
display: flex;
margin-bottom: 30px;
}
.data-box .head {
margin-bottom: 6px;
font-weight: 700;
font-size: 48px;
}
.month .primogems {
background: url(data:image/png;base64,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) no-repeat;
background-size: auto 100%;
width: 500px;
height: 120px;
line-height: 120px;
display: flex;
align-items: center;
margin-left: -50px;
}
.primogems .icon-ys {
width: 80px;
height: 80px;
margin-left: 20px;
background: url(https://webstatic.mihoyo.com/upload/event/2023/03/28/77cb5426637574ba524ac458fa963da0_8938800417123864478.png) no-repeat 50% / cover;
;
}
.primogems .icon-mola {
width: 80px;
height: 80px;
margin-left: 20px;
background: url(../../img/other/rails_pass.png) no-repeat 50% / cover;
}
.primogems .text {
margin-left: 35px;
white-space: nowrap;
font-size: 32px;
}
.day {
margin-left: 10px;
}
.day .primogems {
background: url(data:image/png;base64,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) no-repeat;
background-size: auto 100%;
width: 500px;
height: 120px;
line-height: 120px;
display: flex;
align-items: center;
margin-left: -15px;
}
.chart-box .chart-info {
display: flex;
}
.chart-box .head {
margin-bottom: 30px;
font-weight: 800;
font-size: 48px;
margin-left: 70px;
}
.title_wt {
margin: 30px 0;
background-color: #b47f4c;
display: flex;
height: 80px;
width: 330px;
margin-left: 100px;
justify-content: center;
align-items: center;
}
.title_wt div {
font-size: 38px;
color: #fff;
background-color: #302b25;
height: 80px;
display: flex;
margin-left: 30px;
padding-left: 30px;
justify-content: left;
align-items: center;
width: calc(100% - 30px);
}
#chartContainer {
width: 440px;
height: 440px;
background: url(../../img/other/chart.png) no-repeat 50% / cover;
margin-left: 60px;
}
.tooltip {
margin-left: 20px;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.tooltip li {
list-style: none;
display: flex;
justify-content: flex-start;
align-items: center;
}
.tooltip li i {
width: 10px;
height: 10px;
margin-right: 10px;
}
.tooltip li .action {
width: 300px;
}
.tooltip li em {
font-size: 40px;
color: #28384d;
font-style: normal;
width: 30px;
}
.tooltip li .num {
width: 180px;
}
.tooltip li .percent {
width: 10px;
}
.logo {
position: absolute;
bottom: 90px;
left: 130px;
color: #fff;
}