update data

new bundle
Merge pull request #230 from wwhyes/master
2026-04-16 21:02:42 +08:00 · 2021-09-08 22:24:27 +08:00 · 2021-09-08 21:38:36 +08:00 · 2021-09-08 21:37:52 +08:00 · 2021-09-08 21:37:36 +08:00 · 2021-09-08 21:24:41 +08:00
47 changed files with 18956 additions and 1282 deletions
--- a/.github/workflows/node.js.yml
+++ b/.github/workflows/node.js.yml
@@ -0,0 +1,31 @@
 # This workflow will do a clean install of node dependencies, cache/restore them, build the source code and run tests across different versions of node
 # For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
 name: Node.js CI
 on:
  push:
    branches: [ master ]
  pull_request:
    branches: [ master ]
 jobs:
  build:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        node-version: [14.x, 16.x]
        # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
    steps:
    - uses: actions/checkout@v2
    - name: Use Node.js ${{ matrix.node-version }}
      uses: actions/setup-node@v2
      with:
        node-version: ${{ matrix.node-version }}
        cache: 'npm'
    - run: npm install
    - run: npm run build --if-present
    - run: npm test
--- a/.gitignore
+++ b/.gitignore
@@ -103,4 +103,8 @@ dist
 # TernJS port file
 .tern-port
-utils/xlsxTransform-*
+utils/xlsxTransform-*
 /.idea
 __localStorage.json
--- a/.vscode/launch.json
+++ b/.vscode/launch.json
@@ -22,6 +22,15 @@
            "skipFiles": [
                "<node_internals>/**"
            ]
-        }
+        },
        {
            "name": "Attach by Process ID",
            "processId": "${command:PickProcess}",
            "request": "attach",
            "skipFiles": [
                "<node_internals>/**"
            ],
            "type": "node"
        },
    ]
 }
