Jerry/rc-plugin
1
0
Fork 0
mirror of https://github.com/Jerryplusy/rc-plugin.git synced 2025-10-14 08:09:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

✨feat: 美化帮助界面 && 删除背景图片升级为暗黑版

Browse Source
This commit is contained in:
zhiyu1998 2024-11-20 19:38:33 +08:00
parent 0c03a3027f
commit c284153f1f
7 changed files with 116 additions and 107 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
resources/font/FZB.ttf Normal file
View File

Binary file not shown.

BIN
resources/font/PermanentMarker.ttf
View File

Binary file not shown.

125
resources/html/help/help.css
View File

@ -1,14 +1,14 @@
@font-face { @font-face {
font-family: "PermanentMarker"; font-family: "FZB";
src: url("../../font/PermanentMarker.ttf"); src: url("../../font/FZB.ttf");
font-weight: normal;
font-style: normal;
} }
* { * {
margin: 0; margin: 0;
padding: 0; font-family: "FZB", serif;
box-sizing: border-box; box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none; user-select: none;
} }
@ -19,40 +19,47 @@ body {
color: #1e1f20; color: #1e1f20;
transform: scale(1.5); transform: scale(1.5);
transform-origin: 0 0; transform-origin: 0 0;
background: #f5f5f5;
line-height: 1.6;
} }
.container { .container {
width: 788px; width: 788px;
padding: 20px 15px 10px 15px; padding: 20px 15px;
background-image: url(../../img/bg.jpg); background-size: cover;
background-size: 100%; background-color: #444;
border-radius: 10px;
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
} }
.head_box { .head_box {
border-radius: 15px; border-radius: 15px;
font-family: 'PermanentMarker', serif; padding: 20px;
padding: 10px 20px;
position: relative; position: relative;
color: white; color: #ffffff;
box-shadow: 0 5px 10px 0 rgb(0 0 0 / 15%); background: linear-gradient(135deg, #2b2b2b, #444444);
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
text-align: center;
border: 2px solid #FFBD73;
} }
.head_box .id_text { .head_box .id_text {
margin-left: 100px; color: #FFBD73;
color: #E1D7B7; font-size: 28px;
font-size: 24px; font-weight: bold;
} }
.head_box .day_text { .head_box .day_text {
margin-left: 100px; color: #FFBD73;
color: #E1D7B7;
font-size: 20px; font-size: 20px;
margin-top: 10px;
} }
.head_box .genshin_logo { .head_box .genshin_logo {
position: absolute; position: absolute;
top: -20px; top: -20px;
width: 97px; left: 15px;
width: 80px;
} }
.base_info { .base_info {
@ -61,19 +68,15 @@ body {
} }
.uid { .uid {
font-family: PermanentMarker, serif; font-family: "FZB", serif;
} }
.data_box { .data_box {
border-radius: 15px; border-radius: 15px;
margin-top: 20px; margin-top: 25px;
margin-bottom: 15px; padding: 25px;
padding: 20px 10px 5px 10px; background: #222;
background: rgba(255, 255, 255, 0.05); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
border: 1px solid rgba(255, 255, 255, 0.18);
position: relative; position: relative;
} }
@ -81,86 +84,77 @@ body {
position: absolute; position: absolute;
top: -12px; top: -12px;
left: -8px; left: -8px;
background-color: rgba(76, 76, 76, 0.8); background-color: #444;
backdrop-filter: blur(5px); padding: 8px 16px;
-webkit-backdrop-filter: blur(5px); border-radius: 15px 0 15px 15px;
box-shadow: 0 4px 16px 0 rgba(31, 38, 135, 0.37);
color: #fff; color: #fff;
font-size: 14px; font-size: 14px;
padding: 5px 12px; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
border-radius: 15px 0px 15px 15px;
z-index: 20;
} }
.data_line { .data_line {
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
margin-bottom: 14px; margin-bottom: 20px;
} }
.data_line_item { .data_line_item {
width: 100px; width: 120px;
text-align: center; text-align: center;
/*margin: 0 20px;*/
} }
.num { .num {
font-family: PermanentMarker, serif; font-family: "FZB", serif;
font-size: 24px; font-size: 26px;
color: #ffd700;
} }
.data_box .lable { .data_box .lable {
font-size: 14px; font-size: 14px;
color: #7f858a; color: #bbb;
line-height: 1; margin-top: 5px;
margin-top: 3px;
} }
.list { .list {
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
flex-wrap: wrap; flex-wrap: wrap;
margin: -5px; margin: -10px;
} }
.list .item { .list .item {
width: calc(50% - 10px); width: calc(50% - 20px);
display: flex; display: flex;
align-items: center; align-items: center;
color: white; color: #fff;
background: rgba(255, 255, 255, 0.1); background: #2b2b2b;
backdrop-filter: blur(10px); padding: 15px;
-webkit-backdrop-filter: blur(10px); border-radius: 12px;
box-shadow: 0 4px 16px 0 rgba(31, 38, 135, 0.2); margin: 10px;
padding: 10px;
border-radius: 10px;
margin: 5px;
transition: all 0.3s ease; transition: all 0.3s ease;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
} }
.list .item:hover { .list .item:hover {
transform: translateY(-2px); transform: translateY(-5px);
box-shadow: 0 6px 20px 0 rgba(31, 38, 135, 0.3); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
} }
.list .item .icon { .list .item .icon {
width: 28px; width: 32px;
height: 28px; height: 32px;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: cover;
position: relative; margin-right: 15px;
flex-shrink: 0;
} }
.list .item .title { .list .item .title {
font-size: 16px; font-size: 16px;
margin-left: 10px; line-height: 1.5;
line-height: 20px;
flex-grow: 1;
} }
.list .item .title .dec { .list .item .title .dec {
font-size: 12px; font-size: 13px;
color: rgba(255, 255, 255, 0.7); color: rgba(255, 255, 255, 0.7);
margin-top: 4px; margin-top: 4px;
} }
@ -168,6 +162,7 @@ body {
.logo { .logo {
text-align: center; text-align: center;
font-size: 14px; font-size: 14px;
color: white; color: #e1d7b7;
font-family: 'PermanentMarker', serif; font-family: "FZB", serif;
margin-top: 30px;
} }

2
resources/html/help/help.html
View File

@ -4,7 +4,7 @@
<head> <head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" /> <meta http-equiv="content-type" content="text/html;charset=utf-8" />
<link rel="stylesheet" type="text/css" href="{{pluResPath}}html/help/help.css" /> <link rel="stylesheet" type="text/css" href="{{pluResPath}}html/help/help.css" />
<link rel="preload" href="{{resPath}}font/PermanentMarker.ttf" as="font" /> <link rel="preload" href="{{resPath}}font/FZB.ttf" as="font" />
<link rel="preload" href="{{pluResPath}}img/bg.jpg" as="image" /> <link rel="preload" href="{{pluResPath}}img/bg.jpg" as="image" />
<link rel="preload" href="{{pluResPath}}img/rank/logo.png" as="image" /> <link rel="preload" href="{{pluResPath}}img/rank/logo.png" as="image" />
<link rel="shortcut icon" href="#" /> <link rel="shortcut icon" href="#" />

88
resources/html/version/version.css
View File

@ -1,82 +1,96 @@
@font-face { @font-face {
font-family: "PermanentMarker"; font-family: "FZB";
src: url("../../font/PermanentMarker.ttf"); src: url("../../font/FZB.ttf");
font-weight: normal;
font-style: normal;
} }
* { * {
margin: 0; margin: 0;
padding: 0; font-family: "FZB", serif;
box-sizing: border-box; box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none; user-select: none;
} }
body { body {
font-size: 16px; font-size: 16px;
font-family: "PermanentMarker", serif; font-family: "FZB", serif;
transform: scale(1.5); transform: scale(1.5);
transform-origin: 0 0; transform-origin: 0 0;
color: white; color: #e1e1e1;
background-color: #1e1e1e;
line-height: 1.5;
} }
.container { .container {
width: 536px; width: 536px;
background-image: url(../../img/bg.jpg); background-size: cover;
background-size: 100%; background-color: #2c2c2c;
padding: 10px 0 10px 0; padding: 20px;
border-radius: 10px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
} }
.version-card { .version-card {
background: transparent; background: #3a3a3a;
margin: 5px 10px 8px 10px; margin: 15px 10px;
position: relative; position: relative;
box-shadow: 0 0 1px 0 #ccc, 2px 2px 4px 0 rgba(50, 50, 50, 0.8); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.4);
overflow: hidden; overflow: hidden;
color: #fff; color: #f0f0f0;
font-size: 16px; font-size: 16px;
border-radius: 4px; border-radius: 8px;
transition: all 0.3s ease;
}
.version-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6);
} }
.version-card .title { .version-card .title {
background: rgba(0, 0, 0, 0.4); background: linear-gradient(135deg, #444, #222);
box-shadow: 0 0 1px 0 #fff; color: #FFBD73;
color: white; font-family: "FZB", serif;
font-family: Number, YS; padding: 15px 20px;
padding: 10px 20px;
text-align: left; text-align: left;
font-size: 16px; font-size: 18px;
padding: 8px 20px 8px;
font-weight: bold; font-weight: bold;
border-bottom: 1px solid #555;
} }
.version-card .content { .version-card .content {
padding: 10px 15px; padding: 15px 20px;
font-size: 12px; font-size: 14px;
background: rgba(0, 0, 0, 0.5); background: #2b2b2b;
box-shadow: 0 0 1px 0 #fff; font-family: "FZB", serif;
font-family: "HYWenHei-55W"; box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5);
font-weight: normal;
} }
.version-card ul { .version-card ul {
font-size: 14px; font-size: 14px;
padding-left: 20px; padding-left: 20px;
list-style-type: disc;
} }
.version-card ul li { .version-card ul li {
margin: 3px 0; margin: 8px 0;
line-height: 1.4;
} }
.version-card .cmd { .version-card .cmd {
color: #d3bc8e; color: #e1c185;
background: rgba(255, 255, 255, 0.1);
display: inline-block; display: inline-block;
border-radius: 3px; border-radius: 5px;
padding: 0 3px; padding: 2px 6px;
margin: 1px 2px; margin: 1px 2px;
} }
.version-card .strong { .version-card .strong {
color: #67a9e4; color: #67a9e4;
background: rgba(255, 255, 255, 0.1);
display: inline-block; display: inline-block;
border-radius: 3px; border-radius: 5px;
padding: 0 3px; padding: 2px 6px;
margin: 1px 2px; margin: 1px 2px;
} }
.logo{ .logo {
text-align: center; text-align: center;
font-size: 14px; font-size: 14px;
color: white; color: #e1d7b7;
font-family: 'PermanentMarker', serif; font-family: 'FZB', serif;
margin-top: 30px;
padding-top: 10px;
border-top: 1px solid #555;
} }

2
resources/html/version/version.html
View File

@ -8,7 +8,7 @@
type="text/css" type="text/css"
href="{{pluResPath}}html/version/version.css" href="{{pluResPath}}html/version/version.css"
/> />
<link rel="preload" href="{{resPath}}font/PermanentMarker.ttf" as="font" /> <link rel="preload" href="{{resPath}}font/FZB.ttf" as="font" />
<link rel="preload" href="{{pluResPath}}img/bg.jpg" as="image" /> <link rel="preload" href="{{pluResPath}}img/bg.jpg" as="image" />
</head> </head>
<body> <body>

BIN
resources/img/bg.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 118 KiB