mirror of
https://github.com/ctrlcvs/xiaoyao-cvs-plugin.git
synced 2024-12-23 03:20:52 +08:00
更新版本号
This commit is contained in:
leiyilu
parent
33bfc66a77
commit
8e9b9e9c75
10
CHANGELOG.md
Normal file
10
CHANGELOG.md
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
# 1.0.2
|
||||||
|
* 重写`体力`渲染
|
||||||
|
* 增加`#图鉴设置体力开关`防止跟乐神的冲突默认是关闭的
|
||||||
|
* 增加`#图鉴帮助`查看插件包功能概况
|
||||||
|
* 增加`#图鉴版本`查看插件版本（借鉴喵喵代码 emmm好吧cv）
|
||||||
|
|
||||||
|
# 1.0.1
|
||||||
|
* 增加`#**图鉴`用于查看逍遥全图鉴
|
||||||
|
* 增加`#图鉴更新`用于获取图鉴数据
|
||||||
|
* 增加`#图鉴插件(强制)更新`用于插件包更新
|
||||||
54
apps/help.js
54
apps/help.js
@ -1,12 +1,52 @@
|
|||||||
|
import { Cfg } from "../components/index.js";
|
||||||
import { segment } from "oicq";
|
import { segment } from "oicq";
|
||||||
|
import lodash from "lodash";
|
||||||
|
import { currentVersion, changelogs } from "../components/Changelog.js";
|
||||||
|
import Common from "../components/Common.js";
|
||||||
const _path = process.cwd();
|
const _path = process.cwd();
|
||||||
export async function calendar(e) {
|
|
||||||
e.reply("当前版本支持：\n角色、武器、食谱、怪物、圣遗物\n指令例：魔女图鉴")
|
const helpFilePath = `${_path}/plugins/xiaoyao-cvs-plugin/resources/help/help-list.js`;
|
||||||
return true;
|
const path_=`/plugins/xiaoyao-cvs-plugin/resources/common/layout/`;
|
||||||
|
export async function help(e, { render }) {
|
||||||
|
if (!/图鉴/.test(e.msg) && !Cfg.get("sys.help", false)) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
let helpFile = {};
|
||||||
|
helpFile = await import(`file://${helpFilePath}?version=${new Date().getTime()}`);
|
||||||
|
|
||||||
|
const { helpCfg } = helpFile;
|
||||||
|
let helpGroup = [];
|
||||||
|
|
||||||
|
lodash.forEach(helpCfg, (group) => {
|
||||||
|
if (group.auth && group.auth === "master" && !e.isMaster) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
lodash.forEach(group.list, (help) => {
|
||||||
|
let icon = help.icon * 1;
|
||||||
|
if (!icon) {
|
||||||
|
help.css = `display:none`;
|
||||||
|
} else {
|
||||||
|
let x = (icon - 1) % 10, y = (icon - x - 1) / 10;
|
||||||
|
help.css = `background-position:-${x * 50}px -${y * 50}px`;
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
helpGroup.push(group);
|
||||||
|
});
|
||||||
|
|
||||||
|
return await Common.render_path("help/index", {
|
||||||
|
helpCfg: helpGroup,
|
||||||
|
element: 'default'
|
||||||
|
}, { e, render, scale: 1.2 },path_)
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function versionInfo(e) {
|
export async function versionInfo(e, { render }) {
|
||||||
e.reply("当前图鉴版本：1.0.1")
|
return await Common.render_path("help/version-info", {
|
||||||
return true;
|
currentVersion,
|
||||||
|
changelogs,
|
||||||
|
elem: "cryo",
|
||||||
|
}, { e, render, scale: 1.2 },path_)
|
||||||
}
|
}
|
||||||
|
|||||||
@ -2,7 +2,7 @@ import fs from "fs";
|
|||||||
import lodash from "lodash";
|
import lodash from "lodash";
|
||||||
|
|
||||||
const _path = process.cwd();
|
const _path = process.cwd();
|
||||||
const _logPath = `${_path}/plugins/miao-plugin/CHANGELOG.md`;
|
const _logPath = `${_path}/plugins/xiaoyao-cvs-plugin/CHANGELOG.md`;
|
||||||
|
|
||||||
let logs = {};
|
let logs = {};
|
||||||
let changelogs = [];
|
let changelogs = [];
|
||||||
|
|||||||
@ -13,7 +13,29 @@ export const render = async function (path, params, cfg) {
|
|||||||
elemLayout: _layout_path + "elem.html",
|
elemLayout: _layout_path + "elem.html",
|
||||||
sys: {
|
sys: {
|
||||||
scale: Cfg.scale(cfg.scale || 1),
|
scale: Cfg.scale(cfg.scale || 1),
|
||||||
copyright: `Created By Yunzai-Bot<span class="version">${yunzaiVersion}</span> & Miao-Plugin<span class="version">${currentVersion}</span>`
|
copyright: `Created By Yunzai-Bot<span class="version">${yunzaiVersion}</span> & xiaoyao-cvs-Plugin<span class="version">${currentVersion}</span>`
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
if (base64) {
|
||||||
|
e.reply(segment.image(`base64://${base64}`));
|
||||||
|
}
|
||||||
|
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const render_path = async function (path, params, cfg,path_) {
|
||||||
|
let paths = path.split("/");
|
||||||
|
let { render, e } = cfg;
|
||||||
|
let _layout_path = process.cwd() + path_;
|
||||||
|
let base64 = await render(paths[0], paths[1], {
|
||||||
|
...params,
|
||||||
|
_layout_path,
|
||||||
|
defaultLayout: _layout_path + "default.html",
|
||||||
|
elemLayout: _layout_path + "elem.html",
|
||||||
|
sys: {
|
||||||
|
scale: Cfg.scale(cfg.scale || 1),
|
||||||
|
copyright: `Created By Yunzai-Bot<span class="version">${yunzaiVersion}</span> & xiaoyao-cvs-Plugin<span class="version">${currentVersion}</span>`
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -25,8 +47,9 @@ export const render = async function (path, params, cfg) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
render,
|
render,render_path,
|
||||||
cfg: Cfg.get,
|
cfg: Cfg.get,
|
||||||
isDisable: Cfg.isDisable
|
isDisable: Cfg.isDisable
|
||||||
};
|
};
|
||||||
16
index.js
16
index.js
@ -4,7 +4,7 @@ import {
|
|||||||
} from "./apps/xiaoyao_image.js";
|
} from "./apps/xiaoyao_image.js";
|
||||||
import {
|
import {
|
||||||
versionInfo,
|
versionInfo,
|
||||||
calendar
|
help
|
||||||
} from "./apps/help.js";
|
} from "./apps/help.js";
|
||||||
import {
|
import {
|
||||||
Note
|
Note
|
||||||
@ -18,7 +18,7 @@ export {
|
|||||||
updateRes,
|
updateRes,
|
||||||
updateMiaoPlugin,
|
updateMiaoPlugin,
|
||||||
versionInfo,sysCfg,
|
versionInfo,sysCfg,
|
||||||
calendar,
|
help,
|
||||||
AtlasAlias,
|
AtlasAlias,
|
||||||
Note
|
Note
|
||||||
};
|
};
|
||||||
@ -28,16 +28,16 @@ let rule = {
|
|||||||
reg: "^#图鉴版本$",
|
reg: "^#图鉴版本$",
|
||||||
describe: "【#帮助】 喵喵版本介绍",
|
describe: "【#帮助】 喵喵版本介绍",
|
||||||
},
|
},
|
||||||
calendar: {
|
help: {
|
||||||
reg: "^#图鉴列表$",
|
reg: "^#图鉴(列表|帮助|help)$",
|
||||||
describe: "【#日历】 活动日历",
|
describe: "查看插件的功能",
|
||||||
},
|
},
|
||||||
AtlasAlias: {
|
AtlasAlias: {
|
||||||
reg: "#*(.*)(信息|图鉴|命座|天赋|突破|材料|特色料理|特殊料理)$", //匹配消息正则，命令正则
|
reg: "#*(.*)(信息|图鉴|命座|天赋|突破|材料|特色料理|特殊料理)$",
|
||||||
describe: "【刻晴信息、刻晴图鉴、刻晴突破、刻晴命座】角色信息图鉴", //【命令】功能说明
|
describe: "【刻晴信息、刻晴图鉴、刻晴突破、刻晴命座】角色信息图鉴",
|
||||||
},
|
},
|
||||||
Note: {
|
Note: {
|
||||||
reg: "^#*(体力|树脂|查询体力|便笺|便签)$", //匹配消息正则，命令正则
|
reg: "^#*(体力|树脂|查询体力|便笺|便签)$",
|
||||||
describe: "体力",
|
describe: "体力",
|
||||||
},
|
},
|
||||||
...adminRule
|
...adminRule
|
||||||
|
|||||||
BIN
resources/common/bg/bg-anemo.jpg
Normal file
BIN
resources/common/bg/bg-anemo.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 187 KiB |
BIN
resources/common/bg/bg-cryo.jpg
Normal file
BIN
resources/common/bg/bg-cryo.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 173 KiB |
BIN
resources/common/bg/bg-electro.jpg
Normal file
BIN
resources/common/bg/bg-electro.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 167 KiB |
BIN
resources/common/bg/bg-geo.jpg
Normal file
BIN
resources/common/bg/bg-geo.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 175 KiB |
BIN
resources/common/bg/bg-hydro.jpg
Normal file
BIN
resources/common/bg/bg-hydro.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 182 KiB |
BIN
resources/common/bg/bg-pyro.jpg
Normal file
BIN
resources/common/bg/bg-pyro.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 175 KiB |
BIN
resources/common/bg/talent-anemo.png
Normal file
BIN
resources/common/bg/talent-anemo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 40 KiB |
BIN
resources/common/bg/talent-cryo.png
Normal file
BIN
resources/common/bg/talent-cryo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 40 KiB |
BIN
resources/common/bg/talent-electro.png
Normal file
BIN
resources/common/bg/talent-electro.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 39 KiB |
BIN
resources/common/bg/talent-geo.png
Normal file
BIN
resources/common/bg/talent-geo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 39 KiB |
BIN
resources/common/bg/talent-hydro.png
Normal file
BIN
resources/common/bg/talent-hydro.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 40 KiB |
BIN
resources/common/bg/talent-pyro.png
Normal file
BIN
resources/common/bg/talent-pyro.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 39 KiB |
324
resources/common/common.css
Normal file
324
resources/common/common.css
Normal file
@ -0,0 +1,324 @@
|
|||||||
|
@font-face {
|
||||||
|
font-family: "HWZS";
|
||||||
|
src: url("../common/font/华文中宋.TTF");
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: "Number";
|
||||||
|
src: url("../common/font/tttgbnumber.ttf");
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: "NZBZ";
|
||||||
|
src: url("../common/font/NZBZ.ttf");
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: "YS";
|
||||||
|
src: url("../common/font/HYWH-85W.ttf");
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: "YS2";
|
||||||
|
src: url("../common/font/HYWH-65W.ttf");
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #1e1f20;
|
||||||
|
font-family: Number, YS2, PingFangSC-Medium, PingFang SC, sans-serif;
|
||||||
|
transform: scale(1.4);
|
||||||
|
transform-origin: 0 0;
|
||||||
|
width: 600px;
|
||||||
|
}
|
||||||
|
.container {
|
||||||
|
width: 600px;
|
||||||
|
padding: 20px 15px 10px 15px;
|
||||||
|
background-size: contain;
|
||||||
|
}
|
||||||
|
.head-box {
|
||||||
|
border-radius: 15px;
|
||||||
|
padding: 10px 20px;
|
||||||
|
position: relative;
|
||||||
|
color: #fff;
|
||||||
|
margin-top: 30px;
|
||||||
|
}
|
||||||
|
.head-box .title {
|
||||||
|
font-size: 36px;
|
||||||
|
font-family: NZBZ, sans-serif;
|
||||||
|
text-shadow: 0 0 1px #000, 1px 1px 3px rgba(0, 0, 0, 0.9);
|
||||||
|
}
|
||||||
|
.head-box .genshin_logo {
|
||||||
|
position: absolute;
|
||||||
|
top: 1px;
|
||||||
|
right: 15px;
|
||||||
|
width: 97px;
|
||||||
|
}
|
||||||
|
.head-box .label {
|
||||||
|
font-size: 16px;
|
||||||
|
text-shadow: 0 0 1px #000, 1px 1px 3px rgba(0, 0, 0, 0.9);
|
||||||
|
}
|
||||||
|
.notice {
|
||||||
|
color: #888;
|
||||||
|
font-size: 12px;
|
||||||
|
text-align: right;
|
||||||
|
padding: 12px 5px 5px;
|
||||||
|
}
|
||||||
|
.notice-center {
|
||||||
|
color: #fff;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
text-shadow: 1px 1px 1px #333;
|
||||||
|
}
|
||||||
|
.copyright {
|
||||||
|
font-size: 16px;
|
||||||
|
font-family: Number, sans-serif;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
position: relative;
|
||||||
|
padding-left: 10px;
|
||||||
|
text-shadow: 1px 1px 1px #000;
|
||||||
|
margin: 10px 0;
|
||||||
|
}
|
||||||
|
.copyright .version {
|
||||||
|
font-size: 13px;
|
||||||
|
color: #d3bc8e;
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0 3px;
|
||||||
|
}
|
||||||
|
/* */
|
||||||
|
.cons {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
padding: 0 5px;
|
||||||
|
font-family: Number, YS;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
.cons-0 {
|
||||||
|
background: #666;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.cons-n0 {
|
||||||
|
background: #404949;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.cons-1 {
|
||||||
|
background: #5cbac2;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.cons-2 {
|
||||||
|
background: #339d61;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.cons-3 {
|
||||||
|
background: #3e95b9;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.cons-4 {
|
||||||
|
background: #3955b7;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.cons-5 {
|
||||||
|
background: #531ba9cf;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.cons-6 {
|
||||||
|
background: #ff5722;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.cons2-0 {
|
||||||
|
border-radius: 4px;
|
||||||
|
background: #666;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.cons2-1 {
|
||||||
|
border-radius: 4px;
|
||||||
|
background: #71b1b7;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.cons2-2 {
|
||||||
|
border-radius: 4px;
|
||||||
|
background: #369961;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.cons2-3 {
|
||||||
|
border-radius: 4px;
|
||||||
|
background: #4596b9;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.cons2-4 {
|
||||||
|
border-radius: 4px;
|
||||||
|
background: #4560b9;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.cons2-5 {
|
||||||
|
border-radius: 4px;
|
||||||
|
background: #531ba9cf;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.cons2-6 {
|
||||||
|
border-radius: 4px;
|
||||||
|
background: #ff5722;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
/******** ELEM ********/
|
||||||
|
.elem-anemo .talent-icon {
|
||||||
|
background-image: url("./bg/talent-anemo.png");
|
||||||
|
}
|
||||||
|
.elem-anemo .elem-bg,
|
||||||
|
.anemo-bg {
|
||||||
|
background-image: url("./bg/bg-anemo.jpg");
|
||||||
|
}
|
||||||
|
.elem-cryo .talent-icon {
|
||||||
|
background-image: url("./bg/talent-cryo.png");
|
||||||
|
}
|
||||||
|
.elem-cryo .elem-bg,
|
||||||
|
.cryo-bg {
|
||||||
|
background-image: url("./bg/bg-cryo.jpg");
|
||||||
|
}
|
||||||
|
.elem-electro .talent-icon {
|
||||||
|
background-image: url("./bg/talent-electro.png");
|
||||||
|
}
|
||||||
|
.elem-electro .elem-bg,
|
||||||
|
.electro-bg {
|
||||||
|
background-image: url("./bg/bg-electro.jpg");
|
||||||
|
}
|
||||||
|
.elem-geo .talent-icon {
|
||||||
|
background-image: url("./bg/talent-geo.png");
|
||||||
|
}
|
||||||
|
.elem-geo .elem-bg,
|
||||||
|
.geo-bg {
|
||||||
|
background-image: url("./bg/bg-geo.jpg");
|
||||||
|
}
|
||||||
|
.elem-hydro .talent-icon {
|
||||||
|
background-image: url("./bg/talent-hydro.png");
|
||||||
|
}
|
||||||
|
.elem-hydro .elem-bg,
|
||||||
|
.hydro-bg {
|
||||||
|
background-image: url("./bg/bg-hydro.jpg");
|
||||||
|
}
|
||||||
|
.elem-pyro .talent-icon {
|
||||||
|
background-image: url("./bg/talent-pyro.png");
|
||||||
|
}
|
||||||
|
.elem-pyro .elem-bg,
|
||||||
|
.pyro-bg {
|
||||||
|
background-image: url("./bg/bg-pyro.jpg");
|
||||||
|
}
|
||||||
|
/* cont */
|
||||||
|
.cont {
|
||||||
|
border-radius: 10px;
|
||||||
|
background: url("../common/cont/card-bg.png") top left repeat-x;
|
||||||
|
background-size: auto 100%;
|
||||||
|
margin: 5px 15px 5px 10px;
|
||||||
|
position: relative;
|
||||||
|
box-shadow: 0 0 1px 0 #ccc, 2px 2px 4px 0 rgba(50, 50, 50, 0.8);
|
||||||
|
overflow: hidden;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.cont-title {
|
||||||
|
background: rgba(0, 0, 0, 0.4);
|
||||||
|
box-shadow: 0 0 1px 0 #fff;
|
||||||
|
color: #d3bc8e;
|
||||||
|
font-family: Number, YS;
|
||||||
|
padding: 10px 20px;
|
||||||
|
text-align: left;
|
||||||
|
border-radius: 10px 10px 0 0;
|
||||||
|
}
|
||||||
|
.cont-title span {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #aaa;
|
||||||
|
margin-left: 10px;
|
||||||
|
font-family: Number, YS;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
.cont-body {
|
||||||
|
padding: 10px 15px;
|
||||||
|
font-size: 12px;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
box-shadow: 0 0 1px 0 #fff;
|
||||||
|
font-family: YS;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
ul.cont-msg {
|
||||||
|
padding-left: 15px;
|
||||||
|
}
|
||||||
|
ul.cont-msg li {
|
||||||
|
margin: 5px 0;
|
||||||
|
}
|
||||||
|
ul.cont-msg li strong {
|
||||||
|
font-weight: normal;
|
||||||
|
margin: 0 2px;
|
||||||
|
color: #d3bc8e;
|
||||||
|
}
|
||||||
|
.cont-footer {
|
||||||
|
padding: 10px 15px;
|
||||||
|
font-size: 12px;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
font-family: YS;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
.cont-table {
|
||||||
|
display: table;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.cont-table .tr {
|
||||||
|
display: table-row;
|
||||||
|
}
|
||||||
|
.cont-table .tr:nth-child(even) {
|
||||||
|
background: rgba(0, 0, 0, 0.4);
|
||||||
|
}
|
||||||
|
.cont-table .tr:nth-child(odd) {
|
||||||
|
background: rgba(50, 50, 50, 0.4);
|
||||||
|
}
|
||||||
|
.cont-table .tr > div,
|
||||||
|
.cont-table .tr > td {
|
||||||
|
display: table-cell;
|
||||||
|
box-shadow: 0 0 1px 0 #fff;
|
||||||
|
}
|
||||||
|
.cont-table .tr > div.value-full {
|
||||||
|
display: table;
|
||||||
|
width: 200%;
|
||||||
|
}
|
||||||
|
.cont-table .tr > div.value-none {
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
.cont-table .thead {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.cont-table .thead > div,
|
||||||
|
.cont-table .thead > td {
|
||||||
|
font-family: YS;
|
||||||
|
color: #d3bc8e;
|
||||||
|
background: rgba(0, 0, 0, 0.4);
|
||||||
|
line-height: 40px;
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
.cont-table .title,
|
||||||
|
.cont-table .th {
|
||||||
|
font-family: YS;
|
||||||
|
color: #d3bc8e;
|
||||||
|
padding-right: 15px;
|
||||||
|
text-align: right;
|
||||||
|
background: rgba(0, 0, 0, 0.4);
|
||||||
|
min-width: 100px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
.logo {
|
||||||
|
font-size: 18px;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
margin: 20px 0 10px 0;
|
||||||
|
}
|
||||||
|
/*# sourceMappingURL=common.css.map */
|
||||||
308
resources/common/common.less
Normal file
308
resources/common/common.less
Normal file
@ -0,0 +1,308 @@
|
|||||||
|
@font-face {
|
||||||
|
font-family: "HWZS";
|
||||||
|
src: url("../common/font/华文中宋.TTF");
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: "Number";
|
||||||
|
src: url("../common/font/tttgbnumber.ttf");
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: "NZBZ";
|
||||||
|
src: url("../common/font/NZBZ.ttf");
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: "YS";
|
||||||
|
src: url("../common/font/HYWH-85W.ttf");
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: "YS2";
|
||||||
|
src: url("../common/font/HYWH-65W.ttf");
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #1e1f20;
|
||||||
|
font-family: Number, YS2, PingFangSC-Medium, PingFang SC, sans-serif;
|
||||||
|
transform: scale(1.4);
|
||||||
|
transform-origin: 0 0;
|
||||||
|
width: 600px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
width: 600px;
|
||||||
|
padding: 20px 15px 10px 15px;
|
||||||
|
background-size: contain;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.head-box {
|
||||||
|
border-radius: 15px;
|
||||||
|
padding: 10px 20px;
|
||||||
|
position: relative;
|
||||||
|
color: #fff;
|
||||||
|
margin-top: 30px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.head-box .title {
|
||||||
|
font-size: 36px;
|
||||||
|
font-family: NZBZ, sans-serif;
|
||||||
|
text-shadow: 0 0 1px #000, 1px 1px 3px rgba(0, 0, 0, .9);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.head-box .genshin_logo {
|
||||||
|
position: absolute;
|
||||||
|
top: 1px;
|
||||||
|
right: 15px;
|
||||||
|
width: 97px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.head-box .label {
|
||||||
|
font-size: 16px;
|
||||||
|
text-shadow: 0 0 1px #000, 1px 1px 3px rgba(0, 0, 0, .9);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.notice {
|
||||||
|
color: #888;
|
||||||
|
font-size: 12px;
|
||||||
|
text-align: right;
|
||||||
|
padding: 12px 5px 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.notice-center {
|
||||||
|
color: #fff;
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
text-shadow: 1px 1px 1px #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.copyright {
|
||||||
|
font-size: 16px;
|
||||||
|
font-family: Number, sans-serif;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
position: relative;
|
||||||
|
padding-left: 10px;
|
||||||
|
text-shadow: 1px 1px 1px #000;
|
||||||
|
margin: 10px 0;
|
||||||
|
|
||||||
|
.version {
|
||||||
|
font-size: 13px;
|
||||||
|
color: #d3bc8e;
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0 3px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* */
|
||||||
|
|
||||||
|
.cons {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
padding: 0 5px;
|
||||||
|
border-radius: 4px;
|
||||||
|
font-family: Number, YS;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.cons(@idx, @bg, @color:#fff) {
|
||||||
|
.cons-@{idx} {
|
||||||
|
background: @bg;
|
||||||
|
color: @color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.cons(0, #666);
|
||||||
|
.cons(n0, #404949);
|
||||||
|
.cons(1, #5cbac2);
|
||||||
|
.cons(2, #339d61);
|
||||||
|
.cons(3, #3e95b9);
|
||||||
|
.cons(4, #3955b7);
|
||||||
|
.cons(5, #531ba9cf);
|
||||||
|
.cons(6, #ff5722);
|
||||||
|
|
||||||
|
.cons2(@idx, @bg, @color:#fff) {
|
||||||
|
.cons2-@{idx} {
|
||||||
|
border-radius: 4px;
|
||||||
|
background: @bg;
|
||||||
|
color: @color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.cons2(0, #666);
|
||||||
|
.cons2(1, #71b1b7);
|
||||||
|
.cons2(2, #369961);
|
||||||
|
.cons2(3, #4596b9);
|
||||||
|
.cons2(4, #4560b9);
|
||||||
|
.cons2(5, #531ba9cf);
|
||||||
|
.cons2(6, #ff5722);
|
||||||
|
|
||||||
|
|
||||||
|
/******** ELEM ********/
|
||||||
|
|
||||||
|
@elems: anemo, cryo, electro, geo, hydro, pyro;
|
||||||
|
|
||||||
|
each(@elems, {
|
||||||
|
.elem-@{value} .talent-icon {
|
||||||
|
background-image: url("./bg/talent-@{value}.png");
|
||||||
|
}
|
||||||
|
|
||||||
|
.elem-@{value} .elem-bg,
|
||||||
|
.@{value}-bg {
|
||||||
|
background-image: url("./bg/bg-@{value}.jpg");
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
/* cont */
|
||||||
|
|
||||||
|
.cont {
|
||||||
|
border-radius: 10px;
|
||||||
|
background: url("../common/cont/card-bg.png") top left repeat-x;
|
||||||
|
background-size: auto 100%;
|
||||||
|
margin: 5px 15px 5px 10px;
|
||||||
|
position: relative;
|
||||||
|
box-shadow: 0 0 1px 0 #ccc, 2px 2px 4px 0 rgba(50, 50, 50, .8);
|
||||||
|
overflow: hidden;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.cont-title {
|
||||||
|
background: rgba(0, 0, 0, .4);
|
||||||
|
box-shadow: 0 0 1px 0 #fff;
|
||||||
|
color: #d3bc8e;
|
||||||
|
font-family: Number, YS;
|
||||||
|
padding: 10px 20px;
|
||||||
|
text-align: left;
|
||||||
|
border-radius: 10px 10px 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont-title span {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #aaa;
|
||||||
|
margin-left: 10px;
|
||||||
|
font-family: Number, YS;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont-body {
|
||||||
|
padding: 10px 15px;
|
||||||
|
font-size: 12px;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
box-shadow: 0 0 1px 0 #fff;
|
||||||
|
font-family: YS;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.cont-msg {
|
||||||
|
padding-left: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.cont-msg li {
|
||||||
|
margin: 5px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.cont-msg li strong {
|
||||||
|
font-weight: normal;
|
||||||
|
margin: 0 2px;
|
||||||
|
color: #d3bc8e;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont-footer {
|
||||||
|
padding: 10px 15px;
|
||||||
|
font-size: 12px;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
font-family: YS;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont-table {
|
||||||
|
display: table;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont-table .tr {
|
||||||
|
display: table-row;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont-table .tr:nth-child(even) {
|
||||||
|
background: rgba(0, 0, 0, .4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont-table .tr:nth-child(odd) {
|
||||||
|
background: rgba(50, 50, 50, .4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont-table .tr > div,
|
||||||
|
.cont-table .tr > td {
|
||||||
|
display: table-cell;
|
||||||
|
box-shadow: 0 0 1px 0 #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont-table .tr > div.value-full {
|
||||||
|
display: table;
|
||||||
|
width: 200%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont-table .tr > div.value-none {
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont-table .thead {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont-table .thead > div,
|
||||||
|
.cont-table .thead > td {
|
||||||
|
font-family: YS;
|
||||||
|
color: #d3bc8e;
|
||||||
|
background: rgba(0, 0, 0, .4);
|
||||||
|
line-height: 40px;
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.cont-table .title,
|
||||||
|
.cont-table .th {
|
||||||
|
font-family: YS;
|
||||||
|
color: #d3bc8e;
|
||||||
|
padding-right: 15px;
|
||||||
|
text-align: right;
|
||||||
|
background: rgba(0, 0, 0, .4);
|
||||||
|
min-width: 100px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
font-size: 18px;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
margin: 20px 0 10px 0;
|
||||||
|
}
|
||||||
BIN
resources/common/cont/card-bg.png
Normal file
BIN
resources/common/cont/card-bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.5 KiB |
BIN
resources/common/font/HYWH-65W.ttf
Normal file
BIN
resources/common/font/HYWH-65W.ttf
Normal file
Binary file not shown.
BIN
resources/common/font/HYWH-85W.ttf
Normal file
BIN
resources/common/font/HYWH-85W.ttf
Normal file
Binary file not shown.
BIN
resources/common/font/NZBZ.ttf
Normal file
BIN
resources/common/font/NZBZ.ttf
Normal file
Binary file not shown.
BIN
resources/common/font/tttgbnumber.ttf
Normal file
BIN
resources/common/font/tttgbnumber.ttf
Normal file
Binary file not shown.
BIN
resources/common/font/华文中宋.TTF
Normal file
BIN
resources/common/font/华文中宋.TTF
Normal file
Binary file not shown.
BIN
resources/common/item/bg3.png
Normal file
BIN
resources/common/item/bg3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
BIN
resources/common/item/bg4.png
Normal file
BIN
resources/common/item/bg4.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
resources/common/item/bg5.png
Normal file
BIN
resources/common/item/bg5.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
BIN
resources/common/item/star.png
Normal file
BIN
resources/common/item/star.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.4 KiB |
16
resources/common/layout/default.html
Normal file
16
resources/common/layout/default.html
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
|
||||||
|
<link rel="shortcut icon" href="#"/>
|
||||||
|
<link rel="stylesheet" type="text/css" href="{{_res_path}}/common/common.css"/>
|
||||||
|
{{block 'css'}}
|
||||||
|
{{/block}}
|
||||||
|
</head>
|
||||||
|
<body class="elem-{{element||elem||`hydro`}} {{displayMode || mode || `default`}}-mode {{bodyClass}}" {{sys.scale}}>
|
||||||
|
<div class="container" id="container">
|
||||||
|
{{block 'main'}}{{/block}}
|
||||||
|
<div class="copyright">{{@sys.copyright}}</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
16
resources/common/layout/elem.html
Normal file
16
resources/common/layout/elem.html
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
|
||||||
|
<link rel="shortcut icon" href="#"/>
|
||||||
|
<link rel="stylesheet" type="text/css" href="{{_res_path}}/common/common.css"/>
|
||||||
|
{{block 'css'}}
|
||||||
|
{{/block}}
|
||||||
|
</head>
|
||||||
|
<body class="elem-{{element||elem||`hydro`}} {{displayMode || mode || `default`}}-mode {{bodyClass}}" {{sys.scale}}>
|
||||||
|
<div class="container elem-bg" id="container">
|
||||||
|
{{block 'main'}}{{/block}}
|
||||||
|
<div class="copyright">{{@sys.copyright}}</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
BIN
resources/common/theme/bg-01.jpg
Normal file
BIN
resources/common/theme/bg-01.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 38 KiB |
BIN
resources/common/theme/main-01.png
Normal file
BIN
resources/common/theme/main-01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 743 KiB |
469
resources/common/tpl.css
Normal file
469
resources/common/tpl.css
Normal file
@ -0,0 +1,469 @@
|
|||||||
|
.item-card {
|
||||||
|
width: 66px;
|
||||||
|
margin: 4px;
|
||||||
|
position: relative;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
.item-card .badge {
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: block;
|
||||||
|
width: 26px;
|
||||||
|
height: 26px;
|
||||||
|
position: absolute;
|
||||||
|
right: -4px;
|
||||||
|
top: -4px;
|
||||||
|
background: #e9e5dc;
|
||||||
|
box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.8), 2px 2px 2px rgba(50, 50, 50, 0.5);
|
||||||
|
z-index: 10;
|
||||||
|
}
|
||||||
|
.item-card .badge img {
|
||||||
|
width: 140%;
|
||||||
|
left: -27%;
|
||||||
|
top: -45%;
|
||||||
|
overflow: hidden;
|
||||||
|
background-size: 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
.item-card .item-bg {
|
||||||
|
width: 100%;
|
||||||
|
padding: 100% 0 0;
|
||||||
|
background-size: cover;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
.item-card .bg1 {
|
||||||
|
background-image: url("./item/bg1.png");
|
||||||
|
border-radius: 5px 5px 15px 0;
|
||||||
|
}
|
||||||
|
.item-card .bg-1 {
|
||||||
|
background-image: url("./item/bg1.png");
|
||||||
|
border-radius: 5px 5px 15px 0;
|
||||||
|
}
|
||||||
|
.item-card .bg2 {
|
||||||
|
background-image: url("./item/bg2.png");
|
||||||
|
border-radius: 5px 5px 15px 0;
|
||||||
|
}
|
||||||
|
.item-card .bg-2 {
|
||||||
|
background-image: url("./item/bg2.png");
|
||||||
|
border-radius: 5px 5px 15px 0;
|
||||||
|
}
|
||||||
|
.item-card .bg3 {
|
||||||
|
background-image: url("./item/bg3.png");
|
||||||
|
border-radius: 5px 5px 15px 0;
|
||||||
|
}
|
||||||
|
.item-card .bg-3 {
|
||||||
|
background-image: url("./item/bg3.png");
|
||||||
|
border-radius: 5px 5px 15px 0;
|
||||||
|
}
|
||||||
|
.item-card .bg4 {
|
||||||
|
background-image: url("./item/bg4.png");
|
||||||
|
border-radius: 5px 5px 15px 0;
|
||||||
|
}
|
||||||
|
.item-card .bg-4 {
|
||||||
|
background-image: url("./item/bg4.png");
|
||||||
|
border-radius: 5px 5px 15px 0;
|
||||||
|
}
|
||||||
|
.item-card .bg5 {
|
||||||
|
background-image: url("./item/bg5.png");
|
||||||
|
border-radius: 5px 5px 15px 0;
|
||||||
|
}
|
||||||
|
.item-card .bg-5 {
|
||||||
|
background-image: url("./item/bg5.png");
|
||||||
|
border-radius: 5px 5px 15px 0;
|
||||||
|
}
|
||||||
|
.item-card .box {
|
||||||
|
border-radius: 5px;
|
||||||
|
overflow: hidden;
|
||||||
|
background: #e9e5dc;
|
||||||
|
}
|
||||||
|
.item-card .box .item-desc {
|
||||||
|
display: block;
|
||||||
|
font-weight: 500;
|
||||||
|
text-align: center;
|
||||||
|
bottom: 0;
|
||||||
|
background: #e9e5dc;
|
||||||
|
width: 100%;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 16px;
|
||||||
|
font-family: Number, YS;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 0 3px;
|
||||||
|
}
|
||||||
|
.item-card .box .item-desc:last-child {
|
||||||
|
padding-bottom: 2px;
|
||||||
|
}
|
||||||
|
.item-card .box .name {
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
margin-top: 5px;
|
||||||
|
font-weight: 500;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.item-card .box .item-img {
|
||||||
|
width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
background-size: 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
.item-card .item-life {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
left: 0px;
|
||||||
|
z-index: 9;
|
||||||
|
font-size: 13px;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 2px;
|
||||||
|
padding: 1px 4px;
|
||||||
|
border-radius: 3px;
|
||||||
|
font-family: "tttgbnumber";
|
||||||
|
}
|
||||||
|
.item-card .life1 {
|
||||||
|
background-color: #62a8ea;
|
||||||
|
}
|
||||||
|
.item-card .life2 {
|
||||||
|
background-color: #62a8ea;
|
||||||
|
}
|
||||||
|
.item-card .life3 {
|
||||||
|
background-color: #62a8ea;
|
||||||
|
}
|
||||||
|
.item-card .life4 {
|
||||||
|
background-color: #ff5722;
|
||||||
|
}
|
||||||
|
.item-card .life5 {
|
||||||
|
background-color: #ff5722;
|
||||||
|
}
|
||||||
|
.profile {
|
||||||
|
position: relative;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.profile:after {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
left: 8px;
|
||||||
|
top: 115px;
|
||||||
|
bottom: 0;
|
||||||
|
right: 8px;
|
||||||
|
box-shadow: 0 0 2px 0 #fff;
|
||||||
|
border-radius: 5px;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
.profile .main-pic {
|
||||||
|
width: 800px;
|
||||||
|
height: 500px;
|
||||||
|
background-size: contain;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
margin-left: -260px;
|
||||||
|
position: relative;
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
.profile .detail {
|
||||||
|
position: absolute;
|
||||||
|
right: 20px;
|
||||||
|
top: 20px;
|
||||||
|
color: #fff;
|
||||||
|
z-index: 3;
|
||||||
|
}
|
||||||
|
.profile .char-name {
|
||||||
|
font-size: 50px;
|
||||||
|
font-family: NZBZ;
|
||||||
|
text-shadow: 0 0 3px #000, 2px 2px 4px rgba(0, 0, 0, 0.7);
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
.profile .char-lv {
|
||||||
|
font-family: Number;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
text-shadow: 0 0 3px #000, 2px 2px 4px rgba(0, 0, 0, 0.7);
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
.profile .attr {
|
||||||
|
border-radius: 4px;
|
||||||
|
overflow: hidden;
|
||||||
|
background: rgba(0, 0, 0, 0.3);
|
||||||
|
}
|
||||||
|
.profile .detail li {
|
||||||
|
width: 300px;
|
||||||
|
font-size: 17px;
|
||||||
|
list-style: none;
|
||||||
|
padding: 0 100px 0 35px;
|
||||||
|
position: relative;
|
||||||
|
font-family: YS;
|
||||||
|
height: 32px;
|
||||||
|
line-height: 32px;
|
||||||
|
text-shadow: 0 0 1px rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
.profile .attr li i {
|
||||||
|
display: inline-block;
|
||||||
|
height: 20px;
|
||||||
|
width: 20px;
|
||||||
|
background-image: url("../character/icon.png");
|
||||||
|
background-size: auto 20px;
|
||||||
|
position: absolute;
|
||||||
|
left: 10px;
|
||||||
|
top: 8px;
|
||||||
|
opacity: 0.9;
|
||||||
|
transform: scale(0.9);
|
||||||
|
}
|
||||||
|
.profile .i-hp {
|
||||||
|
background-position: -20px 0;
|
||||||
|
}
|
||||||
|
.profile .i-atk {
|
||||||
|
background-position: -40px 0;
|
||||||
|
}
|
||||||
|
.profile .i-def {
|
||||||
|
background-position: -60px 0;
|
||||||
|
}
|
||||||
|
.profile .i-mastery {
|
||||||
|
background-position: -80px 0;
|
||||||
|
}
|
||||||
|
.profile .i-cr {
|
||||||
|
background-position: -100px 0;
|
||||||
|
}
|
||||||
|
.profile .i-cd {
|
||||||
|
background-position: -140px 0;
|
||||||
|
}
|
||||||
|
.profile .i-re {
|
||||||
|
background-position: -120px 0;
|
||||||
|
}
|
||||||
|
.profile .i-dmg {
|
||||||
|
background-position: -160px 0;
|
||||||
|
}
|
||||||
|
.profile .detail li:nth-child(even) {
|
||||||
|
background: rgba(0, 0, 0, 0.4);
|
||||||
|
}
|
||||||
|
.profile .detail li:nth-child(odd) {
|
||||||
|
background: rgba(50, 50, 50, 0.4);
|
||||||
|
}
|
||||||
|
.profile .detail li strong {
|
||||||
|
display: inline-block;
|
||||||
|
position: absolute;
|
||||||
|
right: 85px;
|
||||||
|
text-align: right;
|
||||||
|
font-family: Number, sans-serif;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
.profile .detail li span {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
text-align: left;
|
||||||
|
width: 75px;
|
||||||
|
display: inline-block;
|
||||||
|
font-family: Number, sans-serif;
|
||||||
|
color: #90e800;
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
.profile .talent-icon {
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
padding: 5px;
|
||||||
|
display: table;
|
||||||
|
border-radius: 50%;
|
||||||
|
position: relative;
|
||||||
|
background-size: contain;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center center;
|
||||||
|
z-index: 90;
|
||||||
|
}
|
||||||
|
.profile .talent-icon img,
|
||||||
|
.profile .talent-icon .profile .talent-icon-img {
|
||||||
|
width: 46%;
|
||||||
|
height: 46%;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
margin: -22% 0 0 -23%;
|
||||||
|
background-size: contain;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
}
|
||||||
|
.profile .talent-icon span {
|
||||||
|
background: #fff;
|
||||||
|
width: 34px;
|
||||||
|
height: 26px;
|
||||||
|
line-height: 26px;
|
||||||
|
font-size: 17px;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 5px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 2px;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -15px;
|
||||||
|
color: #000;
|
||||||
|
box-shadow: 0 0 5px 0 #000;
|
||||||
|
font-family: Number;
|
||||||
|
}
|
||||||
|
.profile .talent-icon.talent-plus span {
|
||||||
|
background: #2e353e;
|
||||||
|
color: #ffdfa0;
|
||||||
|
font-weight: bold;
|
||||||
|
box-shadow: 0 0 1px 0 #d3bc8e, 1px 1px 2px 0 rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
.profile .talent-icon.talent-crown:after {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 28px;
|
||||||
|
height: 28px;
|
||||||
|
background: url("../../character/imgs/crown.png") no-repeat;
|
||||||
|
background-size: contain;
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
top: 0;
|
||||||
|
margin-left: -14px;
|
||||||
|
}
|
||||||
|
.profile .char-talents {
|
||||||
|
display: flex;
|
||||||
|
width: 300px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.profile .char-cons .talent-item,
|
||||||
|
.profile .char-talents .talent-item {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
.profile .char-cons {
|
||||||
|
display: flex;
|
||||||
|
width: 250px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 5px;
|
||||||
|
left: 20px;
|
||||||
|
}
|
||||||
|
.profile .char-cons .talent-icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 0 -5px;
|
||||||
|
}
|
||||||
|
.profile .char-cons .talent-icon.off {
|
||||||
|
filter: grayscale(100%);
|
||||||
|
opacity: 0.4;
|
||||||
|
}
|
||||||
|
.arti-detail {
|
||||||
|
width: 185px;
|
||||||
|
border-radius: 10px;
|
||||||
|
background: url("./cont/card-bg.png") top left repeat-x;
|
||||||
|
background-size: auto 100%;
|
||||||
|
margin: 5px;
|
||||||
|
position: relative;
|
||||||
|
box-shadow: 0 0 1px 0 #ccc, 2px 2px 4px 0 rgba(50, 50, 50, 0.8);
|
||||||
|
height: 205px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.arti-detail .arti-icon {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
position: absolute;
|
||||||
|
left: 2px;
|
||||||
|
top: 3px;
|
||||||
|
}
|
||||||
|
.arti-detail .arti-icon span {
|
||||||
|
position: absolute;
|
||||||
|
right: 2px;
|
||||||
|
bottom: 0;
|
||||||
|
margin-left: 5px;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
border-radius: 5px;
|
||||||
|
height: 18px;
|
||||||
|
line-height: 18px;
|
||||||
|
padding: 0 3px;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 12px;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.arti-detail .arti-icon img {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
.arti-detail .head {
|
||||||
|
color: #fff;
|
||||||
|
padding: 12px 0 8px 68px;
|
||||||
|
}
|
||||||
|
.arti-detail .head strong {
|
||||||
|
font-size: 15px;
|
||||||
|
display: block;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
font-font: YS;
|
||||||
|
}
|
||||||
|
.arti-detail .head span {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.arti-detail .head .mark {
|
||||||
|
font-family: Number, YS;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail {
|
||||||
|
width: 100%;
|
||||||
|
padding: 0;
|
||||||
|
position: initial;
|
||||||
|
font-family: YS;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail li {
|
||||||
|
padding: 0 3px;
|
||||||
|
font-size: 14px;
|
||||||
|
position: initial;
|
||||||
|
width: 100%;
|
||||||
|
display: table;
|
||||||
|
line-height: 26px;
|
||||||
|
height: 26px;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail li.nouse span {
|
||||||
|
color: #888;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail li.arti-main {
|
||||||
|
font-size: 16px;
|
||||||
|
padding: 3px 3px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail li span {
|
||||||
|
position: initial;
|
||||||
|
display: table-cell;
|
||||||
|
color: #fff;
|
||||||
|
font-family: YS;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail li span.title {
|
||||||
|
text-align: left;
|
||||||
|
padding-left: 10px;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail li span.val {
|
||||||
|
text-align: right;
|
||||||
|
padding-right: 10px;
|
||||||
|
font-family: Number;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail li:nth-child(even) {
|
||||||
|
background: rgba(0, 0, 0, 0.4);
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail li:nth-child(odd) {
|
||||||
|
background: rgba(50, 50, 50, 0.4);
|
||||||
|
}
|
||||||
|
.arti-detail .avatar-icon {
|
||||||
|
position: absolute;
|
||||||
|
left: 32px;
|
||||||
|
top: 26px;
|
||||||
|
width: 38px;
|
||||||
|
height: 38px;
|
||||||
|
border-radius: 50%;
|
||||||
|
overflow: hidden;
|
||||||
|
z-index: 3;
|
||||||
|
}
|
||||||
|
.arti-detail .avatar-icon img {
|
||||||
|
max-width: 100%;
|
||||||
|
max-height: 100%;
|
||||||
|
}
|
||||||
|
.arti-detail .arti-icon img {
|
||||||
|
width: 52px;
|
||||||
|
height: 52px;
|
||||||
|
}
|
||||||
|
.item-list {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
transform-origin: 0 0;
|
||||||
|
}
|
||||||
|
.item-list .item {
|
||||||
|
width: 65px;
|
||||||
|
}
|
||||||
|
/*# sourceMappingURL=tpl.css.map */
|
||||||
16
resources/common/tpl.less
Normal file
16
resources/common/tpl.less
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
|
||||||
|
|
||||||
|
@import url('tpl/item-card');
|
||||||
|
@import url('tpl/avatar-profile');
|
||||||
|
@import url('tpl/artis-detail');
|
||||||
|
|
||||||
|
|
||||||
|
.item-list {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
transform-origin: 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-list .item {
|
||||||
|
width: 65px;
|
||||||
|
}
|
||||||
116
resources/common/tpl/artis-detail.css
Normal file
116
resources/common/tpl/artis-detail.css
Normal file
@ -0,0 +1,116 @@
|
|||||||
|
.arti-detail {
|
||||||
|
width: 185px;
|
||||||
|
border-radius: 10px;
|
||||||
|
background: url("../cont/card-bg.png") top left repeat-x;
|
||||||
|
background-size: auto 100%;
|
||||||
|
margin: 5px;
|
||||||
|
position: relative;
|
||||||
|
box-shadow: 0 0 1px 0 #ccc, 2px 2px 4px 0 rgba(50, 50, 50, 0.8);
|
||||||
|
height: 205px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.arti-detail .arti-icon {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
position: absolute;
|
||||||
|
left: 2px;
|
||||||
|
top: 3px;
|
||||||
|
}
|
||||||
|
.arti-detail .arti-icon span {
|
||||||
|
position: absolute;
|
||||||
|
right: 2px;
|
||||||
|
bottom: 0;
|
||||||
|
margin-left: 5px;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
border-radius: 5px;
|
||||||
|
height: 18px;
|
||||||
|
line-height: 18px;
|
||||||
|
padding: 0 3px;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 12px;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.arti-detail .arti-icon img {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
.arti-detail .head {
|
||||||
|
color: #fff;
|
||||||
|
padding: 12px 0 8px 68px;
|
||||||
|
}
|
||||||
|
.arti-detail .head strong {
|
||||||
|
font-size: 15px;
|
||||||
|
display: block;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
font-font: YS;
|
||||||
|
}
|
||||||
|
.arti-detail .head span {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.arti-detail .head .mark {
|
||||||
|
font-family: Number, YS;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail {
|
||||||
|
width: 100%;
|
||||||
|
padding: 0;
|
||||||
|
position: initial;
|
||||||
|
font-family: YS;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail li {
|
||||||
|
padding: 0 3px;
|
||||||
|
font-size: 14px;
|
||||||
|
position: initial;
|
||||||
|
width: 100%;
|
||||||
|
display: table;
|
||||||
|
line-height: 26px;
|
||||||
|
height: 26px;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail li.nouse span {
|
||||||
|
color: #888;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail li.arti-main {
|
||||||
|
font-size: 16px;
|
||||||
|
padding: 3px 3px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail li span {
|
||||||
|
position: initial;
|
||||||
|
display: table-cell;
|
||||||
|
color: #fff;
|
||||||
|
font-family: YS;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail li.title {
|
||||||
|
text-align: left;
|
||||||
|
padding-left: 10px;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail li.val {
|
||||||
|
text-align: right;
|
||||||
|
padding-right: 10px;
|
||||||
|
font-family: Number;
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail:nth-child(even) {
|
||||||
|
background: rgba(0, 0, 0, 0.4);
|
||||||
|
}
|
||||||
|
.arti-detail ul.detail:nth-child(odd) {
|
||||||
|
background: rgba(50, 50, 50, 0.4);
|
||||||
|
}
|
||||||
|
.arti-detail .avatar {
|
||||||
|
position: absolute;
|
||||||
|
left: 32px;
|
||||||
|
top: 26px;
|
||||||
|
width: 38px;
|
||||||
|
height: 38px;
|
||||||
|
border-radius: 50%;
|
||||||
|
overflow: hidden;
|
||||||
|
z-index: 3;
|
||||||
|
}
|
||||||
|
.arti-detail .avatar img {
|
||||||
|
max-width: 100%;
|
||||||
|
max-height: 100%;
|
||||||
|
}
|
||||||
|
.arti-detail .arti-icon img {
|
||||||
|
width: 52px;
|
||||||
|
height: 52px;
|
||||||
|
}
|
||||||
|
/*# sourceMappingURL=artis-detail.less.map */
|
||||||
25
resources/common/tpl/artis-detail.html
Normal file
25
resources/common/tpl/artis-detail.html
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
{{set ds = $data[0]}}
|
||||||
|
{{set {_res_path,_char,_sys_res_path} = $data[1]}}
|
||||||
|
{{if ds.name && ds.main && ds.main[0] && ds.main[0]!="undefined"}}
|
||||||
|
<div class="item arti-detail">
|
||||||
|
<div class="avatar-icon">
|
||||||
|
<img src="{{_res_path}}/meta/character/{{ds.avatar}}/side.png" onerror="whenError(this)"/>
|
||||||
|
</div>
|
||||||
|
<div class="arti-icon">
|
||||||
|
<img src="{{_sys_res_path}}/genshin/logo/reliquaries/{{ds.name}}.png"/>
|
||||||
|
</div>
|
||||||
|
<div class="head">
|
||||||
|
<strong>{{ds.name}}</strong>
|
||||||
|
<span class="mark mark-{{ds.markType}}"><span>{{ds.mark}}分</span> - {{ds.markType}}</span>
|
||||||
|
</div>
|
||||||
|
<ul class="detail">
|
||||||
|
<li class="arti-main"><span class="title">{{ds.main[0]}}</span><span class="val">+{{ds.main[1]}}</span></li>
|
||||||
|
{{each ds.attrs attr}}
|
||||||
|
{{if attr[0]}}
|
||||||
|
<li class="{{ds.usefulMark[attr[0]] ? `useful`:`nouse`}}"><span class="title">{{attr[0]}}</span><span
|
||||||
|
class="val">+{{attr[1]}}</span></li>
|
||||||
|
{{/if}}
|
||||||
|
{{/each}}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
{{/if}}
|
||||||
137
resources/common/tpl/artis-detail.less
Normal file
137
resources/common/tpl/artis-detail.less
Normal file
@ -0,0 +1,137 @@
|
|||||||
|
.arti-detail {
|
||||||
|
width: 185px;
|
||||||
|
border-radius: 10px;
|
||||||
|
background: url("./cont/card-bg.png") top left repeat-x;
|
||||||
|
background-size: auto 100%;
|
||||||
|
margin: 5px;
|
||||||
|
position: relative;
|
||||||
|
box-shadow: 0 0 1px 0 #ccc, 2px 2px 4px 0 rgba(50, 50, 50, .8);
|
||||||
|
height: 205px;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.arti-icon {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
position: absolute;
|
||||||
|
left: 2px;
|
||||||
|
top: 3px;
|
||||||
|
|
||||||
|
span {
|
||||||
|
position: absolute;
|
||||||
|
right: 2px;
|
||||||
|
bottom: 0;
|
||||||
|
margin-left: 5px;
|
||||||
|
background: rgba(0, 0, 0, .5);
|
||||||
|
border-radius: 5px;
|
||||||
|
height: 18px;
|
||||||
|
line-height: 18px;
|
||||||
|
padding: 0 3px;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 12px;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.head {
|
||||||
|
color: #fff;
|
||||||
|
padding: 12px 0 8px 68px;
|
||||||
|
|
||||||
|
strong {
|
||||||
|
font-size: 15px;
|
||||||
|
display: block;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
font-font: YS;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mark {
|
||||||
|
font-family: Number, YS;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.detail {
|
||||||
|
width: 100%;
|
||||||
|
padding: 0;
|
||||||
|
position: initial;
|
||||||
|
font-family: YS;
|
||||||
|
|
||||||
|
li {
|
||||||
|
padding: 0 3px;
|
||||||
|
font-size: 14px;
|
||||||
|
position: initial;
|
||||||
|
width: 100%;
|
||||||
|
display: table;
|
||||||
|
line-height: 26px;
|
||||||
|
height: 26px;
|
||||||
|
|
||||||
|
&.nouse span {
|
||||||
|
color: #888;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.arti-main {
|
||||||
|
font-size: 16px;
|
||||||
|
padding: 3px 3px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
position: initial;
|
||||||
|
display: table-cell;
|
||||||
|
color: #fff;
|
||||||
|
font-family: YS;
|
||||||
|
|
||||||
|
|
||||||
|
&.title {
|
||||||
|
text-align: left;
|
||||||
|
padding-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.val {
|
||||||
|
text-align: right;
|
||||||
|
padding-right: 10px;
|
||||||
|
font-family: Number;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
&:nth-child(even) {
|
||||||
|
background: rgba(0, 0, 0, .4)
|
||||||
|
}
|
||||||
|
|
||||||
|
&:nth-child(odd) {
|
||||||
|
background: rgba(50, 50, 50, .4)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.avatar-icon {
|
||||||
|
position: absolute;
|
||||||
|
left: 32px;
|
||||||
|
top: 26px;
|
||||||
|
width: 38px;
|
||||||
|
height: 38px;
|
||||||
|
border-radius: 50%;
|
||||||
|
overflow: hidden;
|
||||||
|
z-index: 3;
|
||||||
|
|
||||||
|
img {
|
||||||
|
max-width: 100%;
|
||||||
|
max-height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.arti-icon img {
|
||||||
|
width: 52px;
|
||||||
|
height: 52px;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
19
resources/common/tpl/artis-item.html
Normal file
19
resources/common/tpl/artis-item.html
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
{{set ds = $data[0]}}
|
||||||
|
{{set {_res_path,_char,_sys_res_path} = $data[1]}}
|
||||||
|
|
||||||
|
<div class="item-card">
|
||||||
|
<span class="badge">
|
||||||
|
<img src="{{_sys_res_path}}/genshin/logo/side/{{ds.avatar==`旅行者`?`荧`:ds.avatar}}.png"/>
|
||||||
|
</span>
|
||||||
|
<div class="box">
|
||||||
|
{{ if ds.affix_level>1}}
|
||||||
|
<span class="item-life life{{ds.affix_level}}">
|
||||||
|
{{ds.affix_level}}
|
||||||
|
</span>
|
||||||
|
{{/if}}
|
||||||
|
<div class="item-bg bg{{ds.rarity}}"></div>
|
||||||
|
<img class="item-img" src="{{_sys_res_path}}/genshin/logo/reliquaries/{{ds.name}}.png"/>
|
||||||
|
<div class="item-desc artis-lvl">Lv.{{ds.level}}</div>
|
||||||
|
<div class="item-desc artis-name">{{ds.name}}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
0
resources/common/tpl/avatar-card.css
Normal file
0
resources/common/tpl/avatar-card.css
Normal file
15
resources/common/tpl/avatar-card.html
Normal file
15
resources/common/tpl/avatar-card.html
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
{{set avatar = $data[0]}}
|
||||||
|
{{set {_res_path,_char} = $data[1]}}
|
||||||
|
{{set _char = _char || "meta/character/"}}
|
||||||
|
|
||||||
|
<div class="item">
|
||||||
|
<div class="item-bg elem-{{avatar.element}}">
|
||||||
|
<div class="role-box char-{{avatar.name}}">
|
||||||
|
<img class="role" src="{{_res_path}}{{_char}}/{{avatar.name}}/gacha_card.png"/>
|
||||||
|
</div>
|
||||||
|
{{ if avatar.cons>0}}
|
||||||
|
<div class="role-life life{{avatar.cons}}">{{avatar.cons}}命</div>
|
||||||
|
{{/if}}
|
||||||
|
<div class="role-name">{{avatar.label || avatar.name}}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
0
resources/common/tpl/avatar-card.less
Normal file
0
resources/common/tpl/avatar-card.less
Normal file
204
resources/common/tpl/avatar-profile.css
Normal file
204
resources/common/tpl/avatar-profile.css
Normal file
@ -0,0 +1,204 @@
|
|||||||
|
.profile {
|
||||||
|
position: relative;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.profile:after {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
left: 8px;
|
||||||
|
top: 115px;
|
||||||
|
bottom: 0;
|
||||||
|
right: 8px;
|
||||||
|
box-shadow: 0 0 2px 0 #fff;
|
||||||
|
border-radius: 5px;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
.profile .main-pic {
|
||||||
|
width: 800px;
|
||||||
|
height: 500px;
|
||||||
|
background-size: contain;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
margin-left: -260px;
|
||||||
|
position: relative;
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
.profile .detail {
|
||||||
|
position: absolute;
|
||||||
|
right: 20px;
|
||||||
|
top: 20px;
|
||||||
|
color: #fff;
|
||||||
|
z-index: 3;
|
||||||
|
}
|
||||||
|
.profile .char-name {
|
||||||
|
font-size: 50px;
|
||||||
|
font-family: NZBZ;
|
||||||
|
text-shadow: 0 0 3px #000, 2px 2px 4px rgba(0, 0, 0, 0.7);
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
.profile .char-lv {
|
||||||
|
font-family: Number;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
text-shadow: 0 0 3px #000, 2px 2px 4px rgba(0, 0, 0, 0.7);
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
.profile .attr {
|
||||||
|
border-radius: 4px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.profile .detail li {
|
||||||
|
width: 300px;
|
||||||
|
font-size: 17px;
|
||||||
|
list-style: none;
|
||||||
|
padding: 0 100px 0 35px;
|
||||||
|
position: relative;
|
||||||
|
font-family: YS;
|
||||||
|
height: 32px;
|
||||||
|
line-height: 32px;
|
||||||
|
text-shadow: 0 0 1px rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
.profile .attr li i {
|
||||||
|
display: inline-block;
|
||||||
|
height: 20px;
|
||||||
|
width: 20px;
|
||||||
|
background-image: url("../../character/icon.png");
|
||||||
|
background-size: auto 20px;
|
||||||
|
position: absolute;
|
||||||
|
left: 10px;
|
||||||
|
top: 8px;
|
||||||
|
opacity: 0.9;
|
||||||
|
transform: scale(0.9);
|
||||||
|
}
|
||||||
|
.profile .i-hp {
|
||||||
|
background-position: -20px 0;
|
||||||
|
}
|
||||||
|
.profile .i-atk {
|
||||||
|
background-position: -40px 0;
|
||||||
|
}
|
||||||
|
.profile .i-def {
|
||||||
|
background-position: -60px 0;
|
||||||
|
}
|
||||||
|
.profile .i-mastery {
|
||||||
|
background-position: -80px 0;
|
||||||
|
}
|
||||||
|
.profile .i-cr {
|
||||||
|
background-position: -100px 0;
|
||||||
|
}
|
||||||
|
.profile .i-cd {
|
||||||
|
background-position: -140px 0;
|
||||||
|
}
|
||||||
|
.profile .i-re {
|
||||||
|
background-position: -120px 0;
|
||||||
|
}
|
||||||
|
.profile .i-dmg {
|
||||||
|
background-position: -160px 0;
|
||||||
|
}
|
||||||
|
.profile .detail li:nth-child(even) {
|
||||||
|
background: rgba(0, 0, 0, 0.4);
|
||||||
|
}
|
||||||
|
.profile .detail li:nth-child(odd) {
|
||||||
|
background: rgba(50, 50, 50, 0.4);
|
||||||
|
}
|
||||||
|
.profile .detail li strong {
|
||||||
|
display: inline-block;
|
||||||
|
position: absolute;
|
||||||
|
right: 85px;
|
||||||
|
text-align: right;
|
||||||
|
font-family: Number, sans-serif;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
.profile .detail li span {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
text-align: left;
|
||||||
|
width: 75px;
|
||||||
|
display: inline-block;
|
||||||
|
font-family: Number, sans-serif;
|
||||||
|
color: #90e800;
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
.profile .talent-icon {
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
padding: 5px;
|
||||||
|
display: table;
|
||||||
|
border-radius: 50%;
|
||||||
|
position: relative;
|
||||||
|
background-size: contain;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center center;
|
||||||
|
z-index: 90;
|
||||||
|
}
|
||||||
|
.profile .talent-icon img,
|
||||||
|
.profile .talent-icon .profile .talent-icon-img {
|
||||||
|
width: 46%;
|
||||||
|
height: 46%;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
margin: -22% 0 0 -23%;
|
||||||
|
background-size: contain;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
}
|
||||||
|
.profile .talent-icon span {
|
||||||
|
background: #fff;
|
||||||
|
width: 34px;
|
||||||
|
height: 26px;
|
||||||
|
line-height: 26px;
|
||||||
|
font-size: 17px;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 5px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 2px;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -15px;
|
||||||
|
color: #000;
|
||||||
|
box-shadow: 0 0 5px 0 #000;
|
||||||
|
font-family: Number;
|
||||||
|
}
|
||||||
|
.profile .talent-icon.talent-plus span {
|
||||||
|
background: #2e353e;
|
||||||
|
color: #ffdfa0;
|
||||||
|
font-weight: bold;
|
||||||
|
box-shadow: 0 0 1px 0 #d3bc8e, 1px 1px 2px 0 rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
.profile .talent-icon.talent-crown:after {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 28px;
|
||||||
|
height: 28px;
|
||||||
|
background: url("../character/imgs/crown.png") no-repeat;
|
||||||
|
background-size: contain;
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
top: 0;
|
||||||
|
margin-left: -14px;
|
||||||
|
}
|
||||||
|
.profile .char-talents {
|
||||||
|
display: flex;
|
||||||
|
width: 300px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.profile .char-cons .talent-item,
|
||||||
|
.profile .char-talents .talent-item {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
.profile .char-cons {
|
||||||
|
display: flex;
|
||||||
|
width: 250px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 5px;
|
||||||
|
left: 20px;
|
||||||
|
}
|
||||||
|
.profile .char-cons .talent-icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 0 -5px;
|
||||||
|
}
|
||||||
|
.profile .char-cons .talent-icon.off {
|
||||||
|
filter: grayscale(100%);
|
||||||
|
opacity: 0.4;
|
||||||
|
}
|
||||||
|
/*# sourceMappingURL=avatar-profile.css.map */
|
||||||
47
resources/common/tpl/avatar-profile.html
Normal file
47
resources/common/tpl/avatar-profile.html
Normal file
@ -0,0 +1,47 @@
|
|||||||
|
{{set ds = $data[0]}}
|
||||||
|
{{set {_res_path, _char, _sys_res_path, uid} = $data[1]}}
|
||||||
|
{{set {attr} = ds}}
|
||||||
|
|
||||||
|
<div class="profile">
|
||||||
|
<div class="main-pic"
|
||||||
|
style="background-image:url({{_res_path}}/meta/character/{{ds.name}}/gacha_splash.png)"></div>
|
||||||
|
<div class="detail">
|
||||||
|
<div class="char-name">{{ds.name}}</div>
|
||||||
|
<div class="char-lv">
|
||||||
|
{{if uid}}UID {{uid}} - {{/if}}
|
||||||
|
<span class="cons cons-{{ds.cons}}">{{ds.cons}}命</span> {{if ds.lv}} Lv.{{ds.lv}}{{/if}}
|
||||||
|
</div>
|
||||||
|
<div class="char-talents">
|
||||||
|
{{each ds.talentMap tName key}}
|
||||||
|
<div class="talent-item">
|
||||||
|
<div class="talent-icon
|
||||||
|
{{talent[key].level_current > talent[key].level_original ? `talent-plus`:``}}
|
||||||
|
{{talent[key].level_original == 10 ? `talent-crown`:``}}">
|
||||||
|
<div class="talent-icon-img"
|
||||||
|
style="background-image:url({{_res_path}}/meta/character/{{ds.name}}/talent_{{key}}.png)"></div>
|
||||||
|
<span>{{talent[key].level_current}}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{/each}}
|
||||||
|
</div>
|
||||||
|
<ul class="attr">
|
||||||
|
<li><i class="i-hp"></i>生命值<strong>{{attr.hp}}</strong><span>(+{{attr.hpPlus}})</span></li>
|
||||||
|
<li><i class="i-atk"></i>攻击力<strong>{{attr.atk}}</strong><span>(+{{attr.atkPlus}})</span></li>
|
||||||
|
<li><i class="i-def"></i>防御力<strong>{{attr.def}}</strong><span>(+{{attr.defPlus}})</span></li>
|
||||||
|
<li><i class="i-mastery"></i>元素精通<strong>{{attr.mastery}}</strong></li>
|
||||||
|
<li><i class="i-cr"></i>暴击率<strong>{{attr.cRate}}</strong></li>
|
||||||
|
<li><i class="i-cd"></i>暴击伤害<strong>{{attr.cDmg}}</strong></li>
|
||||||
|
<li><i class="i-re"></i>元素充能<strong>{{attr.recharge}}</strong></li>
|
||||||
|
<li><i class="i-dmg"></i>伤害加成<strong>{{attr.dmgBonus}}</strong></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="char-cons">
|
||||||
|
{{each cons con idx}}
|
||||||
|
<div class="cons-item">
|
||||||
|
<div class="talent-icon {{idx * 1 > avatar.actived_constellation_num * 1 ? 'off' : '' }}">
|
||||||
|
<img src="{{_res_path}}/meta/character/{{name}}/cons_{{idx}}.png"/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{/each}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
241
resources/common/tpl/avatar-profile.less
Normal file
241
resources/common/tpl/avatar-profile.less
Normal file
@ -0,0 +1,241 @@
|
|||||||
|
.profile {
|
||||||
|
position: relative;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
|
||||||
|
&:after {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
left: 8px;
|
||||||
|
top: 115px;
|
||||||
|
bottom: 0;
|
||||||
|
right: 8px;
|
||||||
|
box-shadow: 0 0 2px 0 #fff;
|
||||||
|
border-radius: 5px;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-pic {
|
||||||
|
width: 800px;
|
||||||
|
height: 500px;
|
||||||
|
background-size: contain;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
margin-left: -260px;
|
||||||
|
position: relative;
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail {
|
||||||
|
position: absolute;
|
||||||
|
right: 20px;
|
||||||
|
top: 20px;
|
||||||
|
color: #fff;
|
||||||
|
z-index: 3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.char-name {
|
||||||
|
font-size: 50px;
|
||||||
|
font-family: NZBZ;
|
||||||
|
text-shadow: 0 0 3px #000, 2px 2px 4px rgba(0, 0, 0, .7);
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.char-lv {
|
||||||
|
font-family: Number;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
text-shadow: 0 0 3px #000, 2px 2px 4px rgba(0, 0, 0, .7);
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.attr {
|
||||||
|
border-radius: 4px;
|
||||||
|
overflow: hidden;
|
||||||
|
background: rgba(0, 0, 0, .3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail li {
|
||||||
|
width: 300px;
|
||||||
|
font-size: 17px;
|
||||||
|
list-style: none;
|
||||||
|
padding: 0 100px 0 35px;
|
||||||
|
position: relative;
|
||||||
|
font-family: YS;
|
||||||
|
height: 32px;
|
||||||
|
line-height: 32px;
|
||||||
|
text-shadow: 0 0 1px rgba(0, 0, 0, .5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.attr li i {
|
||||||
|
display: inline-block;
|
||||||
|
height: 20px;
|
||||||
|
width: 20px;
|
||||||
|
background-image: url("../character/icon.png");
|
||||||
|
background-size: auto 20px;
|
||||||
|
position: absolute;
|
||||||
|
left: 10px;
|
||||||
|
top: 8px;
|
||||||
|
opacity: .9;
|
||||||
|
transform: scale(.9);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.i-hp {
|
||||||
|
background-position: -20px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.i-atk {
|
||||||
|
background-position: -40px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.i-def {
|
||||||
|
background-position: -60px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.i-mastery {
|
||||||
|
background-position: -80px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.i-cr {
|
||||||
|
background-position: -100px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.i-cd {
|
||||||
|
background-position: -140px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.i-re {
|
||||||
|
background-position: -120px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.i-dmg {
|
||||||
|
background-position: -160px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail li {
|
||||||
|
|
||||||
|
&:nth-child(even) {
|
||||||
|
background: rgba(0, 0, 0, .4)
|
||||||
|
}
|
||||||
|
|
||||||
|
&:nth-child(odd) {
|
||||||
|
background: rgba(50, 50, 50, .4)
|
||||||
|
}
|
||||||
|
|
||||||
|
strong {
|
||||||
|
display: inline-block;
|
||||||
|
position: absolute;
|
||||||
|
right: 85px;
|
||||||
|
text-align: right;
|
||||||
|
font-family: Number, sans-serif;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
text-align: left;
|
||||||
|
width: 75px;
|
||||||
|
display: inline-block;
|
||||||
|
font-family: Number, sans-serif;
|
||||||
|
color: #90e800;
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.talent-icon {
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
padding: 5px;
|
||||||
|
display: table;
|
||||||
|
border-radius: 50%;
|
||||||
|
position: relative;
|
||||||
|
background-size: contain;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center center;
|
||||||
|
z-index: 90;
|
||||||
|
|
||||||
|
|
||||||
|
img,
|
||||||
|
.profile .talent-icon-img {
|
||||||
|
width: 46%;
|
||||||
|
height: 46%;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
margin: -22% 0 0 -23%;
|
||||||
|
background-size: contain;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
background: #fff;
|
||||||
|
width: 34px;
|
||||||
|
height: 26px;
|
||||||
|
line-height: 26px;
|
||||||
|
font-size: 17px;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 5px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 2px;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -15px;
|
||||||
|
color: #000;
|
||||||
|
box-shadow: 0 0 5px 0 #000;
|
||||||
|
font-family: Number;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.talent-plus span {
|
||||||
|
background: #2e353e;
|
||||||
|
color: #ffdfa0;
|
||||||
|
font-weight: bold;
|
||||||
|
box-shadow: 0 0 1px 0 #d3bc8e, 1px 1px 2px 0 rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.talent-crown:after {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 28px;
|
||||||
|
height: 28px;
|
||||||
|
background: url("../../character/imgs/crown.png") no-repeat;
|
||||||
|
background-size: contain;
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
top: 0;
|
||||||
|
margin-left: -14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.char-talents {
|
||||||
|
display: flex;
|
||||||
|
width: 300px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.char-cons .talent-item,
|
||||||
|
.char-talents .talent-item {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.char-cons {
|
||||||
|
display: flex;
|
||||||
|
width: 250px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 5px;
|
||||||
|
left: 20px;
|
||||||
|
|
||||||
|
.talent-icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 0 -5px
|
||||||
|
}
|
||||||
|
|
||||||
|
.talent-icon.off {
|
||||||
|
filter: grayscale(100%);
|
||||||
|
opacity: .4;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
113
resources/common/tpl/item-card.css
Normal file
113
resources/common/tpl/item-card.css
Normal file
@ -0,0 +1,113 @@
|
|||||||
|
.item-card {
|
||||||
|
width: 52px;
|
||||||
|
margin: 0px 0 5px 7px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.item-card .badge {
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 5px;
|
||||||
|
position: relative;
|
||||||
|
background: #e9e5dc;
|
||||||
|
box-shadow: 0 2px 6px 0 rgba(132, 93, 90, 0.3);
|
||||||
|
}
|
||||||
|
.item-card .badge img {
|
||||||
|
width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
background-size: 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
/*filter: contrast(95%);*/
|
||||||
|
}
|
||||||
|
.item-card .bg1 {
|
||||||
|
background-image: url("imgs/bg1.png");
|
||||||
|
width: 100%;
|
||||||
|
height: 70px;
|
||||||
|
background-size: 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
}
|
||||||
|
.item-card .bg2 {
|
||||||
|
background-image: url("imgs/bg2.png");
|
||||||
|
width: 100%;
|
||||||
|
height: 70px;
|
||||||
|
background-size: 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
}
|
||||||
|
.item-card .bg3 {
|
||||||
|
background-image: url("imgs/bg3.png");
|
||||||
|
width: 100%;
|
||||||
|
height: 70px;
|
||||||
|
background-size: 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
}
|
||||||
|
.item-card .bg4 {
|
||||||
|
background-image: url("imgs/bg4.png");
|
||||||
|
width: 100%;
|
||||||
|
height: 70px;
|
||||||
|
background-size: 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
}
|
||||||
|
.item-card .bg5 {
|
||||||
|
background-image: url("imgs/bg5.png");
|
||||||
|
width: 100%;
|
||||||
|
height: 70px;
|
||||||
|
background-size: 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
}
|
||||||
|
.item-card .box:after {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
width: 15px;
|
||||||
|
right: 0;
|
||||||
|
bottom: 15px;
|
||||||
|
}
|
||||||
|
.item-card .box .desc {
|
||||||
|
font-weight: 500;
|
||||||
|
text-align: center;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
background: #e9e5dc;
|
||||||
|
width: 100%;
|
||||||
|
height: 16px;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 16px;
|
||||||
|
font-family: Number;
|
||||||
|
}
|
||||||
|
.item-card .box .name {
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
margin-top: 5px;
|
||||||
|
font-weight: 500;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.item-card .life {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
left: 0px;
|
||||||
|
z-index: 9;
|
||||||
|
font-size: 13px;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 2px;
|
||||||
|
padding: 1px 4px;
|
||||||
|
border-radius: 3px;
|
||||||
|
font-family: "tttgbnumber";
|
||||||
|
}
|
||||||
|
.item-card .life1 {
|
||||||
|
background-color: #62a8ea;
|
||||||
|
}
|
||||||
|
.item-card .life2 {
|
||||||
|
background-color: #62a8ea;
|
||||||
|
}
|
||||||
|
.item-card .life3 {
|
||||||
|
background-color: #62a8ea;
|
||||||
|
}
|
||||||
|
.item-card .life4 {
|
||||||
|
background-color: #ff5722;
|
||||||
|
}
|
||||||
|
.item-card .life5 {
|
||||||
|
background-color: #ff5722;
|
||||||
|
}
|
||||||
|
/*# sourceMappingURL=item-card.less.map */
|
||||||
122
resources/common/tpl/item-card.less
Normal file
122
resources/common/tpl/item-card.less
Normal file
@ -0,0 +1,122 @@
|
|||||||
|
|
||||||
|
.item-card {
|
||||||
|
width: 66px;
|
||||||
|
margin: 4px;
|
||||||
|
position: relative;
|
||||||
|
border-radius: 5px;
|
||||||
|
|
||||||
|
|
||||||
|
.badge {
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: block;
|
||||||
|
width: 26px;
|
||||||
|
height: 26px;
|
||||||
|
position: absolute;
|
||||||
|
right: -4px;
|
||||||
|
top: -4px;
|
||||||
|
background: #e9e5dc;
|
||||||
|
box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.8), 2px 2px 2px rgba(50, 50, 50, .5);
|
||||||
|
z-index: 10;
|
||||||
|
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 140%;
|
||||||
|
left: -27%;
|
||||||
|
top: -45%;
|
||||||
|
overflow: hidden;
|
||||||
|
background-size: 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-bg {
|
||||||
|
width: 100%;
|
||||||
|
padding: 100% 0 0;
|
||||||
|
background-size: cover;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
each(range(5), {
|
||||||
|
.bg@{value} {
|
||||||
|
background-image: url("./item/bg@{value}.png");
|
||||||
|
border-radius: 5px 5px 15px 0;
|
||||||
|
}
|
||||||
|
.bg-@{value} {
|
||||||
|
background-image: url("./item/bg@{value}.png");
|
||||||
|
border-radius: 5px 5px 15px 0;
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
.box {
|
||||||
|
border-radius: 5px;
|
||||||
|
overflow: hidden;
|
||||||
|
background: #e9e5dc;
|
||||||
|
|
||||||
|
.item-desc {
|
||||||
|
display: block;
|
||||||
|
font-weight: 500;
|
||||||
|
text-align: center;
|
||||||
|
bottom: 0;
|
||||||
|
background: #e9e5dc;
|
||||||
|
width: 100%;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 16px;
|
||||||
|
font-family: Number, YS;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 0 3px;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
padding-bottom: 2px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.name {
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
margin-top: 5px;
|
||||||
|
font-weight: 500;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-img {
|
||||||
|
width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
background-size: 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-life {
|
||||||
|
position: absolute;
|
||||||
|
top: 0px;
|
||||||
|
left: 0px;
|
||||||
|
z-index: 9;
|
||||||
|
font-size: 13px;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 2px;
|
||||||
|
padding: 1px 4px;
|
||||||
|
border-radius: 3px;
|
||||||
|
font-family: "tttgbnumber";
|
||||||
|
}
|
||||||
|
|
||||||
|
.life(@idx, @color) {
|
||||||
|
.life@{idx} {
|
||||||
|
background-color: @color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.life(1, #62a8ea);
|
||||||
|
.life(2, #62a8ea);
|
||||||
|
.life(3, #62a8ea);
|
||||||
|
.life(4, #ff5722);
|
||||||
|
.life(5, #ff5722);
|
||||||
|
}
|
||||||
|
|
||||||
17
resources/common/tpl/weapon-item.html
Normal file
17
resources/common/tpl/weapon-item.html
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
{{ set weapon = $data[0] }}
|
||||||
|
{{ set {_sys_res_path} = $data[1] }}
|
||||||
|
|
||||||
|
<div class="item-card">
|
||||||
|
<span class="badge">
|
||||||
|
<img src="{{_sys_res_path}}/genshin/logo/side/{{weapon.avatar==`旅行者`?`荧`:weapon.avatar}}.png"/>
|
||||||
|
</span>
|
||||||
|
<div class="box">
|
||||||
|
{{ if weapon.affix_level>1}}
|
||||||
|
<span class="item-life life{{weapon.affix_level}}">{{weapon.affix_level}}</span>
|
||||||
|
{{/if}}
|
||||||
|
<div class="item-bg bg{{weapon.rarity}}"></div>
|
||||||
|
<img class="item-img" src="{{_sys_res_path}}genshin/logo/weapon/{{weapon.name}}.png"/>
|
||||||
|
<div class="item-desc weapon-lv">Lv.{{weapon.level}}</div>
|
||||||
|
<div class="item-desc weapon-name">{{weapon.showName || weapon.name}}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
51
resources/help/help-list.js
Normal file
51
resources/help/help-list.js
Normal file
@ -0,0 +1,51 @@
|
|||||||
|
export const helpCfg = [{
|
||||||
|
"group": "信息查询",
|
||||||
|
"list": [{
|
||||||
|
"icon": 61,
|
||||||
|
"title": "#角色图鉴",
|
||||||
|
"desc": "目前已知原神角色概况"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon": 66,
|
||||||
|
"title": "#武器图鉴",
|
||||||
|
"desc": "目前已知原神武器概况"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon": 71,
|
||||||
|
"title": "#食谱图鉴",
|
||||||
|
"desc": "目前已知原神食谱概况"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon": 74,
|
||||||
|
"title": "#怪物图鉴",
|
||||||
|
"desc": "目前已知原神怪物概况"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon": 63,
|
||||||
|
"title": "#圣遗物图鉴",
|
||||||
|
"desc": "目前已知原神圣遗物概况"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon": 14,
|
||||||
|
"title": "#体力",
|
||||||
|
"desc": "重写原有的查询当前米游社体力"
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},{
|
||||||
|
"group": "管理命令，仅管理员可用",
|
||||||
|
"auth": "master",
|
||||||
|
"list": [{
|
||||||
|
"icon": 57,
|
||||||
|
"title": "#图鉴设置",
|
||||||
|
"desc": "例如#图鉴设置体力开启（关闭）"
|
||||||
|
},{
|
||||||
|
"icon": 58,
|
||||||
|
"title": "#图鉴更新",
|
||||||
|
"desc": "用于获取最新的图鉴数据图"
|
||||||
|
},{
|
||||||
|
"icon": 60,
|
||||||
|
"title": "#图鉴插件更新",
|
||||||
|
"desc": "用于获取最新的插件包数据"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}]
|
||||||
BIN
resources/help/icon.png
Normal file
BIN
resources/help/icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 MiB |
114
resources/help/index.css
Normal file
114
resources/help/index.css
Normal file
@ -0,0 +1,114 @@
|
|||||||
|
body {
|
||||||
|
transform: scale(1);
|
||||||
|
width: 800px;
|
||||||
|
background: url("../common/theme/bg-01.jpg");
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
background: url(../common/theme/main-01.png) top left no-repeat;
|
||||||
|
background-size: 100% auto;
|
||||||
|
width: 800px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label {
|
||||||
|
font-family: Number, "微软雅黑", sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
.head-box {
|
||||||
|
margin: 60px 0 0 0;
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.head-box .title {
|
||||||
|
font-size: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont-box {
|
||||||
|
border-radius: 15px;
|
||||||
|
margin-top: 20px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
padding: 5px 15px;
|
||||||
|
overflow: hidden;
|
||||||
|
box-shadow: 0 5px 10px 0 rgb(0 0 0 / 15%);
|
||||||
|
position: relative;
|
||||||
|
background: rgba(43, 52, 61, 0.8);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.help-group {
|
||||||
|
color: #ceb78b;
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: bold;
|
||||||
|
padding: 8px 0 5px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.help-table {
|
||||||
|
text-align: center;
|
||||||
|
border-collapse: collapse;
|
||||||
|
margin: 5px -10px -10px -15px;
|
||||||
|
border-radius: 0 0 10px 10px;
|
||||||
|
display: table;
|
||||||
|
overflow: hidden;
|
||||||
|
width: calc(100% + 30px);
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.help-table .tr {
|
||||||
|
display: table-row;
|
||||||
|
}
|
||||||
|
|
||||||
|
.help-table .td,
|
||||||
|
.help-table .th {
|
||||||
|
font-size: 14px;
|
||||||
|
display: table-cell;
|
||||||
|
box-shadow: 0 0 1px 0 #888 inset;
|
||||||
|
padding: 12px 0 12px 50px;
|
||||||
|
line-height: 24px;
|
||||||
|
position: relative;
|
||||||
|
width: 33.33%;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.help-table .tr:nth-child(odd) {
|
||||||
|
background: rgba(34, 41, 51, .6)
|
||||||
|
}
|
||||||
|
|
||||||
|
.help-table .tr:nth-child(even) {
|
||||||
|
background: rgba(34, 41, 51, .3)
|
||||||
|
}
|
||||||
|
|
||||||
|
.help-table .tr:last-child .td {
|
||||||
|
padding-bottom: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.help-table .th {
|
||||||
|
background: rgba(34, 41, 51, .5)
|
||||||
|
}
|
||||||
|
|
||||||
|
.help-icon {
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
background: url("icon.png") 0 0 no-repeat;
|
||||||
|
background-size: 500px 500px;
|
||||||
|
border-radius: 5px;
|
||||||
|
left: 6px;
|
||||||
|
top: 12px;
|
||||||
|
transform: scale(0.85);
|
||||||
|
}
|
||||||
|
|
||||||
|
.help-title {
|
||||||
|
display: block;
|
||||||
|
color: #d3bc8e;
|
||||||
|
font-size: 16px;
|
||||||
|
line-height: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.help-desc {
|
||||||
|
display: block;
|
||||||
|
font-size: 13px;
|
||||||
|
line-height: 18px;
|
||||||
|
color: #eee;
|
||||||
|
}
|
||||||
|
|
||||||
35
resources/help/index.html
Normal file
35
resources/help/index.html
Normal file
@ -0,0 +1,35 @@
|
|||||||
|
{{extend defaultLayout}}
|
||||||
|
|
||||||
|
{{block 'css'}}
|
||||||
|
<link rel="stylesheet" type="text/css" href="{{_res_path}}/help/index.css"/>
|
||||||
|
{{/block}}
|
||||||
|
|
||||||
|
{{block 'main'}}
|
||||||
|
<div class="info_box">
|
||||||
|
<div class="head-box type{{bgType}}">
|
||||||
|
<div class="title">使用帮助</div>
|
||||||
|
<div class="label">Yunzai-Bot & xiaoyao-cvs-Plugin</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{{each helpCfg helpGroup}}
|
||||||
|
<div class="cont-box">
|
||||||
|
<div class="help-group">{{helpGroup.group}}</div>
|
||||||
|
<div class="help-table">
|
||||||
|
{{each helpGroup.list help idx}}
|
||||||
|
{{if idx%3 == 0}}
|
||||||
|
<div class="tr">
|
||||||
|
{{/if}}
|
||||||
|
<div class="td">
|
||||||
|
<span class="help-icon" style="{{help.css}}"></span>
|
||||||
|
<strong class="help-title">{{help.title}}</strong>
|
||||||
|
<span class="help-desc">{{help.desc}}</span>
|
||||||
|
</div>
|
||||||
|
{{if idx%3 ==2 || idx == helpGroup.list.length -1}}
|
||||||
|
</div>
|
||||||
|
{{/if}}
|
||||||
|
{{/each}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{/each}}
|
||||||
|
{{/block}}
|
||||||
71
resources/help/version-info.css
Normal file
71
resources/help/version-info.css
Normal file
@ -0,0 +1,71 @@
|
|||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #1e1f20;
|
||||||
|
font-family: Number, YS2;
|
||||||
|
transform: scale(1.3);
|
||||||
|
transform-origin: 0 0;
|
||||||
|
width: 520px;
|
||||||
|
}
|
||||||
|
.container {
|
||||||
|
width: 520px;
|
||||||
|
padding: 10px 0 10px 0;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
.log-cont {
|
||||||
|
background-size: cover;
|
||||||
|
margin: 5px 15px 5px 10px;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
.log-cont .cont {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
.log-cont .cont-title {
|
||||||
|
font-size: 16px;
|
||||||
|
padding: 10px 20px 6px;
|
||||||
|
}
|
||||||
|
.log-cont .cont-title.current-version {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
.log-cont .cont-body {
|
||||||
|
font-family: Number, YS2;
|
||||||
|
}
|
||||||
|
.log-cont ul {
|
||||||
|
font-size: 14px;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
.log-cont ul li {
|
||||||
|
margin: 3px 0;
|
||||||
|
}
|
||||||
|
.log-cont ul.sub-log-ul li {
|
||||||
|
margin: 1px 0;
|
||||||
|
}
|
||||||
|
.log-cont .cmd {
|
||||||
|
font-family: Number, YS;
|
||||||
|
color: #d3bc8e;
|
||||||
|
display: inline-block;
|
||||||
|
border-radius: 3px;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
padding: 0 3px;
|
||||||
|
margin: 1px 3px;
|
||||||
|
}
|
||||||
|
.log-cont .new {
|
||||||
|
display: inline-block;
|
||||||
|
width: 18px;
|
||||||
|
margin: 0 -3px 0 1px;
|
||||||
|
}
|
||||||
|
.log-cont .new:before {
|
||||||
|
content: "NEW";
|
||||||
|
font-family: Number;
|
||||||
|
display: inline-block;
|
||||||
|
transform: scale(0.6);
|
||||||
|
transform-origin: 0 0;
|
||||||
|
color: #d3bc8e;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
/*# sourceMappingURL=version-info.css.map */
|
||||||
35
resources/help/version-info.html
Normal file
35
resources/help/version-info.html
Normal file
@ -0,0 +1,35 @@
|
|||||||
|
{{extend elemLayout}}
|
||||||
|
|
||||||
|
{{block 'css'}}
|
||||||
|
<link rel="stylesheet" type="text/css" href="{{_res_path}}/help/version-info.css"/>
|
||||||
|
{{/block}}
|
||||||
|
|
||||||
|
{{block 'main'}}
|
||||||
|
{{each changelogs ds idx}}
|
||||||
|
<div class="hydro-bg log-cont">
|
||||||
|
<div class="cont">
|
||||||
|
{{if idx === 0 }}
|
||||||
|
<div class="cont-title current-version">当前版本 {{ds.version}}</div>
|
||||||
|
{{else}}
|
||||||
|
<div class="cont-title">喵喵版本 {{ds.version}}</div>
|
||||||
|
{{/if}}
|
||||||
|
<div class="cont-body">
|
||||||
|
<ul class="log-ul">
|
||||||
|
{{each ds.logs log}}
|
||||||
|
<li>
|
||||||
|
<p>{{@log.title}}</p>
|
||||||
|
{{if log.logs.length > 0}}
|
||||||
|
<ul class="sub-log-ul">
|
||||||
|
{{each log.logs ls}}
|
||||||
|
<li>{{@ls}}</li>
|
||||||
|
{{/each}}
|
||||||
|
</ul>
|
||||||
|
{{/if}}
|
||||||
|
</li>
|
||||||
|
{{/each}}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{/each}}
|
||||||
|
{{/block}}
|
||||||
90
resources/help/version-info.less
Normal file
90
resources/help/version-info.less
Normal file
@ -0,0 +1,90 @@
|
|||||||
|
.linear-bg(@color) {
|
||||||
|
background-image: linear-gradient(to right, @color, @color 80%, fade(@color, 0) 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #1e1f20;
|
||||||
|
font-family: Number, YS2;
|
||||||
|
transform: scale(1.3);
|
||||||
|
transform-origin: 0 0;
|
||||||
|
width: 520px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
width: 520px;
|
||||||
|
padding: 10px 0 10px 0;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.log-cont {
|
||||||
|
background-size: cover;
|
||||||
|
margin: 5px 15px 5px 10px;
|
||||||
|
border-radius: 10px;
|
||||||
|
|
||||||
|
.cont {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont-title {
|
||||||
|
font-size: 16px;
|
||||||
|
padding: 10px 20px 6px;
|
||||||
|
|
||||||
|
&.current-version {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont-body {
|
||||||
|
font-family: Number, YS2;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
font-size: 14px;
|
||||||
|
padding-left: 20px;
|
||||||
|
|
||||||
|
li {
|
||||||
|
margin: 3px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.sub-log-ul {
|
||||||
|
li {
|
||||||
|
margin: 1px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.cmd {
|
||||||
|
font-family: Number, YS;
|
||||||
|
color: #d3bc8e;
|
||||||
|
display: inline-block;
|
||||||
|
border-radius: 3px;
|
||||||
|
background: rgba(0, 0, 0, 0.5);
|
||||||
|
padding: 0 3px;
|
||||||
|
margin: 1px 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.new {
|
||||||
|
display: inline-block;
|
||||||
|
width: 18px;
|
||||||
|
margin: 0 -3px 0 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.new:before {
|
||||||
|
content: "NEW";
|
||||||
|
font-family: Number;
|
||||||
|
display: inline-block;
|
||||||
|
transform: scale(0.6);
|
||||||
|
transform-origin: 0 0;
|
||||||
|
color: #d3bc8e;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user