--- a/README-zh_CN.md
+++ b/README-zh_CN.md
@@ -0,0 +1,54 @@
 # lifeRestart
 <a href="https://discord.gg/U3qrf49NMQ"><img src="https://img.shields.io/discord/883382868427014255?color=%23FEE75C&label=Discord&logo=discord&logoColor=white&style=for-the-badge" /></a>
 [English](./README.md) | 简体中文
 ## 简介
 - Game Life Restart
 ## 使用
 ### 网页版
 1. 下载项目代码。
 ```bash
 git clone https://github.com/VickScarlet/lifeRestart.git my-project
 cd my-project
 ```
 2. 进入目录安装依赖。
 ```bash
 yarn install
 ```
 或者
 ```bash
 npm install
 ```
 3. 启动本地服务器。
 ```bash
 yarn dev
 ```
 或者
 ```bash
 npm run dev
 ```
 4. 启动完成后会自动打开浏览器访问 [http://localhost:8081/view/index.html](http://localhost:8081/view/index.html)。
 ### 控制台版本
 ```bash
 node repl
 ```
 > 更多信息请参考 [官网文档](https://liferestart.syaro.io/)。
--- a/README.md
+++ b/README.md
@@ -1,2 +1,54 @@
 # lifeRestart
-Game Life Restart
+
 <a href="https://discord.gg/U3qrf49NMQ"><img src="https://img.shields.io/discord/883382868427014255?color=%23FEE75C&label=Discord&logo=discord&logoColor=white&style=for-the-badge" /></a>
 English | [简体中文](./README-zh_CN.md)
 ## Introduction
 - Game Life Restart
 ## Usage
 ### Web Version
 1. Clone project code.
 ```bash
 git clone git@github.com:VickScarlet/lifeRestart.git my-project
 cd my-project
 ```
 2. Installation dependence.
 ```bash
 yarn install
 ```
 Or
 ```bash
 npm install
 ```
 3. Start local server.
 ```bash
 yarn dev
 ```
 Or
 ```bash
 npm run dev
 ```
 4. After the startup is complete, will automatically open a browser and visit [http://localhost:8081/view/index.html](http://localhost:8081/view/index.html).
 ### Command Line Version
 ```bash
 node repl
 ```
 > More instructions at [documentation](https://liferestart.syaro.io/)。
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -2,7 +2,7 @@
 <html lang="{{ site.lang | default: "en-US" }}">
  <head>
    <meta charset="UTF-8">
-
+    <script data-ad-client="ca-pub-9857163863537600" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
 {% seo %}
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link rel="preload" href="https://fonts.googleapis.com/css?family=Open+Sans:400,700&display=swap" as="style" type="text/css" crossorigin>
@@ -19,6 +19,7 @@
      <h1 class="project-name">{{ page.title | default: site.title | default: site.github.repository_name }}</h1>
      <h2 class="project-tagline">{{ page.description | default: site.description | default: site.github.project_tagline }}</h2>
      <a href="/view/" class="btn">RESTART</a>
      <a href="/view/test.html" class="btn">Source Version</a>
      {% if site.github.is_project_page %}
        <a href="{{ site.github.repository_url }}" class="btn">View on GitHub</a>
      {% endif %}
--- a/data/age.csv
+++ b/data/age.csv
--- a/data/age.json
+++ b/data/age.json
--- a/data/age.xlsx
+++ b/data/age.xlsx
--- a/data/events.csv
+++ b/data/events.csv
--- a/data/events.json
+++ b/data/events.json
--- a/data/events.xlsx
+++ b/data/events.xlsx
--- a/data/specialthanks.json
+++ b/data/specialthanks.json
--- a/data/specialthanks.xlsx
+++ b/data/specialthanks.xlsx
--- a/data/talents.csv
+++ b/data/talents.csv
@@ -0,0 +1,133 @@
 $id,name,description,condition,grade,status,effect:SPR,effect:MNY,effect:CHR,effect:STR,effect:INT,exclusive[],exclusive[],exclusive[],exclusive[],exclusive[],exclusive[]
 序号,天赋名,括号中的内容,触发条件,稀有度,初始可用属性点,额外快乐,额外家境,额外颜值,额外体质,额外智力,互斥天赋,互斥天赋,互斥天赋,互斥天赋,互斥天赋,互斥天赋
 1001,随身玉佩,或许有护佑作用,,0,,,,,,,,,,,,
 1002,红肚兜,小时候死亡率降低,,0,,,,,,,,,,,,
 1003,生而为男,性别一定为男,,1,,,,,,,1004,1025,1024,1113,,
 1004,生而为女,性别一定为女,,1,,,,,,,1003,1024,1025,,,
 1005,动漫高手,入宅的可能性翻6倍,,2,,,,,,,,,,,,
 1006,乐天派,快乐+1,,0,,1,,,,,,,,,,
 1007,天赋异禀,初始可用属性点+2,,1,2,,,,,,,,,,,
 1008,天生抑郁,快乐-3,,0,,-3,,,,,,,,,,
 1009,网络巨魔,快乐+2,,1,,2,,,,,,,,,,
 1010,天龙人,你拥有北京户口,,2,,,,,,,1012,1013,1014,,,
 1011,独生子女,你没有兄弟姐妹,,0,,,,,,,,,,,,
 1012,乡间微风,你出生在农村,,0,,,,,,,1010,1013,1014,,,
 1013,城中高楼,你出生在城市,,0,,,,,,,1010,1012,1014,,,
 1014,美籍华人,你有美国国籍,,2,,,3,,,,1010,1012,1013,,,
 1015,家中老大,你最受父母宠爱,,1,,,,,,,,,,,,
 1016,水性良好,不会被淹死,,0,,,,,,,,,,,,
 1017,先天免疫,你不会得艾滋病,,0,,,,,,,,,,,,
 1018,人类进化,所有属性+1,,2,,1,1,1,1,1,,,,,,
 1019,超凡,初始可用属性点+4,,2,4,,,,,,,,,,,
 1020,父母美貌,颜值+2,,1,,,,2,,,,,,,,
 1021,红颜薄命,颜值+2，体质-2,,0,,,,2,-2,,,,,,,
 1022,属蛇,不会被蛇咬死,,0,,,,,,,,,,,,
 1023,半神,所有属性+2,,3,,2,2,2,2,2,,,,,,
 1024,人中龙凤,天生双重性别,,2,,,,,,,1003,1004,1025,,,
 1025,阴阳之外,天生无性别,,2,,,,,,,1003,1024,1004,1113,,
 1026,彩虹之下,可能和同性交往,,0,,,,,,,1113,,,,,
 1027,斩情证道,终生不恋爱结婚,,1,,,,,,,1113,,,,,
 1028,桃花连连,恋爱机会提升,,0,,,,,,,,,,,,
 1029,平安童年,12岁前父母都健在,,1,,,,,,,,,,,,
 1030,宠物大师,宠物不会意外死亡,,0,,,,,,,,,,,,
 1031,天生残疾,体质-2,,0,,,,,-2,,,,,,,
 1032,早产儿,所有属性-1,,0,,-1,-1,-1,-1,-1,,,,,,
 1033,十死无生,体质-10,,0,,,,,-10,,,,,,,
 1034,家运不顺,家境-2,,0,,,-2,,,,,,,,,
 1035,头着地,智力-2,,0,,,,,,-2,,,,,,
 1036,胎教,智力+1,,0,,,,,,1,,,,,,
 1037,班中红人,和同学容易处好关系,,0,,,,,,,,,,,,
 1038,骑士,能轻松学会骑车,,0,,,,,,,,,,,,
 1039,永远的神,电竞天才,,1,,,,,,,,,,,,
 1040,戒律,赌毒不沾,,0,,,,,,,,,,,,
 1041,丁克,不生孩子,,1,,,,,,,1113,,,,,
 1042,少数民族,高考+5分,,0,,,,,,,,,,,,
 1043,老司机,你和家人不会发生车祸,,0,,,,,,,,,,,,
 1044,低压,你的家人不会心脏病,,0,,,,,,,,,,,,
 1045,战功,你退伍后会当官,,0,,,,,,,,,,,,
 1046,不孕不育,你生不出孩子,,1,,,,,,,1113,,,,,
 1047,白头偕老,爱人至少能活到70岁,,1,,,,,,,,,,,,
 1048,神秘的小盒子,100岁时才能开启,,3,,,,,,,,,,,,
 1049,三十而立,30岁时家境+2,AGE?[30],0,,,2,,,,,,,,,
 1050,四十不惑,40岁时智力+2,AGE?[40],0,,,,,,2,,,,,,
 1051,知天命,50岁时智力、快乐+1,AGE?[50],0,,1,,,,1,,,,,,
 1052,耳顺,60岁时快乐+2,AGE?[60],0,,2,,,,,,,,,,
 1053,从心所欲,70岁时快乐+3,AGE?[70],0,,3,,,,,,,,,,
 1054,老当益壮,60岁时体质+2,AGE?[60],1,,,,,2,,,,,,,
 1055,鹤发童颜,70岁时颜值+3,AGE?[70],0,,,,3,,,,,,,,
 1056,学前启蒙,5岁时智力+2,AGE?[5],1,,,,,,2,,,,,,
 1057,十八变,18岁时颜值+2,AGE?[18],1,,,,2,,,,,,,,
 1058,迟来之财,90岁时家境+4,AGE?[90],0,,,4,,,,,,,,,
 1059,理财达人,30、40、50岁时家境+1,"AGE?[30,40,50]",0,,,1,,,,,,,,,
 1060,成熟,12、18岁时智力+1,"AGE?[12,18]",1,,,,,,1,,,,,,
 1061,形象管理,16、24岁时颜值+1,"AGE?[16,24]",1,,,,1,,,,,,,,
 1062,成年礼,18岁时快乐+1,AGE?[18],0,,1,,,,,,,,,,
 1063,开光之胎,初始可用属性点+1,,0,1,,,,,,,,,,,
 1064,天命,初始可用属性点+8,,3,8,,,,,,,,,,,
 1065,祖传药丸,功能不明,,1,,,,,,,,,,,,
 1066,精准扶贫,家境为0时家境+1,(MNY<1)&(MNY>-1),0,,,1,,,,,,,,,
 1067,乐天派,快乐为0时快乐+1,(SPR<1)&(SPR>-1),1,,1,,,,,,,,,,
 1068,命悬一线,体质为0时体质+1,(STR<1)&(STR>-1),0,,,,,1,,,,,,,
 1069,智可生财,若20岁时智力>8，家境+2,(AGE?[20])&(INT>8),0,,,2,,,,,,,,,
 1070,舔狗甚多,若20岁时颜值>8，快乐+2,(AGE?[20])&(CHR>8),0,,2,,,,,,,,,,
 1071,保胎丸,你不会胎死腹中,,0,,,,,,,,,,,,
 1072,白化病,你不会遭遇枪击,,0,,,,,,,,,,,,
 1073,佛宗,考上哈佛大学的几率提高,,0,,,,,,,,,,,,
 1074,悟道,智力>10时快乐+3,INT>10,1,,3,,,,,,,,,,
 1075,驻颜,体质>10时颜值+3,STR>10,0,,,,3,,,,,,,,
 1076,界限突破,体质>10时快乐+3,STR>10,1,,3,,,,,,,,,,
 1077,倾城,颜值>10时快乐+3,CHR>10,1,,3,,,,,,,,,,
 1078,训练有方,智力>10时体质+3,INT>10,0,,,,,3,,,,,,,
 1079,相由心生,智力>10时颜值+3,INT>10,0,,,,3,,,,,,,,
 1080,智多鑫,智力>10时家境+3,INT>10,0,,,3,,,,,,,,,
 1081,灵光,快乐>10时其他属性+1,SPR>10,0,,,1,1,1,1,,,,,,
 1082,天启,快乐>10时其他属性+2,SPR>10,1,,,2,2,2,2,,,,,,
 1083,神谕,快乐>10时其他属性+3,SPR>10,2,,,3,3,3,3,,,,,,
 1084,献祭,初始可用属性点-2，快乐+2,,0,-2,2,,,,,1122,,,,,
 1085,幸运儿,初始可用属性点-3，快乐+5,,1,-3,5,,,,,1122,,,,,
 1086,挑战者,初始可用点-10,,0,-10,,,,,,1122,,,,,
 1087,你不懂,家境>10时快乐+3,MNY>10,1,,3,,,,,,,,,,
 1088,整容,家境>10时颜值+3,MNY>10,0,,,,3,,,,,,,,
 1089,钻石健身卡,家境>10时体质+3,MNY>10,0,,,,,3,,,,,,,
 1090,身残志坚,体质<0时其他属性+1,STR<0,0,,1,1,1,,1,,,,,,
 1091,活死人,体质<-1时其他属性+2,STR<0,1,,2,2,2,,2,,,,,,
 1092,开一扇窗,颜值<0时其他属性+1,CHR<0,0,,1,1,,1,1,,,,,,
 1093,大额头,颜值-2，智力+2,,0,,,,-2,,2,,,,,,
 1094,痘痘脸,颜值-1,,0,,,,-1,,,,,,,,
 1095,潜能,家境<0时其他属性+1,MNY<0,0,,1,,1,1,1,,,,,,
 1096,哀兵,快乐<0时其他属性+1,SPR<0,0,,,1,1,1,1,,,,,,
 1097,苦痛侍僧,快乐<-1时其他属性+2,SPR<-1,1,,,2,2,2,2,,,,,,
 1098,觉醒,家境<-1时其他属性+2,MNY<-1,1,,2,,2,2,2,,,,,,
 1099,抖M,家境-2，快乐+2,,0,,2,-2,,,,,,,,,
 1100,海的女儿,颜值-2，初始可用属性点+1,,0,1,,,-2,,,,,,,,
 1101,进阶,所有属性>5时，所有属性+1,(SPR>5)&(MNY>5)&(CHR>5)&(STR>5)&(INT>5),0,,1,1,1,1,1,,,,,,
 1102,超进化,所有属性>5时，所有属性+2,(SPR>5)&(MNY>5)&(CHR>5)&(STR>5)&(INT>5),1,,2,2,2,2,2,,,,,,
 1103,白色胶囊,你10岁时无事发生,AGE?[10],0,,,,,,,,,,,,
 1104,紫色胶囊,跳过你的40~50岁,"AGE?[40,41,42,43,44,45,46,47,48,49,50]",2,,,,,,,,,,,,
 1105,蓝色胶囊,你20、30岁时无事发生,"AGE?[20,30]",1,,,,,,,,,,,,
 1106,健康饮食,你不吃洋快餐,,0,,,,,,,,,,,,
 1107,不想罢了,你不会上清华大学,,0,,,,,,,,,,,,
 1108,挑衅,你喜欢没事找事,,0,,,,,,,,,,,,
 1109,旅行者,你喜欢旅游,,0,,,,,,,,,,,,
 1110,水仙,你比较自恋,,0,,,,,,,,,,,,
 1111,缺一门,无效果,,0,,,,,,,,,,,,
 1112,异界来客,你可能听到一些绝密消息,,2,,,,,,,,,,,,
 1113,三胎人生,你尽可能生三胎,,1,,,,,,,1003,1025,1026,1027,1041,1046
 1114,橙色胶囊,跳过你的60~90岁,"AGE?[60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90]",3,,,,,,,,,,,,
 1115,宙斯,参加奥赛的几率提高,,0,,,,,,,,,,,,
 1116,为人民服务,考公务员时一定能考上,,0,,,,,,,,,,,,
 1117,表现良好,入狱会减刑,,0,,,,,,,,,,,,
 1118,小吉,运气稍微提升,,0,,,,,,,,,,,,
 1119,天秤座,据说做事很公平,,0,,,,,,,,,,,,
 1120,万里挑一,你很攻,,0,,,,,,,,,,,,
 1121,把握不住,你有强迫症,,0,,,,,,,,,,,,
 1122,急了急了,赶着投胎，不要初始属性了,,1,-20,,,,,,1084,1085,1086,,,
 1123,不离不弃,你不会离婚,,0,,,,,,,,,,,,
 1124,足量,身高不矮,,0,,,,,,,,,,,,
 1125,易胖体质,颜值更容易降低,,0,,,,,,,,,,,,
 1126,黄帝,种族主义者,,0,,,,,,,,,,,,
 1127,左撇子,习惯使用左手,,0,,,,,,,,,,,,
 1128,克苏鲁,&▓▓▓◆▓▓▓￥#▓@■.◆,,2,,,,,,,,,,,,
 1129,不连续存在,你还拥有其他人格,,2,,,,,,,,,,,,
 1130,占位符,少一个可选天赋,,0,,,,,,,,,,,,
 1131,魔法棒,不知道有什么用……,,2,,,,,,,,,,,,
--- a/data/talents.json
+++ b/data/talents.json
@@ -502,31 +502,31 @@
    "1059": {
        "id": "1059",
        "name": "理财达人",
-        "description": "30、40、50岁时家境+1",
+        "description": "40岁时家境+3",
-        "condition": "AGE?[30,40,50]",
+        "condition": "AGE?[40]",
        "grade": 0,
        "effect": {
-            "MNY": 1
+            "MNY": 3
        }
    },
    "1060": {
        "id": "1060",
        "name": "成熟",
-        "description": "12、18岁时智力+1",
+        "description": "18岁时智力+2",
-        "condition": "AGE?[12,18]",
+        "condition": "AGE?[18]",
        "grade": 1,
        "effect": {
-            "INT": 1
+            "INT": 2
        }
    },
    "1061": {
        "id": "1061",
        "name": "形象管理",
-        "description": "16、24岁时颜值+1",
+        "description": "24岁时颜值+2",
-        "condition": "AGE?[16,24]",
+        "condition": "AGE?[24]",
        "grade": 1,
        "effect": {
-            "CHR": 1
+            "CHR": 2
        }
    },
    "1062": {
@@ -1151,5 +1151,23 @@
        "name": "魔法棒",
        "description": "不知道有什么用……",
        "grade": 2
    },
    "1132": {
        "id": 1132,
        "name": "返老还童",
        "description": "可能会回到年轻的时候",
        "grade": 1
    },
    "1133": {
        "id": 1133,
        "name": "时光倒流",
        "description": "或许时间会倒流",
        "grade": 0
    },
    "1134": {
        "id": 1134,
        "name": "转世重修",
        "description": "渡劫失败重生",
        "grade": 2
    }
 }
--- a/data/talents.xlsx
+++ b/data/talents.xlsx
--- a/index.md
+++ b/index.md
@@ -1,3 +1,5 @@
 # Life Restart
 やり直すんだ。そして、次はうまくやる。[RESTART](view/index.html)
 <iframe src="https://discord.com/widget?id=883382868427014255&theme=dark" width="350" height="500" allowtransparency="true" frameborder="0" sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts"></iframe>
--- a/package.json
+++ b/package.json
@@ -1,12 +1,23 @@
 {
-    "name": "xlsx_transform",
+    "name": "life_restart",
    "type": "module",
-    "bin": "test/index.js",
+    "bin": "repl/index.js",
    "scripts": {
        "test": "node test",
-        "xlsxTransform": "node utils/xlsxTransform.js data"
+        "xlsxTransform": "node utils/xlsxTransform.js data",
        "dev": "webpack serve --open /view/index.html",
        "build": "webpack --mode production"
    },
    "dependencies": {
        "@babel/core": "^7.15.4",
        "@babel/preset-env": "^7.15.4",
        "babel-loader": "^8.2.2",
        "core-js": "^3.17.2",
        "webpack": "^5.51.2",
        "webpack-dev-server": "^4.1.0",
        "xlsx": "^0.17.0"
    },
    "devDependencies": {
        "webpack-cli": "^4.8.0"
    }
 }
--- a/public/bundle.js
+++ b/public/bundle.js
--- a/repl/app.js
+++ b/repl/app.js
@@ -0,0 +1,584 @@
 import { max, sum } from '../src/functions/util.js';
 import { summary } from '../src/functions/summary.js'
 import { readFile } from 'fs/promises';
 import Life from '../src/life.js';
 global.json = async fileName => JSON.parse(await readFile(`data/${fileName}.json`));
 class App {
    constructor() {
        this.#life = new Life();
    }
    Steps= {
        TALENT: 'talent',
        PROPERTY: 'property',
        TRAJECTORY: 'trajectory',
        SUMMARY: 'summary',
    };
    #step = this.Steps.SUMMARY;
    #life;
    #talentSelected = new Set();
    #talentExtend = new Set();
    #input;
    #auto;
    #isEnd;
    #propertyAllocation;
    #output;
    #exit;
    #interval;
    #style = {
        warn: ['\x1B[93m', '\x1B[39m'], // Bright Yellow
        grade1: ['\x1B[94m', '\x1B[39m'], // Bright Blue
        grade2: ['\x1B[95m', '\x1B[39m'], // Bright Magenta
        grade3: ['\x1B[93m', '\x1B[39m'], // Bright Yellow
        grade1b: ['\x1B[104m', '\x1B[49m'], // Bright Blue BG
        grade2b: ['\x1B[105m', '\x1B[49m'], // Bright Magenta BG
        grade3b: ['\x1B[103m', '\x1B[49m'], // Bright Yellow BG
    };
    #randomTalents;
    style(type, str) {
        const style = this.#style[type];
        if(!style) return str;
        return `${style[0]}${str}${style[1]}`;
    }
    async initial() {
        this.output('Now Loading...');
        this.#talentExtend = global.localStorage.talentExtend;
        await this.#life.initial();
        this.output(`\rLoading Complete.
 人生重开模拟器
 这垃圾人生一秒也不想待了
 \n🎉键入 \x1B[4m/remake\x1B[24m 开始游戏`,
            true
        );
    }
    io(input, output, exit) {
        this.#input = input;
        this.#output = output;
        this.#exit = exit;
        input(command=>{
            const ret = this.repl(command);
            if(!ret) return;
            if(typeof ret == 'string') return this.output(ret, true);
            if(Array.isArray(ret)) return this.output(...ret);
            const { message, isRepl } = ret;
            return this.output(message, isRepl);
        });
    }
    output(data, isRepl) {
        if(!this.#output) return;
        this.#output(data, isRepl);
    }
    exit(code) {
        if(this.#exit) this.#exit(code);
        process.exit(code);
    }
    repl(command) {
        command = command.split(/\s+/);
        switch(command.shift()) {
            case 'r':
            case 'remake':
            case '/remake':return this.remake();
            case 's':
            case 'select':
            case '/select': return this.select(...command);
            case 'u':
            case 'unselect':
            case '/unselect': return this.unselect(...command);
            case 'n':
            case 'next':
            case '/next': return this.next(true);
            case 'a':
            case 'alloc':
            case 'allocation':
            case '/alloc':
            case '/allocation': return this.alloc(...command);
            case 'rd':
            case 'random':
            case '/random': return this.random();
            case 'at':
            case 'auto':
            case '/auto': return this.auto(...command);
            case 'x':
            case 'exit':
            case '/exit': return this.exit(0);
            case '?':
            case 'h':
            case 'help':
            case '/?':
            case '/h':
            case '/help':
            default: return this.help(...command);
        }
    }
    help(key) {
        switch(key) {
            case 'x':
            case 'exit':
            case '/exit': return `退出
    x, exit, /exit      命令同等效果`;
            case 'r':
            case 'remake':
            case '/remake': return `重开
    r, remake, /remake  命令同等效果`;
            case 's':
            case 'select':
            case '/select': return `选择
    s, select, /select  命令同等效果
    Example:    /select 1 2 3 意味着选择 1 2 3 三个天赋
                /select <id1> [id2] [id3]
    参数解释     <id1>   通常来说要指定至少一个id
                        虽然不指定也可以
                [id2]
                [id3]   可以不指定`;
            case 'u':
            case 'unselect':
            case '/unselect': return `取消选择
    u, unselect,
    /unselect           命令同等效果
    Example:    /unselect 1 2 3
                意味着取消选择 1 2 3 三个天赋
    参数解释     /unselect <id1> [id2] [id3]
                <id1>   通常来说要指定至少一个id
                        虽然不指定也可以
                [id2]
                [id3]   可以不指定`;
            case 'a':
            case 'alloc':
            case 'allocation':
            case '/alloc':
            case '/allocation': return `分配属性点
    a, alloc, allocation
    /alloc, /allocation 命令同等效果
    Example:    /allocation STR 1
                /allocation INT -3
                /allocation CHR +5
    参数解释    /allocation <TAG> <[+/-]value>
                <TAG>   表示要分配的属性标签
                        可选有
                            CHR, chr, c, C 表示颜值
                            INT, int, i, I 表示智力
                            STR, str, s, S 表示体质
                            MNY, mny, m, M 表示家境
                        必填
                <[+/-]value>
                        表示属性的调整
                        其中
                            + 表示在当前基础上增加
                            - 表示在当前基础上减少
                            无符号表示直接设置为此值
                        必填`;
            case 'n':
            case 'next':
            case '/next': return `继续
    n, next, /next      命令同等效果
    效果                通常用于各步骤结束后
                        例如：  选择天赋后
                                分配属性后
                                每个年龄事件后
                                总评后
                                继承天赋后`;
            case 'at':
            case 'auto':
            case '/auto': return `自动播放
    at, auto, /auto    命令同等效果
    效果                用于人生的过程中
                        每个年龄会自动下一年
                        播放速度 1 秒 1 年`;
            case '?':
            case 'h':
            case 'help':
            case '/?':
            case '/h':
            case '/help': return `显示帮助
    ？, h, help
    /?, /h, /help           命令同等效果
    Example:            /help
                        /help /select
    参数解释             /help [command]
            [command]   要详细显示帮助的命令
                        可以不填`;
        }
        return `Help ---
    命令            说明            示例
    x
    exit
    /exit           退出            /exit
    r
    remake
    /remake         重开            /remake
    s
    select
    /select         选择天赋        /select <id1> [id2] [id3]
    u
    unselect
    /unselect       取消选择        /unselect <id1> [id2] [id3]
    a
    alloc
    allocation
    /alloc
    /allocation     分配属性点      /allocation <TAG> <[+/-]value>
    n
    next
    /next           继续            /next
    at
    auto
    /auto           自动播放        /auto
    ?
    h
    help
    /?
    /h
    /help           显示帮助        /help [command]`;
    }
    auto(arg) {
        this.#auto = arg != 'off';
        return this.next(true);
    }
    remake() {
        if(this.#talentExtend) {
            this.#life.talentExtend(this.#talentExtend)
            global.dumpLocalStorage();
            this.#talentExtend = null;
        }
        this.#isEnd = false;
        this.#talentSelected.clear();
        this.#propertyAllocation = {CHR:0,INT:0,STR:0,MNY:0,SPR:5};
        this.#step = this.Steps.TALENT;
        this.#randomTalents = this.#life.talentRandom();
        return this.list();
    }
    select(...select) {
        switch(this.#step) {
            case this.Steps.TALENT: return this.talentSelect(...select);
            case this.Steps.SUMMARY: return this.talentExtend(...select);
        }
    }
    unselect(...select) {
        switch(this.#step) {
            case this.Steps.TALENT: return this.talentUnSelect(...select);
            case this.Steps.SUMMARY: return this.talentExtendCancle(...select);
        }
    }
    talentSelect(...select) {
        const warn = str => `${this.list()}\n${this.style('warn', str)}`;
        for(const number of select) {
            const s = this.#randomTalents[number];
            if(!s) return warn(`${number} 为未知天赋`);
            if(this.#talentSelected.has(s)) continue;
            if(this.#talentSelected.size == 3)
                return warn('⚠只能选3个天赋');
            const exclusive = this.#life.exclusive(
                Array.from(this.#talentSelected).map(({id})=>id),
                s.id
            );
            if(exclusive != null)
                for(const { name, id } of this.#talentSelected)
                    if(id == exclusive)
                        return warn(`天赋【${s.name}】与已选择的天赋【${name}】冲突`);
            this.#talentSelected.add(s);
        }
        return this.list();
    }
    talentUnSelect(...select) {
        for(const number of select) {
            const s = this.#randomTalents[number];
            if(this.#talentSelected.has(s))
                this.#talentSelected.delete(s);
        }
        return this.list();
    }
    talentExtend(select) {
        const warn = str => `${this.list()}\n${this.style('warn', str)}`;
        const list = Array.from(this.#talentSelected);
        const s = list[select];
        if(!s) return warn(`${select} 为未知天赋`);
        this.#talentExtend = s.id;
        return this.list();
    }
    talentExtendCancle() {
        this.#talentExtend = null;
    }
    list() {
        let description, list, check;
        switch(this.#step) {
            case this.Steps.TALENT:
                description = '🎉 请选择3个天赋';
                list = this.#randomTalents;
                check = talent=>this.#talentSelected.has(talent);
                break;
            case this.Steps.SUMMARY:
                description = '🎉 你可以选一个天赋继承';
                list = Array.from(this.#talentSelected);
                check = ({id})=>this.#talentExtend == id;
                break;
        }
        if(!list) return '';
        return [description, list.map(
                (talent, i) =>
                    this.style(
                        `grade${talent.grade}b`,
                        `${check(talent)?'√':' '} ${i} ${talent.name}（${talent.description}）`
                    )
            )]
            .flat()
            .join('\n');
    }
    next(enter) {
        const warn = (a, b) => `${a}\n${this.style('warn', this.style('warn', b))}`;
        switch(this.#step) {
            case this.Steps.TALENT:
                if(this.#talentSelected.size != 3) return warn(this.list(), `⚠请选择3个天赋`);
                this.#step = this.Steps.PROPERTY;
                this.#propertyAllocation.total = 20 + this.#life.getTalentAllocationAddition(
                    Array.from(this.#talentSelected).map(({id})=>id)
                );
                this.#propertyAllocation.TLT = Array.from(this.#talentSelected).map(({id})=>id);
                return this.prop();
            case this.Steps.PROPERTY:
                const less = this.less();
                if(less > 0) return warn(this.prop(), `你还有${less}属性点没有分配完`);
                this.#step = this.Steps.TRAJECTORY;
                delete this.#propertyAllocation.total;
                this.#life.restart(this.#propertyAllocation);
                return this.trajectory(enter);
            case this.Steps.TRAJECTORY:
                if(!this.#isEnd) return this.trajectory(enter);
                this.#step = this.Steps.SUMMARY;
                return `${
                    this.summary()
                }\n\n${
                    this.list()
                }`;
            case this.Steps.SUMMARY:
                return this.remake();
        }
    }
    trajectory(enter) {
        if(enter) {
            if(this.#interval) {
                clearInterval(this.#interval);
                this.#interval = null;
                this.#auto = false;
            } else if(this.#auto) {
                this.#interval = setInterval(
                    ()=>{
                        const trajectory = this.next();
                        if(this.#isEnd && this.#interval) {
                            clearInterval(this.#interval);
                            this.#interval = null;
                        }
                        if(!this.#isEnd) return this.output(`${trajectory}\n`);
                        return this.output(trajectory, true);
                    }
                , 1000);
                return;
            }
        }
        const trajectory = this.#life.next();
        const { age, content, isEnd } = trajectory;
        if(isEnd) this.#isEnd = true;
        return `${age}岁：\t${
            content.map(
                ({type, description, grade, name, postEvent}) => {
                    switch(type) {
                        case 'TLT':
                            return `天赋【${name}】发动：${description}`;
                        case 'EVT':
                            return description + (postEvent?`\n\t${postEvent}`:'');
                    }
                }
            ).join('\n\t')
        }`;
    }
    prop() {
        const { CHR, INT, STR, MNY } = this.#propertyAllocation;
        return `🎉属性分配
 剩余点数 ${this.less()}
 属性(TAG)       当前值
 颜值(CHR)         ${CHR}
 智力(INT)         ${INT}
 体质(STR)         ${STR}
 家境(MNY)         ${MNY}
        `
    }
    less() {
        const { total, CHR, INT, STR, MNY } = this.#propertyAllocation;
        return total - CHR - INT - STR - MNY;
    }
    alloc(tag, value) {
        const warn = str => `${this.prop()}\n${this.style('warn', str)}`
        if(!value) return warn('⚠ 分配的数值没有给定');
        const isSet = !(value[0] == '-'|| value[0] == '+');
        value = Number(value);
        if(isNaN(value)) return warn('⚠ 分配的数值不正确');
        switch(tag) {
            case 'c':
            case 'chr':
            case 'C': tag = 'CHR'; break;
            case 'i':
            case 'int':
            case 'I': tag = 'INT'; break;
            case 's':
            case 'S':
            case 'str': tag = 'STR'; break;
            case 'm':
            case 'M':
            case 'mny': tag = 'MNY'; break;
        }
        switch(tag) {
            case 'CHR':
            case 'INT':
            case 'STR':
            case 'MNY':
                if(isSet) value = value - this.#propertyAllocation[tag];
                const tempLess = this.less() - value;
                const tempSet = this.#propertyAllocation[tag] + value;
                if(tempLess<0) return  warn('⚠ 你没有更多的点数可以分配了');
                if(
                    tempLess>this.#propertyAllocation.total
                    || tempSet < 0
                ) return  warn('⚠ 不能分配负数属性');
                if(tempSet>10) return  warn('⚠ 单项属性最高分配10点');
                this.#propertyAllocation[tag] += value;
                return this.prop();
            default:
                return  warn('⚠ 未知的tag');
        }
    }
    random() {
        let t = this.#propertyAllocation.total;
        const arr = [10, 10, 10, 10];
        while(t>0) {
            const sub = Math.round(Math.random() * (Math.min(t, 10) - 1)) + 1;
            while(true) {
                const select = Math.floor(Math.random() * 4) % 4;
                if(arr[select] - sub <0) continue;
                arr[select] -= sub;
                t -= sub;
                break;
            }
        }
        this.#propertyAllocation.CHR = 10 - arr[0];
        this.#propertyAllocation.INT = 10 - arr[1];
        this.#propertyAllocation.STR = 10 - arr[2];
        this.#propertyAllocation.MNY = 10 - arr[3];
        return this.prop();
    }
    summary() {
        const records = this.#life.getRecord();
        const s = (type, func)=>{
            const value = func(records.map(({[type]:v})=>v));
            const { judge, grade } = summary(type, value);
            return { judge, grade, value };
        };
        const style = (name, grade, judge, value) => this.style(`grade${grade}b`, `${name}：${value} ${judge}`);
        const judge = (name, type, func) => {
            const { judge, grade, value } = s(type, func);
            return style(name, grade, judge, value );
        }
        return [
            '🎉 总评',
            judge('颜值', 'CHR', max),
            judge('智力', 'INT', max),
            judge('体质', 'STR', max),
            judge('家境', 'MNY', max),
            judge('快乐', 'SPR', max),
            judge('享年', 'AGE', max),
            (()=>{
                const m = type=>max(records.map(({[type]: value})=>value));
                const value = Math.floor(sum(m('CHR'), m('INT'), m('STR'), m('MNY'), m('SPR'))*2 + m('AGE')/2);
                const { judge, grade } = summary('SUM', value);
                return style('总评', grade, judge, value );
            })(),
        ].join('\n');
    }
 }
 export default App;
--- a/repl/index.js
+++ b/repl/index.js
@@ -0,0 +1,30 @@
 import App from './app.js';
 import { readFile, writeFile } from 'fs/promises';
 async function main() {
    try {
        global.localStorage = JSON.parse(await readFile('__localStorage.json'));
    } catch (e) {
        global.localStorage = {};
    }
    global.dumpLocalStorage = async ()=>await writeFile('__localStorage.json', JSON.stringify( global.localStorage))
    const app = new App();
    app.io(
        repl => process.stdin.on('data', data=>repl(data.toString().trim())),
        (data, isRepl) => process.stdout.write(`${data}${isRepl?'\n>':''}`),
        code=>process.exit(code)
    )
    await app.initial();
 }
 main();
 // process.stdin.setRawMode(true);
 // process.openStdin().on('keypress', function (chunk, key) {
 //   process.stdout.write('Get Chunk: ' + chunk + '\n');
 //   if (key && key.ctrl && key.name == 'c') process.exit();
 // });
--- a/src/app.js
+++ b/src/app.js
@@ -1,6 +1,7 @@
 import { max, sum } from './functions/util.js';
 import { summary } from './functions/summary.js'
 import Life from './life.js'
 class App{
    constructor(){
        this.#life = new Life();
@@ -8,20 +9,35 @@ class App{
    #life;
    #pages;
    #currentPage;
    #talentSelected = new Set();
    #totalMax=20;
    #isEnd = false;
    #selectedExtendTalent = null;
    #hintTimeout;
    #specialthanks;
    async initial() {
        this.initPages();
        this.switch('loading');
-        await this.#life.initial();
+        const [,specialthanks] = await Promise.all([
            this.#life.initial(),
            json('specialthanks')
        ]);
        this.#specialthanks = specialthanks;
        console.table(specialthanks);
        this.switch('index');
        window.onerror = (event, source, lineno, colno, error) => {
            this.hint(`[ERROR] at (${source}:${lineno}:${colno})\n\n${error?.stack||error||'unknow Error'}`, 'error');
        }
        const keyDownCallback = (keyboardEvent) => {
            if (keyboardEvent.which === 13 || keyboardEvent.keyCode === 13) {
                const pressEnterFunc = this.#pages[this.#currentPage]?.pressEnter;
                pressEnterFunc && typeof pressEnterFunc === 'function' && pressEnterFunc();
            }
        }
        window.removeEventListener('keydown', keyDownCallback);
        window.addEventListener('keydown', keyDownCallback);
    }
    initPages() {
@@ -41,14 +57,20 @@ class App{
        <div id="main">
            <div id="cnt" class="head">已重开1次</div>
            <button id="rank">排行榜</button>
            <button id="specialthanks">特别感谢</button>
            <button id="themeToggleBtn">黑</button>
            <div id="title">
                人生重开模拟器<br>
                <div style="font-size:1.5rem; font-weight:normal;">这垃圾人生一秒也不想呆了</div>
            </div>
            <button id="restart" class="mainbtn"><span class="iconfont">&#xe6a7;</span>立即重开</button>
            <a href="https://discord.gg/U3qrf49NMQ" style="z-index: 9999;" aria-label="Chat on Discord"><button class="discord-btn"><svg width="50%" height="55" viewBox="0 0 71 55" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0)"><path d="M60.1045 4.8978C55.5792 2.8214 50.7265 1.2916 45.6527 0.41542C45.5603 0.39851 45.468 0.440769 45.4204 0.525289C44.7963 1.6353 44.105 3.0834 43.6209 4.2216C38.1637 3.4046 32.7345 3.4046 27.3892 4.2216C26.905 3.0581 26.1886 1.6353 25.5617 0.525289C25.5141 0.443589 25.4218 0.40133 25.3294 0.41542C20.2584 1.2888 15.4057 2.8186 10.8776 4.8978C10.8384 4.9147 10.8048 4.9429 10.7825 4.9795C1.57795 18.7309 -0.943561 32.1443 0.293408 45.3914C0.299005 45.4562 0.335386 45.5182 0.385761 45.5576C6.45866 50.0174 12.3413 52.7249 18.1147 54.5195C18.2071 54.5477 18.305 54.5139 18.3638 54.4378C19.7295 52.5728 20.9469 50.6063 21.9907 48.5383C22.0523 48.4172 21.9935 48.2735 21.8676 48.2256C19.9366 47.4931 18.0979 46.6 16.3292 45.5858C16.1893 45.5041 16.1781 45.304 16.3068 45.2082C16.679 44.9293 17.0513 44.6391 17.4067 44.3461C17.471 44.2926 17.5606 44.2813 17.6362 44.3151C29.2558 49.6202 41.8354 49.6202 53.3179 44.3151C53.3935 44.2785 53.4831 44.2898 53.5502 44.3433C53.9057 44.6363 54.2779 44.9293 54.6529 45.2082C54.7816 45.304 54.7732 45.5041 54.6333 45.5858C52.8646 46.6197 51.0259 47.4931 49.0921 48.2228C48.9662 48.2707 48.9102 48.4172 48.9718 48.5383C50.038 50.6034 51.2554 52.5699 52.5959 54.435C52.6519 54.5139 52.7526 54.5477 52.845 54.5195C58.6464 52.7249 64.529 50.0174 70.6019 45.5576C70.6551 45.5182 70.6887 45.459 70.6943 45.3942C72.1747 30.0791 68.2147 16.7757 60.1968 4.9823C60.1772 4.9429 60.1437 4.9147 60.1045 4.8978ZM23.7259 37.3253C20.2276 37.3253 17.3451 34.1136 17.3451 30.1693C17.3451 26.225 20.1717 23.0133 23.7259 23.0133C27.308 23.0133 30.1626 26.2532 30.1066 30.1693C30.1066 34.1136 27.28 37.3253 23.7259 37.3253ZM47.3178 37.3253C43.8196 37.3253 40.9371 34.1136 40.9371 30.1693C40.9371 26.225 43.7636 23.0133 47.3178 23.0133C50.9 23.0133 53.7545 26.2532 53.6986 30.1693C53.6986 34.1136 50.9 37.3253 47.3178 37.3253Z" fill="#ffffff"/></g><defs><clipPath id="clip0"><rect width="71" height="55" fill="white"/></clipPath></defs></svg>CHAT</button><style>.discord-btn {position: fixed;bottom: 0.5rem;left: 0.5rem;background-color: #5865F2;padding: 0.7rem;height: auto;color: white;text-align: right;vertical-align: middle;border: none;width: 6.5rem;font-size: 1rem;border-radius: 4px;}.discord-btn svg {height: 1.5rem;position: absolute;top: 50%;left: 0;transform: translateY(-50%);}.discord-btn:hover svg{animation:discord-wave 560ms ease-in-out;}@keyframes discord-wave{0%,100%{transform:translateY(-50%) rotate(0)}20%,60%{transform:translateY(-50%) rotate(-25deg)}40%,80%{transform:translateY(-50%) rotate(10deg)}}@media (max-width:500px){.discord-btn:hover svg{animation:none}.discord-btn svg{animation:discord-wave 560ms ease-in-out}}</style></a>
        </div>
        `);
        // Init theme
        this.setTheme(localStorage.getItem('theme'))
        indexPage
            .find('#restart')
            .click(()=>this.switch('talent'));
@@ -57,13 +79,53 @@ class App{
            .find('#rank')
            .click(()=>this.hint('别卷了！没有排行榜'));
        if(localStorage.getItem('theme') == 'light') {
            indexPage.find('#themeToggleBtn').text('黑')
        } else{
            indexPage.find('#themeToggleBtn').text('白')
        }
        indexPage
            .find("#themeToggleBtn")
            .click(() => {
                if(localStorage.getItem('theme') == 'light') {
                    localStorage.setItem('theme', 'dark');
                    indexPage.find('#themeToggleBtn').text('白')
                } else {
                    localStorage.setItem('theme', 'light');
                    indexPage.find('#themeToggleBtn').text('黑')
                }
                this.setTheme(localStorage.getItem('theme'))
            });
        indexPage
            .find('#specialthanks')
            .click(()=>this.switch('specialthanks'));
        const specialThanksPage = $(`
        <div id="main">
            <button id="specialthanks">返回</button>
            <div id="spthx">
                <ul class="g1"></ul>
                <ul class="g2"></ul>
            </div>
            <button class="sponsor" onclick="window.open('https://afdian.net/@LifeRestart')" style="background: linear-gradient(90deg,#946ce6,#7e5fd9); left:auto; right:50%; transform: translate(-2rem,-50%);">打赏策划(爱发电)</button>
            <button class="sponsor" onclick="window.open('https://dun.mianbaoduo.com/@vickscarlet')" style="background-color:#c69; left:50%; right:auto; transform: translate(2rem,-50%);">打赏程序(顿顿饭)</button>
        </div>
        `);
        specialThanksPage
            .find('#specialthanks')
            .click(()=>this.switch('index'));
        // Talent
        const talentPage = $(`
        <div id="main">
            <div class="head" style="font-size: 1.6rem">天赋抽卡</div>
-            <button id="random" class="mainbtn" style="top: 50%;">10连抽！</button>
+            <button id="random" class="mainbtn" style="position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);"">10连抽！</button>
            <ul id="talents" class="selectlist"></ul>
-            <button id="next" class="mainbtn" style="top:auto; bottom:0.1em">请选择3个</button>
+            <button id="next" class="mainbtn">请选择3个</button>
        </div>
        `);
@@ -84,6 +146,9 @@ class App{
                            if(li.hasClass('selected')) {
                                li.removeClass('selected')
                                this.#talentSelected.delete(talent);
                                if(this.#talentSelected.size<3) {
                                    talentPage.find('#next').text('请选择3个')
                                }
                            } else {
                                if(this.#talentSelected.size==3) {
                                    this.hint('只能选3个天赋');
@@ -105,9 +170,13 @@ class App{
                                }
                                li.addClass('selected');
                                this.#talentSelected.add(talent);
                                if(this.#talentSelected.size==3) {
                                    talentPage.find('#next').text('开始新人生')
                                }
                            }
                        });
                    });
                talentPage.find('#next').show()
            });
        talentPage
@@ -117,23 +186,36 @@ class App{
                    this.hint('请选择3个天赋');
                    return;
                }
                talentPage.find('#next').hide()
                this.#totalMax = 20 + this.#life.getTalentAllocationAddition(Array.from(this.#talentSelected).map(({id})=>id));
                this.switch('property');
            })
        // Property
-        const propertyPage = $(`
+        // hint of extension tobermory.es6-string-html
        const propertyPage = $(/*html*/`
        <div id="main">
            <div class="head" style="font-size: 1.6rem">
-                调整初始属性<br>
+                <div>调整初始属性</div>
                <div id="total" style="font-size:1rem; font-weight:normal;">可用属性点：0</div>
            </div>
            <ul id="propertyAllocation" class="propinitial"></ul>
-            <button id="random" class="mainbtn" style="top:auto; bottom:7rem">随机分配</button>
+            <ul class="selectlist" id="talentSelectedView"></ul>
-            <button id="start" class="mainbtn" style="top:auto; bottom:0.1rem">开始新人生</button>
+            <div class="btn-area">
                <button id="random" class="mainbtn">随机分配</button>
                <button id="start" class="mainbtn">开始新人生</button>
            </div>
        </div>
        `);
-
+        propertyPage.mounted = ()=>{
            propertyPage
            .find('#talentSelectedView').append(
                `<li>已选天赋</li>` +
                Array.from(this.#talentSelected)
                .map(({name,description})=>`<li class="grade0b">${name}(${description})</li>`)
                .join('')
            )
        }
        const groups = {};
        const total = ()=>{
            let t = 0;
@@ -166,8 +248,8 @@ class App{
                freshTotal();
            }
            btnAdd.click(()=>{
-                if(total() == this.#totalMax) {
+                if(total() >= this.#totalMax) {
-                    this.hint('没用可分配的点数了');
+                    this.hint('没有可分配的点数了');
                    return;
                }
                set(get()+1);
@@ -223,9 +305,12 @@ class App{
        propertyPage
            .find('#start')
            .click(()=>{
-                if(total()!=this.#totalMax) {
+                if(total() < this.#totalMax) {
                    this.hint(`你还有${this.#totalMax-total()}属性点没有分配完`);
                    return;
                } else if (total() > this.#totalMax) {
                    this.hint(`你多使用了${total() - this.#totalMax}属性点`);
                    return;
                }
                this.#life.restart({
                    CHR: groups.CHR.get(),
@@ -237,13 +322,25 @@ class App{
                });
                this.switch('trajectory');
                this.#pages.trajectory.born();
                // $(document).keydown(function(event){
                //     if(event.which == 32 || event.which == 13){
                //         $('#lifeTrajectory').click();
                //     }
                // })
            });
        // Trajectory
        const trajectoryPage = $(`
        <div id="main">
            <ul id="lifeProperty" class="lifeProperty"></ul>
            <ul id="lifeTrajectory" class="lifeTrajectory"></ul>
-            <button id="summary" class="mainbtn" style="top:auto; bottom:0.1rem">人生总结</button>
+            <div class="btn-area">
                <button id="summary" class="mainbtn">人生总结</button>
                <button id="domToImage" class="mainbtn">人生回放</button>
            </div>
            <div class="domToImage2wx">
                <img src="" id="endImage" />
            </div>
        </div>
        `);
@@ -253,8 +350,7 @@ class App{
                if(this.#isEnd) return;
                const trajectory = this.#life.next();
                const { age, content, isEnd } = trajectory;
-
+                const li = $(`<li><span>${age}岁：</span><span>${
                const li = $(`<li><span>${age}岁：</span>${
                    content.map(
                        ({type, description, grade, name, postEvent}) => {
                            switch(type) {
@@ -265,15 +361,47 @@ class App{
                            }
                        }
                    ).join('<br>')
-                }</li>`);
+                }</span></li>`);
                li.appendTo('#lifeTrajectory');
                $("#lifeTrajectory").scrollTop($("#lifeTrajectory")[0].scrollHeight);
                if(isEnd) {
                    $(document).unbind("keydown");
                    this.#isEnd = true;
                    trajectoryPage.find('#summary').show();
                    trajectoryPage.find('#domToImage').show();
                } else {
                    // 如未死亡，更新数值
                    // Update properties if not die yet
                    const property = this.#life.getLastRecord();
                    $("#lifeProperty").html(`
                    <li><span>颜值</span><span>${property.CHR}</span></li>
                    <li><span>智力</span><span>${property.INT}</span</li>
                    <li><span>体质</span><span>${property.STR}</span</li>
                    <li><span>家境</span><span>${property.MNY}</span</li>
                    <li><span>快乐</span><span>${property.SPR}</span</li>
                    `);
                }
            });
        // html2canvas
        trajectoryPage
            .find('#domToImage')
            .click(()=>{
                $("#lifeTrajectory").addClass("deleteFixed");
                const ua = navigator.userAgent.toLowerCase();
                domtoimage.toJpeg(document.getElementById('lifeTrajectory'))
                    .then(function (dataUrl) {
                        let link = document.createElement('a');
                        link.download = '我的人生回放.jpeg';
                        link.href = dataUrl;
                        link.click();
                        $("#lifeTrajectory").removeClass("deleteFixed");
                        // 微信内置浏览器，显示图片，需要用户单独保存
                        if(ua.match(/MicroMessenger/i)=="micromessenger") {
                            $('#endImage').attr('src', dataUrl);
                        }
                    });
            })
        trajectoryPage
            .find('#summary')
            .click(()=>{
@@ -284,19 +412,19 @@ class App{
        const summaryPage = $(`
        <div id="main">
            <div class="head">人生总结</div>
-            <ul id="judge" class="judge" style="bottom: calc(35% + 2.5rem)">
+            <ul id="judge" class="judge">
-                <li class="grade2"><span>颜值：</span>9级 美若天仙</li>
+                <li class="grade2"><span>颜值：</span><span>9级 美若天仙</span></li>
-                <li><span>智力：</span>4级 智力一般</li>
+                <li class="grade0"><span>智力：</span><span>4级 智力一般</span></li>
-                <li><span>体质：</span>1级 极度虚弱</li>
+                <li class="grade0"><span>体质：</span><span>1级 极度虚弱</span></li>
-                <li><span>家境：</span>6级 小康之家</li>
+                <li class="grade0"><span>家境：</span><span>6级 小康之家</span></li>
-                <li><span>享年：</span>3岁 早夭</li>
+                <li class="grade0"><span>享年：</span><span>3岁 早夭</span></li>
-                <li><span>快乐：</span>3级 不太幸福的人生</li>
+                <li class="grade0"><span>快乐：</span><span></span>3级 不太幸福的人生</li>
            </ul>
-            <div class="head" style="top:auto; bottom:35%">天赋，你可以选一个，下辈子还能抽到</div>
+            <div class="head" style="height:auto;">天赋，你可以选一个，下辈子还能抽到</div>
-            <ul id="talents" class="selectlist" style="top:calc(65% + 0.5rem); bottom:8rem">
+            <ul id="talents" class="selectlist" style="flex: 0 1 auto;">
                <li class="grade2b">黑幕（面试一定成功）</li>
            </ul>
-            <button id="again" class="mainbtn" style="top:auto; bottom:0.1em"><span class="iconfont">&#xe6a7;</span>再次重开</button>
+            <button id="again" class="mainbtn"><span class="iconfont">&#xe6a7;</span>再次重开</button>
        </div>
        `);
@@ -315,7 +443,9 @@ class App{
        this.#pages = {
            loading: {
                page: loadingPage,
-                clear: ()=>{},
+                clear: ()=>{
                    this.#currentPage = 'loading';
                },
            },
            index: {
                page: indexPage,
@@ -323,7 +453,11 @@ class App{
                btnRestart: indexPage.find('#restart'),
                hint: indexPage.find('.hint'),
                cnt: indexPage.find('#cnt'),
                pressEnter: ()=>{
                    this.#pages.index.btnRestart.click();
                },
                clear: ()=>{
                    this.#currentPage = 'index';
                    indexPage.find('.hint').hide();
                    const times = this.times;
@@ -340,9 +474,42 @@ class App{
                    cnt.hide();
                },
            },
            specialthanks: {
                page: specialThanksPage,
                clear: () => {
                    const groups = [
                        specialThanksPage.find('#spthx > ul.g1'),
                        specialThanksPage.find('#spthx > ul.g2'),
                    ];
                    groups.forEach(g=>g.empty());
                    Object
                        .values(this.#specialthanks)
                        .sort(()=>0.5-Math.random())
                        .forEach(({group, name, comment})=>groups[--group].append(`
                            <li>
                                <span class="name">${name}</span>
                                <span class="comment">${comment||''}</span>
                            </li>
                        `))
                }
            },
            talent: {
                page: talentPage,
                talentList: talentPage.find('#talents'),
                btnRandom: talentPage.find('#random'),
                btnNext: talentPage.find('#next'),
                pressEnter: ()=>{
                    const talentList = this.#pages.talent.talentList;
                    const btnRandom = this.#pages.talent.btnRandom;
                    const btnNext = this.#pages.talent.btnNext;
                    if (talentList.children().length) {
                        btnNext.click();
                    } else {
                        btnRandom.click();
                    }
                },
                clear: ()=>{
                    this.#currentPage = 'talent';
                    talentPage.find('ul.selectlist').empty();
                    talentPage.find('#random').show();
                    this.#totalMax = 20;
@@ -350,13 +517,26 @@ class App{
            },
            property: {
                page: propertyPage,
                btnStart: propertyPage.find('#start'),
                pressEnter: ()=>{
                    this.#pages.property.btnStart.click();
                },
                clear: ()=>{
                    this.#currentPage = 'property';
                    freshTotal();
                    propertyPage
                        .find('#talentSelectedView')
                        .empty();
                },
            },
            trajectory: {
                page: trajectoryPage,
                lifeTrajectory: trajectoryPage.find('#lifeTrajectory'),
                pressEnter: ()=>{
                    this.#pages.trajectory.lifeTrajectory.click();
                },
                clear: ()=>{
                    this.#currentPage = 'trajectory';
                    trajectoryPage.find('#lifeTrajectory').empty();
                    trajectoryPage.find('#summary').hide();
                    this.#isEnd = false;
@@ -368,6 +548,7 @@ class App{
            summary: {
                page: summaryPage,
                clear: ()=>{
                    this.#currentPage = 'summary';
                    const judge = summaryPage.find('#judge');
                    const talents = summaryPage.find('#talents');
                    judge.empty();
@@ -401,37 +582,37 @@ class App{
                    judge.append([
                        (()=>{
                            const { judge, grade, value } = s('CHR', max);
-                            return `<li class="grade${grade}"><span>颜值：</span>${value} ${judge}</li>`
+                            return `<li class="grade${grade}"><span>颜值：</span><span>${value} ${judge}</span></li>`
                        })(),
                        (()=>{
                            const { judge, grade, value } = s('INT', max);
-                            return `<li class="grade${grade}"><span>智力：</span>${value} ${judge}</li>`
+                            return `<li class="grade${grade}"><span>智力：</span><span>${value} ${judge}</span></li>`
                        })(),
                        (()=>{
                            const { judge, grade, value } = s('STR', max);
-                            return `<li class="grade${grade}"><span>体质：</span>${value} ${judge}</li>`
+                            return `<li class="grade${grade}"><span>体质：</span><span>${value} ${judge}</span></li>`
                        })(),
                        (()=>{
                            const { judge, grade, value } = s('MNY', max);
-                            return `<li class="grade${grade}"><span>家境：</span>${value} ${judge}</li>`
+                            return `<li class="grade${grade}"><span>家境：</span><span>${value} ${judge}</span></li>`
                        })(),
                        (()=>{
                            const { judge, grade, value } = s('SPR', max);
-                            return `<li class="grade${grade}"><span>快乐：</span>${value} ${judge}</li>`
+                            return `<li class="grade${grade}"><span>快乐：</span><span>${value} ${judge}</span></li>`
                        })(),
                        (()=>{
                            const { judge, grade, value } = s('AGE', max);
-                            return `<li class="grade${grade}"><span>享年：</span>${value} ${judge}</li>`
+                            return `<li class="grade${grade}"><span>享年：</span><span>${value} ${judge}</span></li>`
                        })(),
                        (()=>{
                            const m = type=>max(records.map(({[type]: value})=>value));
                            const value = Math.floor(sum(m('CHR'), m('INT'), m('STR'), m('MNY'), m('SPR'))*2 + m('AGE')/2);
                            const { judge, grade } = summary('SUM', value);
-                            return `<li class="grade${grade}"><span>总评：</span>${value} ${judge}</li>`
+                            return `<li class="grade${grade}"><span>总评：</span><span>${value} ${judge}</span></li>`
                        })(),
                    ].join(''));
                }
-            }
+            },
        }
    }
@@ -441,6 +622,9 @@ class App{
        $('#main').detach();
        p.clear();
        p.page.appendTo('body');
        if(typeof p.page.mounted === 'function'){
            p.page.mounted()
        }
    }
    hint(message, type='info') {
@@ -459,9 +643,19 @@ class App{
        });
    }
-    get times() {return JSON.parse(localStorage.times||'0') || 0;}
+    setTheme(theme) {
-    set times(v) {localStorage.times = JSON.stringify(parseInt(v) || 0)};
+        const themeLink = $(document).find('#themeLink');
        if(theme == 'light') {
            themeLink.attr('href', 'light.css');
        } else {
            themeLink.attr('href', 'dark.css');
        }
    }
    get times() {return this.#life?.times || 0;}
    set times(v) { if(this.#life) this.#life.times = v };
 }
-export default App;
+export default App;
--- a/src/functions/condition.js
+++ b/src/functions/condition.js
@@ -113,4 +113,17 @@ function checkProp(property, condition) {
    }
 }
-export { checkCondition };
+function extractMaxTriggers(condition) {
    // Assuming only age related talents can be triggered multiple times.
    const RE_AGE_CONDITION = /AGE\?\[([0-9\,]+)\]/;
    const match_object = RE_AGE_CONDITION.exec(condition);
    if (match_object == null) {
        // Not age related, single trigger.
        return 1;
    }
    const age_list = match_object[1].split(",");
    return age_list.length;
 }
 export { checkCondition, extractMaxTriggers };
--- a/src/index.js
+++ b/src/index.js
@@ -0,0 +1,14 @@
 import App from '../src/app.js';
 window.json = async fileName => await (await fetch(`../data/${fileName}.json`)).json();
 // Pssst, I've created a github package - https://github.com/brookesb91/dismissible
 window.hideBanners = (e) => {
    document
        .querySelectorAll(".banner.visible")
        .forEach((b) => b.classList.remove("visible"));
 };
 const app = new App();
 app.initial();
--- a/src/life.js
+++ b/src/life.js
@@ -15,17 +15,18 @@ class Life {
    #triggerTalents;
    async initial() {
-        const age = await json('age');
+        const [age, talents, events] = await Promise.all([
-        const talents = await json('talents');
+          json('age'),
-        const events = await json('events');
+          json('talents'),
-
+          json('events'),
        ])
        this.#property.initial({age});
        this.#talent.initial({talents});
        this.#event.initial({events});
    }
    restart(allocation) {
-        this.#triggerTalents = new Set();
+        this.#triggerTalents = {};
        this.#property.restart(allocation);
        this.doTalent();
        this.#property.record();
@@ -35,6 +36,10 @@ class Life {
        return this.#talent.allocationAddition(talents);
    }
    getTalentCurrentTriggerCount(talentId) {
        return this.#triggerTalents[talentId] || 0;
    }
    next() {
        const {age, event, talent} = this.#property.ageNext();
@@ -51,13 +56,13 @@ class Life {
    doTalent(talents) {
        if(talents) this.#property.change(this.#property.TYPES.TLT, talents);
        talents = this.#property.get(this.#property.TYPES.TLT)
-            .filter(talentId=>!this.#triggerTalents.has(talentId));
+            .filter(talentId => this.getTalentCurrentTriggerCount(talentId) < this.#talent.get(talentId).max_triggers);
        const contents = [];
        for(const talentId of talents) {
            const result = this.#talent.do(talentId, this.#property);
            if(!result) continue;
-            this.#triggerTalents.add(talentId);
+            this.#triggerTalents[talentId] = this.getTalentCurrentTriggerCount(talentId) + 1;
            const { effect, name, description, grade } = result;
            contents.push({
                type: this.#property.TYPES.TLT,
@@ -110,9 +115,16 @@ class Life {
        return this.#property.getRecord();
    }
    getLastRecord() {
        return this.#property.getLastRecord();
    }
    exclusive(talents, exclusive) {
        return this.#talent.exclusive(talents, exclusive);
    }
    get times() { return this.#property?.get(this.#property.TYPES.TMS) || 0; }
    set times(v) { return this.#property?.set(this.#property.TYPES.TMS, v) || 0; }
 }
 export default Life;
--- a/src/property.js
+++ b/src/property.js
@@ -4,15 +4,16 @@ class Property {
    constructor() {}
    TYPES = {
-        AGE: "AGE",
+        AGE: "AGE", // 年龄 age AGE
-        CHR: "CHR",
+        CHR: "CHR", // 颜值 charm CHR
-        INT: "INT",
+        INT: "INT", // 智力 intelligence INT
-        STR: "STR",
+        STR: "STR", // 体质 strength STR
-        MNY: "MNY",
+        MNY: "MNY", // 家境 money MNY
-        SPR: "SPR",
+        SPR: "SPR", // 快乐 spirit SPR
-        LIF: "LIF",
+        LIF: "LIF", // 生命 life LIFE
-        TLT: "TLT",
+        TLT: "TLT", // 天赋 talent TLT
-        EVT: "EVT",
+        EVT: "EVT", // 事件 event EVT
        TMS: "TMS", // 次数 times TMS
    };
    #ageData;
@@ -71,6 +72,8 @@ class Property {
            case this.TYPES.TLT:
            case this.TYPES.EVT:
                return clone(this.#data[prop]);
            case this.TYPES.TMS:
                return JSON.parse(localStorage.times||'0') || 0;
            default: return 0;
        }
    }
@@ -87,8 +90,11 @@ class Property {
            case this.TYPES.TLT:
            case this.TYPES.EVT:
                this.#data[prop] = clone(value);
-                break;
+                return;
-            default: return 0;
+            case this.TYPES.TMS:
                localStorage.times = JSON.stringify(parseInt(value) || 0);
                return;
            default: return;
        }
    }
@@ -107,6 +113,10 @@ class Property {
        return clone(this.#record);
    }
    getLastRecord() {
        return clone(this.#record[this.#record.length - 1]);
    }
    change(prop, value) {
        if(Array.isArray(value)) {
            for(const v of value)
@@ -122,7 +132,7 @@ class Property {
            case this.TYPES.SPR:
            case this.TYPES.LIF:
                this.#data[prop] += Number(value);
-                break;
+                return;
            case this.TYPES.TLT:
            case this.TYPES.EVT:
                const v = this.#data[prop];
@@ -131,7 +141,13 @@ class Property {
                    if(index!=-1) v.splice(index,1);
                }
                if(!v.includes(value)) v.push(value);
-                break;
+                return;
            case this.TYPES.TMS:
                this.set(
                    prop,
                    this.get(prop) + parseInt(value)
                );
                return;
            default: return;
        }
    }
--- a/src/talent.js
+++ b/src/talent.js
@@ -1,5 +1,5 @@
 import { clone } from './functions/util.js';
-import { checkCondition } from './functions/condition.js';
+import { checkCondition, extractMaxTriggers } from './functions/condition.js';
 class Talent {
    constructor() {}
@@ -12,6 +12,7 @@ class Talent {
            const talent = talents[id];
            talent.id= Number(id);
            talent.grade = Number(talent.grade);
            talent.max_triggers = extractMaxTriggers(talent.condition);
        }
    }
--- a/test/index.js
+++ b/test/index.js
@@ -9,12 +9,13 @@ async function debug() {
    await life.initial();
    life.restart({
-        CHR: 5,                     // 颜值 charm CHR
+        CHR: 2000,                     // 颜值 charm CHR
-        INT: 5,                     // 智力 intelligence INT
+        INT: 2000,                     // 智力 intelligence INT
-        STR: 5,                     // 体质 strength STR
+        STR: 2000,                     // 体质 strength STR
-        MNY: 5,                     // 家境 money MNY
+        MNY: 2000,                     // 家境 money MNY
-        SPR: 5,                     // 快乐 spirit SPR
+        SPR: 2000,                     // 快乐 spirit SPR
-        TLT: [1004, 1005, 1009],    // 天赋 talent TLT
+        AGE: 100,
        TLT: [1134, 1048, 1009],    // 天赋 talent TLT
    });
    const lifeTrajectory = [];
    let trajectory;
@@ -42,6 +43,7 @@ async function debug() {
                }
            ).join('\n    ')
        );
        if(age == 99) debugger
    } while(!trajectory.isEnd)
    // debugger;
 }
--- a/utils/xlsxTransform.js
+++ b/utils/xlsxTransform.js
@@ -19,7 +19,8 @@ async function transform(filePath) {
        const newData = {};
        data[sheetName] = newData;
        rawData.shift();
-        for(const row of rawData) {
+        for(const index in rawData) {
            const row = rawData[index];
            const rowData = {};
            let mainKey;
            for(let key in row) {
@@ -51,7 +52,11 @@ async function transform(filePath) {
                    rowData[key] = cell;
                }
            }
-            if(mainKey===undefined) return console.error('No Main Key', rowData);
+            if(mainKey===undefined) {
                console.warn('[WARN][No Main Key]', filePath, sheetName, parseInt(index), rowData);
                continue;
            }
            if(newData[mainKey]) console.warn('[WARN][Duplicate Key]', mainKey, filePath, sheetName, parseInt(index), '\n\t', JSON.stringify(newData[mainKey]), '\n\t', JSON.stringify(rowData));
            newData[mainKey] = rowData;
        }
    }
--- a/view/dark.css
+++ b/view/dark.css
@@ -0,0 +1,791 @@
@media (min-width:640px){html{font-size:24px;}}
@media (min-width:631px) and (max-width:639px){html{font-size:23.66px;}}
@media (min-width:622px) and (max-width:630px){html{font-size:23.33px;}}
@media (min-width:613px) and (max-width:621px){html{font-size:23px;}}
@media (min-width:604px) and (max-width:612px){html{font-size:22.66px;}}
@media (min-width:595px) and (max-width:603px){html{font-size:22.33px;}}
@media (min-width:586px) and (max-width:594px){html{font-size:22px;}}
@media (min-width:577px) and (max-width:585px){html{font-size:21.66px;}}
@media (min-width:568px) and (max-width:576px){html{font-size:21.33px;}}
@media (min-width:559px) and (max-width:567px){html{font-size:21px;}}
@media (min-width:550px) and (max-width:558px){html{font-size:20.66px;}}
@media (min-width:541px) and (max-width:549px){html{font-size:20.33px;}}
@media (min-width:533px) and (max-width:540px){html{font-size:20px;}}
@media (min-width:524px) and (max-width:532px){html{font-size:19.66px;}}
@media (min-width:515px) and (max-width:523px){html{font-size:19.33px;}}
@media (min-width:506px) and (max-width:514px){html{font-size:19px;}}
@media (min-width:497px) and (max-width:505px){html{font-size:18.66px;}}
@media (min-width:488px) and (max-width:496px){html{font-size:18.33px;}}
@media (min-width:480px) and (max-width:487px){html{font-size:18px;}}
@media (min-width:471px) and (max-width:479px){html{font-size:17.66px;}}
@media (min-width:462px) and (max-width:470px){html{font-size:17.33px;}}
@media (min-width:453px) and (max-width:461px){html{font-size:17px;}}
@media (min-width:444px) and (max-width:452px){html{font-size:17.12px;}}
@media (min-width:435px) and (max-width:443px){html{font-size:16.33px;}}
@media (min-width:426px) and (max-width:434px){html{font-size:16px;}}
@media (min-width:417px) and (max-width:425px){html{font-size:15.66px;}}
@media (min-width:408px) and (max-width:416px){html{font-size:15.33px;}}
@media (min-width:400px) and (max-width:407px){html{font-size:15px;}}
@media (min-width:391px) and (max-width:399px){html{font-size:14.66px;}}
@media (min-width:382px) and (max-width:390px){html{font-size:14.33px;}}
@media (min-width:374px) and (max-width:381px){html{font-size:14px;}}
@media (min-width:365px) and (max-width:373px){html{font-size:13.66px;}}
@media (min-width:356px) and (max-width:364px){html{font-size:13.33px;}}
@media (min-width:347px) and (max-width:355px){html{font-size:13px;}}
@media (min-width:338px) and (max-width:346px){html{font-size:12.66px;}}
@media (min-width:329px) and (max-width:337px){html{font-size:12.44px;}}
@media (max-width:328px){html{font-size:12px;}}
@font-face {
  font-family: 'iconfont';
  src: url('iconfont.woff2?t=1628944689555') format('woff2'),
    url('iconfont.woff?t=1628944689555') format('woff'),
    url('iconfont.ttf?t=1628944689555') format('truetype');
 }
 * {
  margin: 0;
  padding: 0;
 }
 html {
  background-color: #222831;
  font-family: PingFangSC, 'Noto Sans CJK SC', 'MS Yahei';
 }
 body {
  user-select: none;
 }
 #main {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 30rem;
  height: 100%;
  text-align: center;
  box-sizing: border-box;
  position: relative;
 }
 #title {
  position: fixed;
  font-size: 3rem;
  font-weight: 700;
  top: 35%;
  left: 50%;
  white-space: nowrap;
  transform: translate(-50%, -50%);
  color: #EEEEEE;
 }
 #restart {
  position: fixed;
  top: 65%;
  left: 50%;
  transform: translate(-50%, -50%);
 }
 #restart .iconfont {
  margin-right: 0.5rem;
 }
 #next {
  display: none;
 }
 #talentSelectedView {
  flex: 0 1 auto;
 }
 .mainbtn {
  margin: 0.5rem 1rem 1rem;
  padding: 0.5rem 1.5rem;
  background-color: #393E46;
  border: 1px #EEEEEE solid;
  border-radius: 0.2rem;
  color: #EEEEEE;
  font-size: 1.6rem;
  white-space: nowrap;
  cursor: pointer;
 }
 .mainbtn:hover {
  background: #ff7878;
  color: #fff;
  transition: all .4s ease 0s;
 }
 .btn-area {
  display: flex;
  flex-direction: row;
 }
 .btn-area>.mainbtn {
  flex: 1;
 }
 .iconfont {
  display: inline-block;
  vertical-align: middle;
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 }
 .sponsor,
 #specialthanks,
 #rank {
  position: fixed;
  top: 4rem;
  right: 1rem;
  padding: 0.1rem;
  width: 6rem;
  border: none;
  border-radius: 0.2rem;
  background-color:lightsteelblue;
  font-size: 1.4rem;
  color: #EEEEEE;
  cursor: pointer;
  z-index:2;
  word-wrap: none;
 }
 #specialthanks {
  background-color: #5865F2;
  top: 1rem;
 }
 .sponsor {
  top: auto;
  bottom: 0;
  width: auto;
  padding: 0.5rem;
 }
 #spthx {
  position: fixed;
  display: grid;
  top: 4rem;
  bottom: 5rem;
  left: 50%;
  width: 30rem;
  max-width: calc(100% - 2rem);
  transform: translateX(-50%);
 }
 #spthx ul {
    list-style-type: none;
    padding: 0;
 }
 #spthx ul li {
  margin: 0;
 }
 #spthx ul.g1 {
  display: grid;
  max-block-size: 9rem;
  max-height: 9rem;
  overflow: scroll;
 }
 #spthx ul.g1 li {
  display: inline-grid;
  background-color: orange;
  margin-bottom: 0.5rem;
  padding: 0.2rem 0;
  grid-template-columns: 7rem auto;
 }
 #spthx ul.g1 li .name {
  padding: 0 0.5rem;
  font-weight: 700;
 }
 #spthx ul.g1 li .comment {
  padding: 0 0.5rem;
 }
 #spthx ul.g2 {
  color: white;
  display: grid;
  grid-template-columns: 50% 50%;
  overflow: scroll;
 }
 #spthx ul.g2 li {
  text-align: center;
 }
 #themeToggleBtn {
  padding: 0 0.7rem;
  width: 6.5rem;
  background-color:#EEEEEE;
  border: none;
  border-radius: 4px;
  font-size: 1.4rem;
  color: #222831;
  line-height: 2.5rem;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  position: fixed;
  z-index:2;
  right: 0.5rem;
  bottom: 0.5rem;
 }
 .head {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 5.2rem;
  font-size: 1.4rem;
  white-space: nowrap;
  color: #EEEEEE;
 }
 .propinitial,
 .selectlist {
  list-style: none;
  flex: 1;
  padding: 1rem;
  overflow: auto;
 }
 .lifeProperty {
  list-style: none;
  padding: 2rem 1rem 0.5rem 4rem;
  display: flex;
  color: #FFFFFF;
  overflow: auto;
 }
 .lifeProperty>li {
  flex: 1;
  margin: 0.1rem 2px;
  display: flex;
  flex-direction: column;
  border: 1px #ccc solid;
  border-radius: 0.2rem;
  font-size: 1rem;
  position: relative;
 }
 .lifeProperty>li>span:last-child {
  background: #eee;
  color: #666;
 }
 .selectlist>li {
  margin-bottom: 0.6rem;
  display: block;
  border: 1px #EEEEEE solid;
  border-radius: 0.2rem;
  color: #EEEEEE;
  font-size: 1.2rem;
  line-height: 1.6;
  user-select: none;
  position: relative;
  cursor: pointer;
 }
 .selectlist>li:last-child {
  margin-bottom: 0;
 }
 .grade0b {
  background-color: #464646;
  border: #f8f8f8 2px solid !important;
 }
 .grade1b {
  background-color: #6495ed;
  border: #f8f8f8 2px solid !important;
 }
 .grade2b {
  background-color: #e2a7ff;
  border: #f8f8f8 2px solid !important;
 }
 .grade3b {
  background-color: #ffa07a;
  border: #f8f8f8 2px solid !important;
 }
@media (min-width:1080px) {
  .grade0b:hover {
    background-color: #c0c0c0;
    color: #3b3b3b;
    transition: all .3s ease 0s;
  }
  .grade1b:hover {
    background-color: #87cefa;
    color: #3b3b3b;
    transition: all .3s ease 0s;
  }
  .grade2b:hover {
    background-color: #e7beff;
    color: #3b3b3b;
    transition: all .3s ease 0s;
  }
  .grade3b:hover {
    background-color: #f7a989;
    color: #3b3b3b;
    transition: all .3s ease 0s;
  }
 }
 .grade0b.selected {
  background-color: #c0c0c0 !important;
  box-shadow: #ccc 0px 0px 10px;
  color: #3b3b3b;
 }
 .grade1b.selected {
  background-color: #87cefa !important;
  box-shadow: #ccc 0px 0px 10px;
  color: #3b3b3b;
 }
 .grade2b.selected {
  background-color: #e7beff !important;
  box-shadow: #ccc 0px 0px 10px;
  color: #3b3b3b;
 }
 .grade3b.selected {
  background-color: #f1bfac !important;
  box-shadow: #ccc 0px 0px 10px;
  color: #3b3b3b;
 }
 .propinitial {
  display: flex;
  flex-direction: column;
  justify-content: center;
 }
 .propbtn:hover {
  color: #5c5c5c;
  transition: all .2s ease 0s;
 }
 .propinitial>li {
  position: relative;
  margin: 0.1rem auto;
  padding: 0.2rem;
  display: inline-block;
  border-radius: 0.2rem;
  color: #EEEEEE;
  font-size: 1.6rem;
  line-height: 2;
 }
 .propinitial>li>input {
  height: 2.2rem;
  width: 2.2rem;
  margin: 0 0.5rem;
  padding: 0;
  font-size: 2rem;
  border: 0.1rem #EEEEEE solid;
  background-color: #393E46;
  color: #EEEEEE;
  text-align: center;
 }
 .propbtn {
  position: relative;
  cursor: pointer;
  font-size: 2rem;
  color: #EEEEEE;
 }
 .judge>li>span:nth-child(1),
 .lifeTrajectory>li>span:nth-child(1) {
  width: 5rem;
  text-align: right;
 }
 .judge>li>span:nth-child(2),
 .lifeTrajectory>li>span:nth-child(2) {
  flex: 1;
  text-align: left;
 }
 .lifeTrajectory {
  flex: 1;
  margin: 0.5rem 1rem;
  padding: 0;
  border: 1px #9b9b9b solid;
  background-color: #393E46;
  border-radius: 4px;
  overflow: auto;
 }
 .lifeTrajectory>li {
  margin: 10px 0;
  padding: 5px 10px;
  display: flex;
  background-color: #4a5361;
  box-shadow: #EEEEEE 0 0 0.4rem;
  color: #EEEEEE;
  font-size: 1rem;
  position: relative;
 }
 .judge {
  list-style: none;
  flex: 1;
  margin: 1rem;
  display: flex;
  flex-direction: column;
  border: 1px solid #EEEEEE;
  border-radius: 4px;
  overflow: scroll;
 }
 .judge>li {
  flex: 1;
  display: flex;
  align-items: center;
  background-color: #4a5361;
  border-bottom: 1px solid #EEEEEE;
  box-shadow: none;
  color: #EEEEEE;
 }
 .judge>li:last-child {
  border-bottom: 0
 }
 .judge>li.grade1 span,
 .judge>li.grade1 {
  background-color: #87cefa;
  color: #4a5361;
 }
 .judge>li.grade2 span,
 .judge>li.grade2 {
  background-color: #e7beff;
  color: #4a5361;
 }
 .judge>li.grade3 span,
 .judge>li.grade3 {
  background-color: #f7a989;
  color: #4a5361;
 }
@import url("https://fonts.googleapis.com/css?family=Montserrat:400,400i,700");
 :root {
  font-family: "Montserrat";
 }
 html,
 body {
  margin: 0;
  height: 100%;
 }
 body {
  display: flex;
  align-items: center;
  justify-content: center;
 }
 i {
  color: inherit;
 }
 .banners-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9;
 }
 .banner {
  color: white;
  font-weight: 700;
  padding: 2rem;
  display: flex;
  flex-direction: row;
  align-items: center;
 }
 .banner .banner-message {
  flex: 1;
  padding: 0 2rem;
  word-break: break-word;
  overflow: auto;
 }
 .banner .banner-close {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.1rem;
  border-radius: 4px;
  cursor: pointer;
  transition: background 0.3s;
 }
 .banner .iconfont {
  font-size: 2rem;
 }
 .banner .banner-close:hover {
  background: rgba(0, 0, 0, 0.12);
 }
 .banner.success {
  background: lightgreen;
 }
 .banner.success::after {
  background: lightgreen;
 }
 .banner.error {
  background: #ed1c24;
 }
 .banner.error::after {
  background: #ed1c24;
 }
 .banner.info {
  background: skyblue;
 }
 .banner.info::after {
  background: skyblue;
 }
 .banner::after {
  content: "";
  position: absolute;
  height: 10%;
  width: 100%;
  bottom: 100%;
  left: 0;
 }
 .banner:not(.visible) {
  display: none;
  transform: translateY(-100%);
 }
 .banner.visible {
  box-shadow: 0 2px 2px 2px rgba(0, 0, 0, 0.12);
  animation-name: banner-in;
  animation-direction: forwards;
  animation-duration: 0.6s;
  animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
  animation-iteration-count: 1;
 }
@keyframes banner-in {
  0% {
    transform: translateY(-100%);
  }
  50% {
    transform: translateY(10%);
  }
  100% {
    transform: translateY(0);
  }
 }
 .show-banner {
  appearance: none;
  background: #ededed;
  border: 0;
  padding: 1rem 2rem;
  border-radius: 4px;
  cursor: pointer;
  text-transform: uppercase;
  margin: 0.25rem;
 }
 /**
 * @license
 * Copyright Akveo. All Rights Reserved.
 * Licensed under the MIT License. See License.txt in the project root for license information.
 */
 .eva-animation {
  animation-duration: 1s;
  animation-fill-mode: both;
 }
 .eva-infinite {
  animation-iteration-count: infinite;
 }
 .eva-icon-shake {
  animation-name: eva-shake;
 }
 .eva-icon-zoom {
  animation-name: eva-zoomIn;
 }
 .eva-icon-pulse {
  animation-name: eva-pulse;
 }
 .eva-icon-flip {
  animation-name: eva-flipInY;
 }
 .eva-hover {
  display: inline-block;
 }
 .eva-hover:hover .eva-icon-hover-shake,
 .eva-parent-hover:hover .eva-icon-hover-shake {
  animation-name: eva-shake;
 }
 .eva-hover:hover .eva-icon-hover-zoom,
 .eva-parent-hover:hover .eva-icon-hover-zoom {
  animation-name: eva-zoomIn;
 }
 .eva-hover:hover .eva-icon-hover-pulse,
 .eva-parent-hover:hover .eva-icon-hover-pulse {
  animation-name: eva-pulse;
 }
 .eva-hover:hover .eva-icon-hover-flip,
 .eva-parent-hover:hover .eva-icon-hover-flip {
  animation-name: eva-flipInY;
 }
@keyframes eva-flipInY {
  from {
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    animation-timing-function: ease-in;
  }
  60% {
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }
  80% {
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }
  to {
    transform: perspective(400px);
  }
 }
@keyframes eva-shake {
  from,
  to {
    transform: translate3d(0, 0, 0);
  }
  10%,
  30%,
  50%,
  70%,
  90% {
    transform: translate3d(-3px, 0, 0);
  }
  20%,
  40%,
  60%,
  80% {
    transform: translate3d(3px, 0, 0);
  }
 }
@keyframes eva-pulse {
  from {
    transform: scale3d(1, 1, 1);
  }
  50% {
    transform: scale3d(1.2, 1.2, 1.2);
  }
  to {
    transform: scale3d(1, 1, 1);
  }
 }
@keyframes eva-zoomIn {
  from {
    opacity: 1;
    transform: scale3d(0.5, 0.5, 0.5);
  }
  50% {
    opacity: 1;
  }
 }
 ::-webkit-scrollbar {
  width: 0 !important
 }
 .deleteFixed {
  margin: 0;
  padding: 0.5rem 1rem;
  border: 0;
  border-radius: 0;
  overflow: visible;
 }
 .operateBtn {
  padding: 0.5rem 1.5rem;
  border: 1px #EEEEEE solid;
  border-radius: 0.2rem;
  background-color:#393E46;
  font-size: 1.6rem;
  white-space: nowrap;
  transform: translate(-50%,-50%);
  cursor: pointer;
  z-index:2;
  color: #EEEEEE;
 }
 .operateBtn:hover {
  background: #ff7878;
  color: #fff;
  transition: all .4s ease 0s;
 }
 .domToImage2wx {
  position: fixed;
  z-index: 1111;
  width: 100%;
 }
 .domToImage2wx img {
  width: 100%;
 }
--- a/view/images/icons/icon-128x128.png
+++ b/view/images/icons/icon-128x128.png
--- a/view/images/icons/icon-144x144.png
+++ b/view/images/icons/icon-144x144.png
--- a/view/images/icons/icon-152x152.png
+++ b/view/images/icons/icon-152x152.png
--- a/view/images/icons/icon-192x192.png
+++ b/view/images/icons/icon-192x192.png
--- a/view/images/icons/icon-384x384.png
+++ b/view/images/icons/icon-384x384.png
--- a/view/images/icons/icon-512x512.png
+++ b/view/images/icons/icon-512x512.png
--- a/view/images/icons/icon-72x72.png
+++ b/view/images/icons/icon-72x72.png
--- a/view/images/icons/icon-96x96.png
+++ b/view/images/icons/icon-96x96.png
--- a/view/index.html
+++ b/view/index.html
@@ -4,13 +4,13 @@
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="stylesheet" href="style.css">
+    <meta name="description" content="やり直すんだ。そして、次はうまくやる。"/>
-    <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
+    <meta name="keywords" content="人生重开模拟器 liferestart life restart remake 人生重来"/>
-    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
+    <title>Life Restart</title>
-    <script>window.json = async fileName=>(await axios(`../data/${fileName}.json`)).data;</script>
+    <link id="themeLink" rel="stylesheet" href="light.css">
-    <title>Document</title>
+    <link rel="manifest" href="./manifest.json">
 </head>
-<body style="margin: 0; height: 100%">
+<body>
  <div class="banners-container">
    <div class="banners">
      <div class="banner error">
@@ -30,18 +30,23 @@
      </div>
    </div>
  </div>
  <a href="https://github.com/VickScarlet/lifeRestart" class="github-corner" style="z-index: 9999;" aria-label="View source on GitHub"><svg width="80" height="80" viewBox="0 0 250 250" style="fill:#151513; color:#fff; position: absolute; top: 0; border: 0; left: 0; transform: scale(-1, 1);" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style></a>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/dom-to-image/2.6.0/dom-to-image.js" integrity="sha512-wUa0ktp10dgVVhWdRVfcUO4vHS0ryT42WOEcXjVVF2+2rcYBKTY7Yx7JCEzjWgPV+rj2EDUr8TwsoWF6IoIOPg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
  <script src="../public/bundle.js"></script>
  <script>
    if ('serviceWorker' in navigator) {
      window.addEventListener('load', function () {
        navigator.serviceWorker.register('./sw.js', {scope: '.'})
          .then(function (registration) {
            console.log('ServiceWorker registration successful');
          })
          .catch(function (err) {
            console.log('ServiceWorker registration failed');
          });
      });
    }
  </script>
 </body>
 <script>
    // Pssst, I've created a github package - https://github.com/brookesb91/dismissible
    const hideBanners = (e) => {
        document
            .querySelectorAll(".banner.visible")
            .forEach((b) => b.classList.remove("visible"));
    };
 </script>
 <script type="module">
    import App from '../src/app.js';
    const app = new App();
    app.initial();
 </script>
 </html>
--- a/view/light.css
+++ b/view/light.css
@@ -0,0 +1,790 @@
@media (min-width:640px){html{font-size:24px;}}
@media (min-width:631px) and (max-width:639px){html{font-size:23.66px;}}
@media (min-width:622px) and (max-width:630px){html{font-size:23.33px;}}
@media (min-width:613px) and (max-width:621px){html{font-size:23px;}}
@media (min-width:604px) and (max-width:612px){html{font-size:22.66px;}}
@media (min-width:595px) and (max-width:603px){html{font-size:22.33px;}}
@media (min-width:586px) and (max-width:594px){html{font-size:22px;}}
@media (min-width:577px) and (max-width:585px){html{font-size:21.66px;}}
@media (min-width:568px) and (max-width:576px){html{font-size:21.33px;}}
@media (min-width:559px) and (max-width:567px){html{font-size:21px;}}
@media (min-width:550px) and (max-width:558px){html{font-size:20.66px;}}
@media (min-width:541px) and (max-width:549px){html{font-size:20.33px;}}
@media (min-width:533px) and (max-width:540px){html{font-size:20px;}}
@media (min-width:524px) and (max-width:532px){html{font-size:19.66px;}}
@media (min-width:515px) and (max-width:523px){html{font-size:19.33px;}}
@media (min-width:506px) and (max-width:514px){html{font-size:19px;}}
@media (min-width:497px) and (max-width:505px){html{font-size:18.66px;}}
@media (min-width:488px) and (max-width:496px){html{font-size:18.33px;}}
@media (min-width:480px) and (max-width:487px){html{font-size:18px;}}
@media (min-width:471px) and (max-width:479px){html{font-size:17.66px;}}
@media (min-width:462px) and (max-width:470px){html{font-size:17.33px;}}
@media (min-width:453px) and (max-width:461px){html{font-size:17px;}}
@media (min-width:444px) and (max-width:452px){html{font-size:17.12px;}}
@media (min-width:435px) and (max-width:443px){html{font-size:16.33px;}}
@media (min-width:426px) and (max-width:434px){html{font-size:16px;}}
@media (min-width:417px) and (max-width:425px){html{font-size:15.66px;}}
@media (min-width:408px) and (max-width:416px){html{font-size:15.33px;}}
@media (min-width:400px) and (max-width:407px){html{font-size:15px;}}
@media (min-width:391px) and (max-width:399px){html{font-size:14.66px;}}
@media (min-width:382px) and (max-width:390px){html{font-size:14.33px;}}
@media (min-width:374px) and (max-width:381px){html{font-size:14px;}}
@media (min-width:365px) and (max-width:373px){html{font-size:13.66px;}}
@media (min-width:356px) and (max-width:364px){html{font-size:13.33px;}}
@media (min-width:347px) and (max-width:355px){html{font-size:13px;}}
@media (min-width:338px) and (max-width:346px){html{font-size:12.66px;}}
@media (min-width:329px) and (max-width:337px){html{font-size:12.44px;}}
@media (max-width:328px){html{font-size:12px;}}
@font-face {
  font-family: 'iconfont';
  src: url('iconfont.woff2?t=1628944689555') format('woff2'),
    url('iconfont.woff?t=1628944689555') format('woff'),
    url('iconfont.ttf?t=1628944689555') format('truetype');
 }
 * {
  margin: 0;
  padding: 0;
 }
 html {
  font-family: PingFangSC, 'Noto Sans CJK SC', 'MS Yahei';
 }
 body {
  user-select: none;
 }
 #main {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 30rem;
  height: 100%;
  text-align: center;
  box-sizing: border-box;
  position: relative;
 }
 #title {
  position: fixed;
  font-size: 3rem;
  font-weight: 700;
  top: 35%;
  left: 50%;
  white-space: nowrap;
  transform: translate(-50%, -50%);
  color: #000;
 }
 #restart {
  position: fixed;
  top: 65%;
  left: 50%;
  transform: translate(-50%, -50%);
 }
 #restart .iconfont {
  margin-right: 0.5rem;
 }
 #next {
  display: none;
 }
 #talentSelectedView {
  flex: 0 1 auto;
 }
 .mainbtn {
  margin: 0.5rem 1rem 1rem;
  padding: 0.5rem 1.5rem;
  background-color: #FFFFFF;
  border: 1px #CCCCCC solid;
  border-radius: 0.2rem;
  color: #000000;
  font-size: 1.6rem;
  white-space: nowrap;
  cursor: pointer;
 }
 .mainbtn:hover {
  background: #ff7878;
  color: #FFFFFF;
  transition: all .4s ease 0s;
 }
 .btn-area {
  display: flex;
  flex-direction: row;
 }
 .btn-area>.mainbtn {
  flex: 1;
 }
 .iconfont {
  display: inline-block;
  vertical-align: middle;
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 }
 .sponsor,
 #specialthanks,
 #rank {
  position: fixed;
  top: 4rem;
  right: 1rem;
  padding: 0.1rem;
  width: 6rem;
  border: none;
  border-radius: 0.2rem;
  background-color:lightsteelblue;
  font-size: 1.4rem;
  color: #EEEEEE;
  cursor: pointer;
  z-index:2;
  word-wrap: none;
 }
 #specialthanks {
  background-color: #5865F2;
  top: 1rem;
 }
 .sponsor {
  top: auto;
  bottom: 0;
  width: auto;
  padding: 0.5rem;
 }
 #spthx {
  position: fixed;
  display: grid;
  top: 4rem;
  bottom: 5rem;
  left: 50%;
  width: 30rem;
  max-width: calc(100% - 2rem);
  transform: translateX(-50%);
 }
 #spthx ul {
    list-style-type: none;
    padding: 0;
 }
 #spthx ul li {
  margin: 0;
 }
 #spthx ul.g1 {
  display: grid;
  max-block-size: 9rem;
  max-height: 9rem;
  overflow: scroll;
 }
 #spthx ul.g1 li {
  display: inline-grid;
  background-color: orange;
  margin-bottom: 0.5rem;
  padding: 0.2rem 0;
  grid-template-columns: 7rem auto;
 }
 #spthx ul.g1 li .name {
  padding: 0 0.5rem;
  font-weight: 700;
 }
 #spthx ul.g1 li .comment {
  padding: 0 0.5rem;
 }
 #spthx ul.g2 {
  color: white;
  display: grid;
  grid-template-columns: 50% 50%;
  overflow: scroll;
 }
 #spthx ul.g2 li {
  text-align: center;
 }
 #themeToggleBtn {
  padding: 0 0.7rem;
  width: 6.5rem;
  background-color:#222831;
  border: none;
  border-radius: 4px;
  font-size: 1.4rem;
  color: #EEEEEE;
  line-height: 2.5rem;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  position: fixed;
  z-index:2;
  right: 0.5rem;
  bottom: 0.5rem;
 }
 .head {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 5.2rem;
  font-size: 1.4rem;
  white-space: nowrap;
  color: #000;
 }
 .propinitial,
 .selectlist {
  list-style: none;
  flex: 1;
  padding: 1rem;
  overflow: auto;
 }
 .lifeProperty {
  list-style: none;
  padding: 2rem 1rem 0.5rem 4rem;
  display: flex;
  color: #FFFFFF;
  overflow: auto;
 }
 .lifeProperty>li {
  flex: 1;
  margin: 0.1rem 2px;
  display: flex;
  flex-direction: column;
  background-color: #393E46;
  border: 1px #ccc solid;
  border-radius: 0.2rem;
  font-size: 1rem;
  position: relative;
 }
 .lifeProperty>li>span:last-child {
  background: #fff;
  color: #000;
 }
 .selectlist>li {
  margin-bottom: 0.6rem;
  display: block;
  border: 1px #EEEEEE solid;
  border-radius: 0.2rem;
  color: #666;
  font-size: 1.2rem;
  line-height: 1.6;
  user-select: none;
  position: relative;
  cursor: pointer;
 }
 .selectlist>li:last-child {
  margin-bottom: 0;
 }
 .propinitial {
  display: flex;
  flex-direction: column;
  justify-content: center;
 }
 .propbtn:hover {
  color: #5c5c5c;
  transition: all .2s ease 0s;
 }
 .propinitial>li {
  position: relative;
  margin: 0.1rem auto;
  padding: 0.2rem;
  display: inline-block;
  border-radius: 0.2rem;
  color: #000;
  font-size: 1.6rem;
  line-height: 2;
 }
 .propinitial>li>input {
  height: 2.2rem;
  width: 2.2rem;
  margin: 0 0.5rem;
  padding: 0;
  font-size: 2rem;
  border: 0.1rem #000 solid;
  background-color: #fff;
  color: #000;
  text-align: center;
 }
 .propbtn {
  position: relative;
  cursor: pointer;
  font-size: 2rem;
  color: #000;
 }
 .judge>li>span:nth-child(1),
 .lifeTrajectory>li>span:nth-child(1) {
  width: 5rem;
  text-align: right;
 }
 .judge>li>span:nth-child(2),
 .lifeTrajectory>li>span:nth-child(2) {
  flex: 1;
  text-align: left;
 }
 .lifeTrajectory {
  flex: 1;
  margin: 0.5rem 1rem;
  padding: 0;
  border: 1px #9b9b9b solid;
  background-color: #393E46;
  border-radius: 4px;
  overflow: auto;
 }
 .lifeTrajectory>li {
  margin: 10px 0;
  padding: 5px 10px;
  display: flex;
  background-color: #4a5361;
  box-shadow: #EEEEEE 0 0 0.4rem;
  color: #EEEEEE;
  font-size: 1rem;
  position: relative;
 }
 .judge {
  list-style: none;
  flex: 1;
  margin: 1rem;
  display: flex;
  flex-direction: column;
  border: 1px solid #EEEEEE;
  border-radius: 4px;
  overflow: scroll;
 }
 .judge>li {
  flex: 1;
  display: flex;
  align-items: center;
  background-color: #4a5361;
  border-bottom: 1px solid #EEEEEE;
  box-shadow: none;
  color: #EEEEEE;
 }
 .judge>li:last-child {
  border-bottom: 0
 }
 .judge>li.grade1 span,
 .judge>li.grade1 {
  background-color: #87cefa;
  color: #4a5361;
 }
 .judge>li.grade2 span,
 .judge>li.grade2 {
  background-color: #e7beff;
  color: #4a5361;
 }
 .judge>li.grade3 span,
 .judge>li.grade3 {
  background-color: #f7a989;
  color: #4a5361;
 }
@import url("https://fonts.googleapis.com/css?family=Montserrat:400,400i,700");
 :root {
  font-family: "Montserrat";
 }
 html,
 body {
  margin: 0;
  height: 100%;
 }
 body {
  display: flex;
  align-items: center;
  justify-content: center;
 }
 i {
  color: inherit;
 }
 .banners-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9;
 }
 .banner {
  color: white;
  font-weight: 700;
  padding: 2rem;
  display: flex;
  flex-direction: row;
  align-items: center;
 }
 .banner .banner-message {
  flex: 1;
  padding: 0 2rem;
  word-break: break-word;
  overflow: auto;
 }
 .banner .banner-close {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.1rem;
  border-radius: 4px;
  cursor: pointer;
  transition: background 0.3s;
 }
 .banner .iconfont {
  font-size: 2rem;
 }
 .banner .banner-close:hover {
  background: rgba(0, 0, 0, 0.12);
 }
 .banner.success {
  background: lightgreen;
 }
 .banner.success::after {
  background: lightgreen;
 }
 .banner.error {
  background: #ed1c24;
 }
 .banner.error::after {
  background: #ed1c24;
 }
 .banner.info {
  background: skyblue;
 }
 .banner.info::after {
  background: skyblue;
 }
 .banner::after {
  content: "";
  position: absolute;
  height: 10%;
  width: 100%;
  bottom: 100%;
  left: 0;
 }
 .banner:not(.visible) {
  display: none;
  transform: translateY(-100%);
 }
 .banner.visible {
  box-shadow: 0 2px 2px 2px rgba(0, 0, 0, 0.12);
  animation-name: banner-in;
  animation-direction: forwards;
  animation-duration: 0.6s;
  animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
  animation-iteration-count: 1;
 }
 .grade0b {
  background-color: #ededed;
  border: #c5c5c5 2px solid !important;
 }
 .grade1b {
  background-color: #7ea5ec;
  border: #c5c5c5 2px solid !important;
 }
 .grade2b {
  background-color: #e2a7ff;
  border: #c5c5c5 2px solid !important;
 }
 .grade3b {
  background-color: #ffa07a;
  border: #c5c5c5 2px solid !important;
 }
@media (min-width:1080px) {
  .grade0b:hover {
    background-color: #868686;
    transition: all .3s ease 0s;
  }
  .grade1b:hover {
    background-color: #5d90ff;
    color: #3b3b3b;
    transition: all .3s ease 0s;
  }
  .grade2b:hover {
    background-color: #bc72ec;
    color: #3b3b3b;
    transition: all .3s ease 0s;
  }
  .grade3b:hover {
    background-color: #e09074;
    color: #3b3b3b;
    transition: all .3s ease 0s;
  }
 }
 .grade0b.selected {
  background-color: #444 !important;
  box-shadow: #bbb 0px 0px 10px;
  color: #fff;
 }
 .grade1b.selected {
  background-color: #407dec !important;
  box-shadow: #bbb 0px 0px 10px;
  color: #fff;
 }
 .grade2b.selected {
  background-color: #b362e7 !important;
  box-shadow: #bbb 0px 0px 10px;
  color: #fff;
 }
 .grade3b.selected {
  background-color: #ff7f4d !important;
  box-shadow: #bbb 0px 0px 10px;
  color: #fff;
 }
@keyframes banner-in {
  0% {
    transform: translateY(-100%);
  }
  50% {
    transform: translateY(10%);
  }
  100% {
    transform: translateY(0);
  }
 }
 .show-banner {
  appearance: none;
  background: #ededed;
  border: 0;
  padding: 1rem 2rem;
  border-radius: 4px;
  cursor: pointer;
  text-transform: uppercase;
  margin: 0.25rem;
 }
 /**
 * @license
 * Copyright Akveo. All Rights Reserved.
 * Licensed under the MIT License. See License.txt in the project root for license information.
 */
 .eva-animation {
  animation-duration: 1s;
  animation-fill-mode: both;
 }
 .eva-infinite {
  animation-iteration-count: infinite;
 }
 .eva-icon-shake {
  animation-name: eva-shake;
 }
 .eva-icon-zoom {
  animation-name: eva-zoomIn;
 }
 .eva-icon-pulse {
  animation-name: eva-pulse;
 }
 .eva-icon-flip {
  animation-name: eva-flipInY;
 }
 .eva-hover {
  display: inline-block;
 }
 .eva-hover:hover .eva-icon-hover-shake,
 .eva-parent-hover:hover .eva-icon-hover-shake {
  animation-name: eva-shake;
 }
 .eva-hover:hover .eva-icon-hover-zoom,
 .eva-parent-hover:hover .eva-icon-hover-zoom {
  animation-name: eva-zoomIn;
 }
 .eva-hover:hover .eva-icon-hover-pulse,
 .eva-parent-hover:hover .eva-icon-hover-pulse {
  animation-name: eva-pulse;
 }
 .eva-hover:hover .eva-icon-hover-flip,
 .eva-parent-hover:hover .eva-icon-hover-flip {
  animation-name: eva-flipInY;
 }
@keyframes eva-flipInY {
  from {
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    animation-timing-function: ease-in;
  }
  60% {
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }
  80% {
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }
  to {
    transform: perspective(400px);
  }
 }
@keyframes eva-shake {
  from,
  to {
    transform: translate3d(0, 0, 0);
  }
  10%,
  30%,
  50%,
  70%,
  90% {
    transform: translate3d(-3px, 0, 0);
  }
  20%,
  40%,
  60%,
  80% {
    transform: translate3d(3px, 0, 0);
  }
 }
@keyframes eva-pulse {
  from {
    transform: scale3d(1, 1, 1);
  }
  50% {
    transform: scale3d(1.2, 1.2, 1.2);
  }
  to {
    transform: scale3d(1, 1, 1);
  }
 }
@keyframes eva-zoomIn {
  from {
    opacity: 1;
    transform: scale3d(0.5, 0.5, 0.5);
  }
  50% {
    opacity: 1;
  }
 }
 ::-webkit-scrollbar {
  width: 0 !important
 }
 .deleteFixed {
  margin: 0;
  padding: 0.5rem 1rem;
  border: 0;
  border-radius: 0;
  overflow: visible;
 }
 .operateBtn {
  padding: 0.5rem 1.5rem;
  border: 1px #EEEEEE solid;
  border-radius: 0.2rem;
  background-color:#393E46;
  font-size: 1.6rem;
  white-space: nowrap;
  transform: translate(-50%,-50%);
  cursor: pointer;
  z-index:2;
  color: #EEEEEE;
 }
 .operateBtn:hover {
  background: #ff7878;
  color: #fff;
  transition: all .4s ease 0s;
 }
 .domToImage2wx {
  position: fixed;
  z-index: 1111;
  width: 100%;
 }
 .domToImage2wx img {
  width: 100%;
 }
--- a/view/manifest.json
+++ b/view/manifest.json
@@ -0,0 +1,51 @@
 {
  "icons": [
    {
      "src": "./images/icons/icon-72x72.png",
      "sizes": "72x72",
      "type": "image/png"
    },
    {
      "src": "./images/icons/icon-96x96.png",
      "sizes": "96x96",
      "type": "image/png"
    },
    {
      "src": "./images/icons/icon-128x128.png",
      "sizes": "128x128",
      "type": "image/png"
    },
    {
      "src": "./images/icons/icon-144x144.png",
      "sizes": "144x144",
      "type": "image/png"
    },
    {
      "src": "./images/icons/icon-152x152.png",
      "sizes": "152x152",
      "type": "image/png"
    },
    {
      "src": "./images/icons/icon-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "./images/icons/icon-384x384.png",
      "sizes": "384x384",
      "type": "image/png"
    },
    {
      "src": "./images/icons/icon-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ],
  "name": "人生重开模拟器",
  "short_name": "LifeRestart",
  "orientation": "portrait",
  "display": "standalone",
  "start_url": "/view/index.html",
  "description": "人生重开模拟器",
  "background_color": "#ffffff"
 }
--- a/view/style.css
+++ b/view/style.css
@@ -1,457 +0,0 @@
@media (min-width:640px){html{font-size:24px;}}
@media (min-width:631px) and (max-width:639px){html{font-size:23.66px;}}
@media (min-width:622px) and (max-width:630px){html{font-size:23.33px;}}
@media (min-width:613px) and (max-width:621px){html{font-size:23px;}}
@media (min-width:604px) and (max-width:612px){html{font-size:22.66px;}}
@media (min-width:595px) and (max-width:603px){html{font-size:22.33px;}}
@media (min-width:586px) and (max-width:594px){html{font-size:22px;}}
@media (min-width:577px) and (max-width:585px){html{font-size:21.66px;}}
@media (min-width:568px) and (max-width:576px){html{font-size:21.33px;}}
@media (min-width:559px) and (max-width:567px){html{font-size:21px;}}
@media (min-width:550px) and (max-width:558px){html{font-size:20.66px;}}
@media (min-width:541px) and (max-width:549px){html{font-size:20.33px;}}
@media (min-width:533px) and (max-width:540px){html{font-size:20px;}}
@media (min-width:524px) and (max-width:532px){html{font-size:19.66px;}}
@media (min-width:515px) and (max-width:523px){html{font-size:19.33px;}}
@media (min-width:506px) and (max-width:514px){html{font-size:19px;}}
@media (min-width:497px) and (max-width:505px){html{font-size:18.66px;}}
@media (min-width:488px) and (max-width:496px){html{font-size:18.33px;}}
@media (min-width:480px) and (max-width:487px){html{font-size:18px;}}
@media (min-width:471px) and (max-width:479px){html{font-size:17.66px;}}
@media (min-width:462px) and (max-width:470px){html{font-size:17.33px;}}
@media (min-width:453px) and (max-width:461px){html{font-size:17px;}}
@media (min-width:444px) and (max-width:452px){html{font-size:17.12px;}}
@media (min-width:435px) and (max-width:443px){html{font-size:16.33px;}}
@media (min-width:426px) and (max-width:434px){html{font-size:16px;}}
@media (min-width:417px) and (max-width:425px){html{font-size:15.66px;}}
@media (min-width:408px) and (max-width:416px){html{font-size:15.33px;}}
@media (min-width:400px) and (max-width:407px){html{font-size:15px;}}
@media (min-width:391px) and (max-width:399px){html{font-size:14.66px;}}
@media (min-width:382px) and (max-width:390px){html{font-size:14.33px;}}
@media (min-width:374px) and (max-width:381px){html{font-size:14px;}}
@media (min-width:365px) and (max-width:373px){html{font-size:13.66px;}}
@media (min-width:356px) and (max-width:364px){html{font-size:13.33px;}}
@media (min-width:347px) and (max-width:355px){html{font-size:13px;}}
@media (min-width:338px) and (max-width:346px){html{font-size:12.66px;}}
@media (min-width:329px) and (max-width:337px){html{font-size:12.44px;}}
@media (max-width:328px){html{font-size:12px;}}
@font-face {
    font-family: 'iconfont';
    src: url('iconfont.woff2?t=1628944689555') format('woff2'),
            url('iconfont.woff?t=1628944689555') format('woff'),
            url('iconfont.ttf?t=1628944689555') format('truetype');
 }
 html {
    font-family: PingFangSC, 'Noto Sans CJK SC', 'MS Yahei';
 }
 #main {
    align-content: center;
    width: 100%;
    height: 100%;
    position: relative;
 }
 #title {
    position: fixed;
    font-size: 3rem;
    font-weight: 700;
    top: 35%;
    left: 50%;
    white-space: nowrap;
    transform: translate(-50%,-50%);
    text-align: center;
 }
 .mainbtn {
    position: fixed;
    top: 65%;
    left: 50%;
    padding: 0.8rem 1rem;
    border: 1px #ccc solid;
    border-radius: 0.2rem;
    background-color:white;
    font-size: 1.6rem;
    white-space: nowrap;
    transform: translate(-50%,-50%);
    cursor: pointer;
    z-index:2;
 }
 .iconfont {
    font-family: "iconfont" !important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
 }
 #rank {
    position: fixed;
    top: 1rem;
    right: 1rem;
    padding: 0.1rem 1rem;
    border: none;
    border-radius: 0.2rem;
    background-color:lightsteelblue;
    font-size: 1.4rem;
    color: white;
    cursor: pointer;
    z-index:2;
 }
 .head {
    position: fixed;
    font-size: 1.4rem;
    top: 1.1rem;
    left: 50%;
    white-space: nowrap;
    transform: translateX(-50%);
    text-align: center;
 }
 .judge,
 .lifeTrajectory,
 .propinitial,
 .selectlist {
    position: fixed;
    list-style-type: none;
    left: 50%;
    top: 5rem;
    bottom: 8.5rem;
    width: 30rem;
    max-width: calc(100% - 2rem);
    margin: auto;
    padding: 0;
    overflow: auto;
    transform: translateX(-50%);
 }
 .selectlist > li {
    position: relative;
    border: 1px #ccc solid;
    display: inline-block;
    width: 95%;
    margin: 0.1rem auto;
    font-size: 1.4rem;
    text-align: center;
    border-radius: 0.2rem;
    cursor: pointer;
 }
 .selectlist > li::before {
    position: absolute;
    display: inline-block;
    left: 0;
    top: 0;
    border-radius: 0.2rem 0 0 0.2rem;
    margin: -1px;
    padding: 1px;
    height: 100%;
    width: 1.5rem;
    content: "　";
 }
 .grade1,
 .grade1b::before {
    background-color: rgb(116, 191, 255) !important;
 }
 .grade2,
 .grade2b::before {
    background-color: rgb(226, 167, 255) !important;
 }
 .grade3,
 .grade3b::before {
    background-color: lightsalmon !important;
 }
 .selected {
    background-color: gray;
    color: white;
 }
 .propinitial {
    top: 6rem;
    bottom: 14rem;
 }
 .propinitial > li {
    position: relative;
    display: inline-block;
    width: 95%;
    margin: 0.1rem auto;
    font-size: 1.4rem;
    text-align: center;
    border-radius: 0.2rem;
    padding: 0.2rem;
 }
 .propinitial > li > input {
    height: 2.2rem;
    width: 2.2rem;
    margin: 0 0.5rem;
    padding: 0;
    text-align: center;
    font-size: 2rem;
    border: 0.1rem #ccc solid;
 }
 .propbtn {
    position: relative;
    cursor: pointer;
    font-size: 2rem;
 }
 .lifeTrajectory {
    border: 1px lightblue solid;
    background-color: aliceblue;
 }
 .judge > li,
 .lifeTrajectory > li {
    position: relative;
    width: calc(100% - 7rem);
    margin: 0.5rem 0;
    padding: 0.5rem 1rem 0.5rem 6rem;
    font-size: 1.4rem;
    background-color: white;
    box-shadow: lightblue 0 0 0.4rem;
 }
 .judge > li > span,
 .lifeTrajectory > li > span {
    position: absolute;
    left: 0;
    width: 6rem;
    text-align: right;
 }
 .judge > li {
    box-shadow: lightgray 0 0 0.4rem;
    width: calc(100% - 9rem);
    margin: 0.5rem;
    padding: 0.5rem 1rem 0.5rem 7rem;
 }
 .judge > li > span {
    background-color: white;
    height: calc(100% - 1rem);
    padding: 0.5rem 0;
    top: 0;
 }
@import url("https://fonts.googleapis.com/css?family=Montserrat:400,400i,700");
 :root {
  font-family: "Montserrat";
 }
 html,
 body {
  margin: 0;
  height: 100%;
 }
 body {
  display: flex;
  align-items: center;
  justify-content: center;
 }
 i {
  color: inherit;
 }
 .banners-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9;
 }
 .banner {
  color: white;
  font-weight: 700;
  padding: 2rem;
  display: flex;
  flex-direction: row;
  align-items: center;
 }
 .banner .banner-message {
  flex: 1;
  padding: 0 2rem;
  word-break: break-word;
  overflow: auto;
 }
 .banner .banner-close {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.1rem;
  border-radius: 4px;
  cursor: pointer;
  transition: background 0.3s;
 }
 .banner .iconfont {
  font-size: 2rem;
 }
 .banner .banner-close:hover {
  background: rgba(0, 0, 0, 0.12);
 }
 .banner.success {
  background: lightgreen;
 }
 .banner.success::after {
  background: lightgreen;
 }
 .banner.error {
  background: #ed1c24;
 }
 .banner.error::after {
  background: #ed1c24;
 }
 .banner.info {
  background: skyblue;
 }
 .banner.info::after {
  background: skyblue;
 }
 .banner::after {
  content: "";
  position: absolute;
  height: 10%;
  width: 100%;
  bottom: 100%;
  left: 0;
 }
 .banner:not(.visible) {
  display: none;
  transform: translateY(-100%);
 }
 .banner.visible {
  box-shadow: 0 2px 2px 2px rgba(0, 0, 0, 0.12);
  animation-name: banner-in;
  animation-direction: forwards;
  animation-duration: 0.6s;
  animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
  animation-iteration-count: 1;
 }
@keyframes banner-in {
  0% {
    transform: translateY(-100%);
  }
  50% {
    transform: translateY(10%);
  }
  100% {
    transform: translateY(0);
  }
 }
 .show-banner {
  appearance: none;
  background: #ededed;
  border: 0;
  padding: 1rem 2rem;
  border-radius: 4px;
  cursor: pointer;
  text-transform: uppercase;
  margin: 0.25rem;
 }
 /**
 * @license
 * Copyright Akveo. All Rights Reserved.
 * Licensed under the MIT License. See License.txt in the project root for license information.
 */
 .eva-animation {
    animation-duration: 1s;
    animation-fill-mode: both; }
  .eva-infinite {
    animation-iteration-count: infinite; }
  .eva-icon-shake {
    animation-name: eva-shake; }
  .eva-icon-zoom {
    animation-name: eva-zoomIn; }
  .eva-icon-pulse {
    animation-name: eva-pulse; }
  .eva-icon-flip {
    animation-name: eva-flipInY; }
  .eva-hover {
    display: inline-block; }
  .eva-hover:hover .eva-icon-hover-shake, .eva-parent-hover:hover .eva-icon-hover-shake {
    animation-name: eva-shake; }
  .eva-hover:hover .eva-icon-hover-zoom, .eva-parent-hover:hover .eva-icon-hover-zoom {
    animation-name: eva-zoomIn; }
  .eva-hover:hover .eva-icon-hover-pulse, .eva-parent-hover:hover .eva-icon-hover-pulse {
    animation-name: eva-pulse; }
  .eva-hover:hover .eva-icon-hover-flip, .eva-parent-hover:hover .eva-icon-hover-flip {
    animation-name: eva-flipInY; }
  @keyframes eva-flipInY {
    from {
      transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
      animation-timing-function: ease-in;
      opacity: 0; }
    40% {
      transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
      animation-timing-function: ease-in; }
    60% {
      transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
      opacity: 1; }
    80% {
      transform: perspective(400px) rotate3d(0, 1, 0, -5deg); }
    to {
      transform: perspective(400px); } }
  @keyframes eva-shake {
    from,
    to {
      transform: translate3d(0, 0, 0); }
    10%,
    30%,
    50%,
    70%,
    90% {
      transform: translate3d(-3px, 0, 0); }
    20%,
    40%,
    60%,
    80% {
      transform: translate3d(3px, 0, 0); } }
  @keyframes eva-pulse {
    from {
      transform: scale3d(1, 1, 1); }
    50% {
      transform: scale3d(1.2, 1.2, 1.2); }
    to {
      transform: scale3d(1, 1, 1); } }
  @keyframes eva-zoomIn {
    from {
      opacity: 1;
      transform: scale3d(0.5, 0.5, 0.5); }
    50% {
      opacity: 1; } }
--- a/view/sw.js
+++ b/view/sw.js
@@ -0,0 +1,27 @@
 var CACHE_VERSION = 'sw_v1';
 var CACHE_FILES = [
  '/',
 ];
 self.addEventListener('install', function (event) {
  event.waitUntil(
    caches.open(CACHE_VERSION)
    .then(cache => cache.addAll(CACHE_FILES)
      .then(() => self.skipWaiting())
    ));
 });
 self.addEventListener('activate', function (event) {
  event.waitUntil(
    caches.keys().then(function (keys) {
      return Promise.all(keys.map(function (key, i) {
        if (key !== CACHE_VERSION) {
          return caches.delete(keys[i]);
        }
      }));
    })
  );
 });
 self.addEventListener('fetch', function(event) {});
--- a/view/test.html
+++ b/view/test.html
@@ -4,36 +4,35 @@
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="stylesheet" href="style.css">
+    <meta name="description" content="やり直すんだ。そして、次はうまくやる。"/>
-    <script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
+    <meta name="keywords" content="人生重开模拟器 liferestart life restart remake 人生重来"/>
-    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
+    <link id="themeLink" rel="stylesheet" href="light.css">
-    <script>window.json = async fileName=>(await axios(`../data/${fileName}.json`)).data;</script>
+    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-9857163863537600" crossorigin="anonymous"></script>
-    <title>Document</title>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/dom-to-image/2.6.0/dom-to-image.js" integrity="sha512-wUa0ktp10dgVVhWdRVfcUO4vHS0ryT42WOEcXjVVF2+2rcYBKTY7Yx7JCEzjWgPV+rj2EDUr8TwsoWF6IoIOPg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <script type="module" src="../src/index.js"></script>
    <title>Life Restart</title>
 </head>
 <body style="margin: 0; height: 100%">
-    <div id="main">
+  <div class="banners-container">
-        <div class="head">人生总结</div>
+    <div class="banners">
-        <ul id="judge" class="judge" style="bottom: calc(35% + 2.5rem)">
+      <div class="banner error">
-            <li class="grade2"><span>颜值：</span>9级 美若天仙</li>
+        <div class="banner-icon"><span class="iconfont">&#xe6a1;</span></div>
-            <li><span>智力：</span>4级 智力一般</li>
+        <pre class="banner-message">Oops! Something went wrong!</pre>
-            <li><span>体质：</span>1级 极度虚弱</li>
+        <div class="banner-close" onclick="hideBanners()"><span class="iconfont">&#xe6a8;</span></div>
-            <li><span>家境：</span>6级 小康之家</li>
+      </div>
-            <li><span>享年：</span>3岁 早夭</li>
+      <div class="banner success">
-            <li><span>快乐：</span>3级 不太幸福的人生</li>
+        <div class="banner-icon"><span class="iconfont">&#xe6a2;</span></div>
-            <li><span>快乐：</span>3级 不太幸福的人生</li>
+        <pre class="banner-message">Everything was fine!</pre>
-            <li><span>快乐：</span>3级 不太幸福的人生</li>
+        <div class="banner-close" onclick="hideBanners()"><span class="iconfont">&#xe6a8;</span></div>
-            <li><span>快乐：</span>3级 不太幸福的人生</li>
+      </div>
-            <li><span>快乐：</span>3级 不太幸福的人生</li>
+      <div class="banner info">
-            <li><span>快乐：</span>3级 不太幸福的人生</li>
+        <div class="banner-icon"><span class="iconfont">&#xe6a3;</span></div>
-            <li><span>快乐：</span>3级 不太幸福的人生</li>
+        <pre class="banner-message">Here is some useful information</pre>
-            <li><span>快乐：</span>3级 不太幸福的人生</li>
+        <div class="banner-close" onclick="hideBanners()"><span class="iconfont">&#xe6a8;</span></div>
-            <li><span>快乐：</span>3级 不太幸福的人生</li>
+      </div>
        </ul>
        <div class="head" style="top:auto; bottom:35%">天赋，你可以选一个，下辈子还能抽到</div>
        <ul id="talents" class="selectlist" style="top:calc(65% + 0.5rem); bottom:8rem">
            <li class="grade2b">黑幕（面试一定成功）</li>
        </ul>
        <button id="again" class="mainbtn" style="top:auto; bottom:0.1em"><span class="iconfont">&#xe6a7;</span>再次重开</button>
    </div>
  </div>
  <a href="https://github.com/VickScarlet/lifeRestart" class="github-corner" style="z-index: 9999;" aria-label="View source on GitHub"><svg width="80" height="80" viewBox="0 0 250 250" style="fill:#151513; color:#fff; position: absolute; top: 0; border: 0; left: 0; transform: scale(-1, 1);" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style></a>
 </body>
 </html>
--- a/webpack.config.cjs
+++ b/webpack.config.cjs
@@ -0,0 +1,56 @@
 const path = require('path');
 module.exports = {
  mode: 'production',
  entry: './src/index.js',
  devtool: 'eval-cheap-module-source-map',
  devServer: {
    static: [
      {
        directory: path.join(__dirname, 'data'),
        publicPath: '/data',
      },
      {
        directory: path.join(__dirname, 'public'),
        publicPath: '/public',
      },
      {
        directory: path.join(__dirname, 'view'),
        publicPath: '/view',
      },
      {
        directory: path.join(__dirname, 'src'),
        publicPath: '/src',
      },
    ],
  },
  output: {
    path: path.resolve(__dirname, 'public'),
    filename: 'bundle.js',
    clean: true,
  },
  // resolve: {
  //   extensions: ['.js'],
  // },
  module: {
    rules: [{
      test: /\.js$/,
      exclude: /node_modules/,
      use: {
        loader: 'babel-loader',
        options: {
          presets: [
            [
              '@babel/preset-env',
              {
                "targets": "> 0.25%, not dead",
                "useBuiltIns": "usage",
                "corejs": "3.8.3",
              }
            ]
          ]
        }
      }
    }]
  }
 };
--- a/yarn.lock
+++ b/yarn.lock
Author	SHA1	Message	Date
Vick Scarlet	20288a686b	update data	2021-09-08 22:24:27 +08:00
Vick Scarlet	8d280345ed	new bundle	2021-09-08 21:38:36 +08:00
神戸小鳥	0e22119a38	Merge pull request #230 from wwhyes/master style:优化页面布局	2021-09-08 21:37:52 +08:00
神戸小鳥	0ba0286d9c	Merge branch 'master' into master	2021-09-08 21:37:36 +08:00
wuweihui	bbb49741cf	style:优化页面布局	2021-09-08 21:24:41 +08:00
Vick Scarlet	538bd7caee	update sponsor	2021-09-08 21:17:55 +08:00
菜狗	f63bcad8eb	fixbug (STR<3)&((MNY<3)&(EVT?[10009]) > (STR<3)&(MNY<3)&(EVT?[10009])	2021-09-08 20:08:59 +08:00
Vick Scarlet	e420fdf8fd	update data & special thanks	2021-09-08 13:14:50 +08:00
Vick Scarlet	418734cfce	change package.json	2021-09-08 12:58:11 +08:00
Vick Scarlet	d08efd4d3c	update data	2021-09-08 12:54:25 +08:00
Vick Scarlet	0e919dcb8a	update build	2021-09-08 12:35:13 +08:00
Vick Scarlet	31034b064d	fix issue #214 #195	2021-09-08 11:59:47 +08:00
神戸小鳥	a36ef5953b	Merge pull request #211 from Icingworld/patch-1 Update app.js	2021-09-08 10:55:21 +08:00
Vick Scarlet	73405837c9	update build	2021-09-08 10:49:45 +08:00
神戸小鳥	aa887b5b08	Merge pull request #213 from raven3005672/feature/enter-press MOD: 调整回车键逻辑	2021-09-08 10:48:08 +08:00
神戸小鳥	59b8d32232	Merge branch 'master' into feature/enter-press	2021-09-08 10:47:05 +08:00
Vick Scarlet	4c0fc07ff8	update style add TMS property	2021-09-08 10:43:01 +08:00
Vick Scarlet	e18c730d1e	update data	2021-09-08 08:29:49 +08:00
Vick Scarlet	37196e1924	update specialthanks	2021-09-08 08:22:27 +08:00
yanglinbj01	96178012d4	MOD: 调整回车键逻辑	2021-09-08 00:56:45 +08:00
Vick Scarlet	6e135949fe	update build	2021-09-07 21:43:16 +08:00
Vick Scarlet	4964b01eac	fix: dom-to-image add: specialthanks	2021-09-07 21:41:12 +08:00
Icingworld	40ad57dd93	Update app.js	2021-09-07 20:32:25 +08:00
Vick Scarlet	3f3d6dda0f	update data	2021-09-07 18:23:37 +08:00
wz930206	476cafdc4a	新增"人生回放"按钮保存图片功能，目前支持微信浏览器和普通浏览器	2021-09-07 16:49:32 +08:00
Vick Scarlet	01d6cdbff4	update data	2021-09-07 15:59:39 +08:00
Vick Scarlet	df6b130b56	update data	2021-09-07 15:51:52 +08:00
Chaorui Bi	32d7d4b824	fix: 本地调试时html无法访问src下文件，故修复	2021-09-07 12:09:34 +08:00
Arnoldosmium	3b83c7b9e3	change triggered talents to a map + make age related talents multi-triggerable	2021-09-07 12:08:04 +08:00
Hanlin Shi	e3f93818d6	Add action to run npm test Signed-off-by: Hanlin Shi <shihanlin9@gmail.com>	2021-09-07 12:07:51 +08:00
Vick Scarlet	598601cbf2	update data	2021-09-07 12:03:30 +08:00
Vick Scarlet	7766ceb607	update date	2021-09-06 21:32:14 +08:00
Vick Scarlet	3b20e05769	change readme discord badge	2021-09-06 18:15:55 +08:00
Vick Scarlet	b6bbdde260	update new date	2021-09-06 15:48:35 +08:00
Vick Scarlet	824a4a229f	update readme	2021-09-06 15:29:04 +08:00
Xiaoshu Lin	2a3d811187	<fix>亮色主题下属性不显示	2021-09-06 15:15:01 +08:00
Vick Scarlet	403621be40	fix: style bug	2021-09-06 15:13:35 +08:00
Vick Scarlet	84785f3e40	bug fix	2021-09-06 14:40:05 +08:00
Vick Scarlet	1b7ae5f1ff	update new build	2021-09-06 14:12:17 +08:00
shadowdreamer	4a5127fecf	feat: 选三个天赋之后按钮文案变化，加点页面显示已选天赋	2021-09-06 14:08:16 +08:00
Vick Scarlet	1c8628bb3d	update new build	2021-09-06 10:11:24 +08:00
liuxu	160aab5bc2	fix SPR	2021-09-06 09:33:55 +08:00
Chen Yun	eff286199f	在人生活动界面增加实时更新的数值	2021-09-06 03:53:48 +08:00
infinityedge	175f9f869f	Update app.js	2021-09-06 03:52:26 +08:00
infinityedge	43d621324a	Update app.js	2021-09-06 03:52:26 +08:00
infinityedge	d60d8bab51	Update app.js	2021-09-06 03:52:26 +08:00
神戸小鳥	b849b6bf7e	Merge pull request #133 from RomEYer-AwELF/master 调整样式（已经合并了先前修改）	2021-09-06 01:27:42 +08:00
zhangenming	1cf073bc51	use Promise.all for concurrency	2021-09-06 01:19:43 +08:00
Vick Scarlet	d86f2330d5	fix repl bug	2021-09-05 23:32:17 +08:00
Vick Scarlet	ee461384b2	update readme	2021-09-05 22:53:06 +08:00
Vick Scarlet	6928367884	update help	2021-09-05 22:44:04 +08:00
Vick Scarlet	caf08695d1	add repl version	2021-09-05 22:03:44 +08:00
Vick Scarlet	2ec9fc5412	update data	2021-09-05 18:39:20 +08:00
RomEYer-AwELF	156ef662f4	合并修改	2021-09-05 12:25:26 +08:00
RomEYer-AwELF	16bda15111	Merge remote-tracking branch 'origin/master' into master # Conflicts: # view/light.css	2021-09-05 12:18:12 +08:00
RomEYer-AwELF	6789db0997	调整样式	2021-09-05 12:17:05 +08:00
Vick Scarlet	cea157765e	update new build from pr	2021-09-05 11:42:24 +08:00
jingyuexing	bcdb452aa3	change encoding to UTF-8	2021-09-05 10:22:06 +08:00
jingyuexing	2346935149	XLS files convert to CSV files	2021-09-05 10:22:06 +08:00
Brayn Lee	f730eaa0e6	fix(style): fix the issue mentioned in #127	2021-09-05 10:20:39 +08:00
Brayn Lee	7e808e1bde	docs: update README.md	2021-09-05 10:19:06 +08:00
RomEYer-AwELF	22794d3f71	调整样式	2021-09-05 10:16:02 +08:00
Brayn Lee	0195c857d5	fix: fix some issues	2021-09-04 23:48:45 +08:00
RomEYer-AwELF	f105be1882	稍微改了下样式（x	2021-09-04 23:46:44 +08:00
lyc	313dc29a9a	add pwa support	2021-09-04 23:40:07 +08:00
lyc	ac78231a78	add pwa restart	2021-09-04 23:40:07 +08:00
Vick Scarlet	b73e547732	Merge branch 'master' of https://github.com/VickScarlet/lifeRestart	2021-09-04 22:26:39 +08:00
Vick Scarlet	94781e78b0	add google ad head	2021-09-04 22:26:32 +08:00
ViavaCos	86126e7444	style: fix style issue	2021-09-04 14:41:51 +08:00
神戸小鳥	c758f13a10	Merge pull request #69 from KKKKKyle/master fix 出现两次“拿到第一部手机”	2021-09-04 13:15:35 +08:00
Vick Scarlet	d866dc6d7b	module load src/index.js	2021-09-04 12:58:21 +08:00
Vick Scarlet	c358af923a	some fix from pr	2021-09-04 12:53:27 +08:00
神戸小鳥	666862a6b2	Merge pull request #73 from Snarna/master 添加简单的黑色主题模式和简单的bug修复	2021-09-04 12:43:17 +08:00
神戸小鳥	325146e161	Merge branch 'master' into master	2021-09-04 12:41:30 +08:00
Vick Scarlet	48c1b9a6cc	some fix from pr	2021-09-04 12:35:35 +08:00
SukkaW	2c4b276686	fix: hideBanners being undefined	2021-09-04 12:31:23 +08:00
SukkaW	dbac251c76	refactor: use fetch api instead of axios	2021-09-04 12:22:27 +08:00
Vick Scarlet	0cee643697	update style	2021-09-04 10:34:38 +08:00
Vick Scarlet	d3eddf16d3	change meta	2021-09-04 10:05:53 +08:00
Snarna	a90f88049b	Fix Discord button SVG size.	2021-09-03 18:40:09 -04:00
Snarna	af4fca2e71	Relocate dark theme toggle button.	2021-09-03 18:31:41 -04:00
Snarna	e2fe7ef955	Fix incorrect HTML layout.	2021-09-03 18:31:20 -04:00
Benjamin	59678748a8	Merge branch 'VickScarlet:master' into master	2021-09-03 18:10:47 -04:00
Vick Scarlet	d719f2fcbf	change badge style	2021-09-04 01:51:46 +08:00
Vick Scarlet	f1f8172f4e	add discord	2021-09-04 01:42:49 +08:00
Vick Scarlet	cbe51784ba	add discord	2021-09-04 01:36:15 +08:00
Vick Scarlet	c27bac4ea1	add discord	2021-09-04 01:35:38 +08:00
Vick Scarlet	da874adcad	add discord	2021-09-04 01:13:41 +08:00
Snarna	4b1433f22a	Add simple dark mode.	2021-09-03 12:28:48 -04:00
Chentao Wang	4d22567ad4	fix 出现两次“拿到第一部手机” bug出现的原因应该是exclude "(MNY>7)&(EVT?[10412])" 这里写错了，应该是或："(MNY>7)\|(EVT?[10412])"	2021-09-03 23:28:49 +08:00
Vick Scarlet	3c42cfb546	bundle with pr	2021-09-03 21:43:26 +08:00
beautyyuyanli	b0ef08c0c2	forbid user-select for .propbtn	2021-09-03 21:41:07 +08:00
beautyyuyanli	a839eb18cd	use blanks instead of tab	2021-09-03 21:41:07 +08:00
beautyyuyanli	dcba35d5ae	forbid user-select	2021-09-03 21:41:07 +08:00
神戸小鳥	5778ddc0b9	Merge pull request #31 from jiajiu123/master 修改错别字	2021-09-03 21:38:48 +08:00
神戸小鳥	bc4244c99a	Merge branch 'master' into master	2021-09-03 21:32:08 +08:00
sora233	5191569e3e	fix point bug	2021-09-03 21:27:24 +08:00
Vick Scarlet	bb830fa313	add source version	2021-09-03 21:13:43 +08:00
Vick Scarlet	e7427f564c	change babel config	2021-09-03 21:04:08 +08:00
Vick Scarlet	0350ec09c4	add webpack	2021-09-03 20:49:04 +08:00
jiajiu123	99d445638f	Update app.js	2021-09-03 18:06:57 +08:00
Vick Scarlet	6cb60663b6	remove ad	2021-09-03 15:21:50 +08:00
Vick Scarlet	fe761241b3	remve ad	2021-09-03 15:21:16 +08:00
Vick Scarlet	549d9de5ca	add github	2021-09-03 15:20:10 +08:00
Vick Scarlet	36d8f30fe2	test ads	2021-09-03 14:35:25 +08:00
Vick Scarlet	a0974704c3	test ads	2021-09-03 14:33:52 +08:00
Vick Scarlet	177cd4c34e	test ads	2021-09-03 14:31:33 +08:00
Vick Scarlet	b3dd499e17	test ads	2021-09-03 14:20:15 +08:00
Vick Scarlet	ee5842bb1f	add google ad	2021-09-03 14:00:23 +08:00
Vick Scarlet	62acdc845f	fix undead bug	2021-09-03 10:52:24 +08:00
Vick Scarlet	1583a631a5	bug fix data	2021-09-03 10:31:20 +08:00