Skip to content
This repository was archived by the owner on May 11, 2025. It is now read-only.

Commit 521add0

Browse files
zmh-programzmh-program
committed
update frontend
1 parent 2340190 commit 521add0

6 files changed

Lines changed: 100 additions & 83 deletions

File tree

‎gui/.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,3 @@
11
node_modules
22
.idea
3+
dist

‎gui/README.md‎

Lines changed: 0 additions & 46 deletions
This file was deleted.

‎gui/index.html‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,12 @@
55
<meta charset="UTF-8" />
66
<link rel="icon" href="/favicon.ico" />
77
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
8-
<title>TDesign Vue Next Starter</title>
8+
<title>Code Statistic</title>
9+
<meta name="description" content="🔎 Dynamically analysis the code for each language in the repository/user and generate the results for your github account and repo README. 🔎 动态生成用户/仓库中的语言统计，可以作为图片装饰在个人首页和仓库README中" />
10+
<link crossorigin='anonymous' href="https://fonts.googlefonts.cn/css?family=Poppins:wght@200;300;400;500;600&display=swap" rel="stylesheet">
911
</head>
1012
<body>
1113
<div id="app"></div>
1214
<script type="module" src="/src/main.ts"></script>
1315
</body>
14-
</html>
16+
</html>

‎gui/package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,5 +21,5 @@
2121
"vite": "^3.1.0",
2222
"vue-tsc": "^0.40.4"
2323
},
24-
"description": "A tool that dynamically analyses code, counts the amount of code in each language in a repository or user, and generates results."
25-
}
24+
"description": "Dynamically analyse code, counts the amount of code in each language in a repository or user, and generates results."
25+
}

‎gui/src/App.vue‎

Lines changed: 93 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,97 @@
1+
<script setup lang="ts">
2+
</script>
13
<template>
2-
<t-config-provider :global-config="{ classPrefix: 't' }">
3-
<t-space direction="vertical" style="width: 100%; text-align: center">
4-
<logo />
5-
<h3>Welcome to use TDesign！</h3>
6-
<t-space>
7-
<t-button theme="primary">
8-
<add-icon />
9-
新建
10-
</t-button>
11-
<t-button variant="outline">
12-
<cloud-upload-icon />
13-
上传文件
14-
</t-button>
15-
<t-button shape="circle" theme="primary">
16-
<discount-icon />
17-
</t-button>
18-
<t-button shape="circle" theme="primary">
19-
<cloud-download-icon />
20-
</t-button>
21-
<t-button variant="outline"> 搜索 </t-button>
22-
</t-space>
23-
</t-space>
24-
</t-config-provider>
4+
<t-card bordered class="card">
5+
<t-form class="form">
6+
<t-tabs :default-value="1" class="tab">
7+
<t-tab-panel :value="1" label="User"><br>
8+
<t-form-item label="User">
9+
<t-input-adornment prepend="github.com/">
10+
<t-input placeholder="username" />
11+
</t-input-adornment>
12+
</t-form-item>
13+
</t-tab-panel>
14+
<t-tab-panel :value="2" label="Repo"><br>
15+
<t-form-item label="User">
16+
<t-input-adornment prepend="github.com/">
17+
<t-input placeholder="username" />
18+
</t-input-adornment>
19+
</t-form-item>
20+
<t-form-item label="Repo">
21+
<t-input placeholder="repository" />
22+
</t-form-item>
23+
</t-tab-panel>
24+
<t-tab-panel :value="3" label="Release">
25+
</t-tab-panel>
26+
</t-tabs>
27+
<t-form-item label="Theme" name="theme" initial-data="dark">
28+
<t-select defaultValue="light">
29+
<t-option key="light" label="light" value="light" />
30+
<t-option key="dark" label="dark" value="dark" />
31+
</t-select>
32+
</t-form-item>
33+
</t-form>
34+
<t-button id="generate">Generate</t-button>
35+
</t-card>
2536
</template>
2637

27-
<script setup lang="ts">
28-
import {
29-
AddIcon,
30-
CloudUploadIcon,
31-
DiscountIcon,
32-
CloudDownloadIcon,
33-
} from "tdesign-icons-vue-next";
34-
import Logo from "../assets/svg/assets-t-logo.svg?component";
35-
</script>
38+
<style>
39+
html, body {
40+
padding: 0;
41+
margin: 0;
42+
display: flex;
43+
align-items: center;
44+
justify-content: center;
45+
gap: 8px;
46+
width: 100%;
47+
height: 100%;
48+
overflow: auto;
49+
background: #fafcf1;
50+
}
51+
52+
* {
53+
font-family: 'Poppins', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
54+
}
55+
#app {
56+
position: absolute;
57+
top: 8px;
58+
display: flex;
59+
flex-direction: column;
60+
gap: 8px;
61+
margin: 30px;
62+
width: 80%;
63+
min-width: 220px;
64+
max-width: 550px;
65+
}
66+
67+
.card {
68+
width: 100%;
69+
display: grid;
70+
grid-gap: 46px;
71+
}
72+
73+
.form {
74+
width: 100%;
75+
}
76+
77+
.tab {
78+
width: 100%;
79+
margin: 20px 0;
80+
}
81+
82+
#generate {
83+
margin: 0 auto;
84+
}
85+
86+
#preview {
87+
width: 100%;
88+
}
3689
90+
.quote {
91+
width: 20px;
92+
color: black !important;
93+
float: right;
94+
text-decoration: none;
95+
transform: translate(5px, -5px);
96+
}
97+
</style>

‎gui/src/main.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import { createApp } from 'vue'
22
import TDesign from 'tdesign-vue-next';
3-
import 'tdesign-vue-next/es/style/index.css';
43

54
import App from './App.vue'
65

0 commit comments

Comments
 (0)