Skip to content

Commit f58d417

Browse files
liukunupliukunup
committed
Merge branch 'refactor/portal'
2 parents 176d42e + 2d7cb46 commit f58d417

22 files changed

+1187
-90
lines changed

‎docs/.vuepress/client.ts‎

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,26 @@
11
import { defineClientConfig } from 'vuepress/client'
2-
// import RepoCard from 'vuepress-theme-plume/features/RepoCard.vue'
2+
3+
import RepoCard from 'vuepress-theme-plume/features/RepoCard.vue'
34
// import NpmBadge from 'vuepress-theme-plume/features/NpmBadge.vue'
45
// import NpmBadgeGroup from 'vuepress-theme-plume/features/NpmBadgeGroup.vue'
5-
// import Swiper from 'vuepress-theme-plume/features/Swiper.vue'
6+
import Swiper from 'vuepress-theme-plume/features/Swiper.vue'
7+
import Custom from './theme/components/Custom.vue'
68

7-
// import CustomComponent from './theme/components/Custom.vue'
9+
import AllFriendContent from './theme/components/AllFriendContent.vue'
810

9-
// import './theme/styles/custom.css'
11+
import './theme/styles/index.css'
12+
import './theme/styles/custom.css'
1013

1114
export default defineClientConfig({
1215
enhance({ app }) {
1316
// built-in components
14-
// app.component('RepoCard', RepoCard)
17+
app.component('RepoCard', RepoCard)
1518
// app.component('NpmBadge', NpmBadge)
1619
// app.component('NpmBadgeGroup', NpmBadgeGroup)
17-
// app.component('Swiper', Swiper) // you should install `swiper`
20+
app.component('Swiper', Swiper) // you should install `swiper`
1821

1922
// your custom components
20-
// app.component('CustomComponent', CustomComponent)
23+
app.component('Custom', Custom)
24+
app.component('AllFriendContent', AllFriendContent)
2125
},
2226
})

‎docs/.vuepress/navbar.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -109,4 +109,6 @@ export default defineNavbarConfig([
109109
},
110110
]
111111
},
112+
{ text: '友链', link: '/friends/', icon: 'carbon:friendship' },
113+
{ text: '关于', link: '/about/', icon: 'carbon:user' },
112114
])

‎docs/.vuepress/plume.config.ts‎

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,10 @@ export default defineThemeConfig({
2323
appearance: true, // 配置 深色模式
2424

2525
social: [
26-
{ icon: 'github', link: '/' },
26+
{ icon: 'github', link: 'https://github.com/liukunup' },
27+
{ icon: {svg: '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M11.984 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12a12 12 0 0 0 12-12A12 12 0 0 0 12 0zm6.09 5.333c.328 0 .593.266.592.593v1.482a.594.594 0 0 1-.593.592H9.777c-.982 0-1.778.796-1.778 1.778v5.63c0 .327.266.592.593.592h5.63c.982 0 1.778-.796 1.778-1.778v-.296a.593.593 0 0 0-.592-.593h-4.15a.59.59 0 0 1-.592-.592v-1.482a.593.593 0 0 1 .593-.592h6.815c.327 0 .593.265.593.592v3.408a4 4 0 0 1-4 4H5.926a.593.593 0 0 1-.593-.593V9.778a4.444 4.444 0 0 1 4.445-4.444h8.296Z" stroke-width="0.5" stroke="currentColor"/></svg>'}, link: 'https://gitee.com/liukunup' },
28+
// { icon: {svg: ''}, link: 'https://maimai.cn/contact/share/card?u=zdhfdwiwrr5n&_share_channel=copy_link' },
29+
2730
],
2831
// navbarSocialInclude: ['github'], // 允许显示在导航栏的 social 社交链接
2932
// aside: true, // 页内侧边栏， 默认显示在右侧
@@ -49,12 +52,12 @@ export default defineThemeConfig({
4952
* @see https://theme-plume.vuejs.press/config/basic/#profile
5053
*/
5154
profile: {
52-
avatar: 'https://theme-plume.vuejs.press/plume.png',
53-
name: '我的代码温柔如风',
54-
description: '我的博客',
55-
// circle: true,
56-
// location: '',
57-
// organization: '',
55+
avatar: '/avatar.jpg',
56+
name: 'KUN',
57+
description: '资深测试专家',
58+
circle: true,
59+
location: 'Wuhan, China',
60+
organization: 'HomeLab',
5861
},
5962

6063
navbar,

‎docs/.vuepress/public/avatar.jpg‎

38.5 KB
Loading

‎docs/.vuepress/public/logo/maimai.png‎

1.22 KB
Loading

‎docs/.vuepress/public/poster.jpg‎

626 KB
Loading

‎docs/.vuepress/theme/components/AboutMeCharacter.vue‎

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
<script setup>
2+
3+
</script>
4+
5+
<template>
6+
<div class="about-me-card-bg vp-blog-post-item about-me-character">
7+
<p class="about-me-card-title-normal">性格</p>
8+
<div class="about-me-character-content">
9+
<div class="about-me-character-type">
10+
<p class="about-me-card-text-big about-me-card-text-color">架构师</p>
11+
<p class="about-me-card-text-big">INTJ-A</p>
12+
</div>
13+
<div class="about-me-character-img">
14+
</div>
15+
</div>
16+
</div>
17+
</template>
18+
19+
<style scoped>
20+
.about-me-character {
21+
padding: 20px;
22+
23+
&:hover .about-me-character-img {
24+
transform: scale(1.1);
25+
}
26+
}
27+
28+
.about-me-character-content {
29+
display: flex;
30+
}
31+
32+
.about-me-character-type {
33+
width: fit-content;
34+
}
35+
36+
.about-me-character-img {
37+
display: flex;
38+
align-items: end;
39+
position: relative;
40+
flex: 1;
41+
transition: transform 1s;
42+
width: fit-content;
43+
min-height: 110px;
44+
background-image: url("https://www.16personalities.com/static/images/personality-types/avatars/email/large/INTJ_male.png?v=1");
45+
background-position: right bottom;
46+
background-size: contain;
47+
background-repeat: no-repeat;
48+
}
49+
</style>

‎docs/.vuepress/theme/components/AboutMeFriendLink.vue‎

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
<script setup>
2+
import FRIENDS from '../data/friends.json'
3+
</script>
4+
5+
<template>
6+
<div class="about-me-card-bg vp-blog-post-item about-me-friends">
7+
<p class="about-me-card-title-normal">友情链接</p>
8+
<div class="about-me-friends-title">
9+
<p class="about-me-card-text-big about-me-card-text-color">我的好友们</p>
10+
<!-- <router-link to="/more/friends/">
11+
<icon name="game-icons:three-friends"/>
12+
所有好友
13+
</router-link> -->
14+
</div>
15+
<div class="about-me-friends-content">
16+
<a :href="item.link" target="_blank" class="about-me-friends-item" v-for="(item, index) in FRIENDS" :key="index"
17+
:title="item.name+':'+item.link">
18+
<img :src="item.avatar" alt="头像">
19+
</a>
20+
<a href="/friends/" target="_blank" class="about-me-friends-item about-me-card-text-color" title="查看更多好友">
21+
<img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48ZyBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjEuNSI+PHBhdGggZD0iTTE1LjUgMTFhMy41IDMuNSAwIDEgMC03IDBhMy41IDMuNSAwIDAgMCA3IDAiLz48cGF0aCBkPSJNMTUuNDgzIDExLjM1cS40ODQuMTQ5IDEuMDE3LjE1YTMuNSAzLjUgMCAxIDAtMy40ODMtMy44NW0tMi4wMzQgMGEzLjUgMy41IDAgMSAwLTIuNDY2IDMuN00yMiAxNi41YzAtMi43NjEtMi40NjItNS01LjUtNW0xIDhjMC0yLjc2MS0yLjQ2Mi01LTUuNS01cy01LjUgMi4yMzktNS41IDUiLz48cGF0aCBkPSJNNy41IDExLjVjLTMuMDM4IDAtNS41IDIuMjM5LTUuNSA1Ii8+PC9nPjwvc3ZnPg==" alt="更多好友">
22+
</a>
23+
</div>
24+
</div>
25+
</template>
26+
27+
<style scoped>
28+
.about-me-friends-item {
29+
user-select: none;
30+
cursor: pointer;
31+
position: relative;
32+
border-radius: 20%;
33+
width: 80px;
34+
height: 80px;
35+
overflow: hidden;
36+
margin: 10px;
37+
38+
&:hover > img {
39+
transform: scale(1.2);
40+
}
41+
42+
@media screen and (max-width: 770px) {
43+
margin: 5px;
44+
width: 60px;
45+
height: 60px;
46+
}
47+
48+
> img {
49+
width: 100%;
50+
height: 100%;
51+
transition: transform 0.3s ease;
52+
}
53+
}
54+
55+
.about-me-friends-content {
56+
margin-top: 20px;
57+
display: flex;
58+
flex-wrap: wrap;
59+
max-height: 300px;
60+
line-height: 45px;
61+
overflow: hidden;
62+
text-overflow: ellipsis;
63+
64+
@media screen and (max-width: 770px) {
65+
max-height: 200px;
66+
}
67+
}
68+
69+
.about-me-friends {
70+
padding: 20px;
71+
overflow: inherit;
72+
}
73+
74+
.about-me-friends-title {
75+
display: flex;
76+
justify-content: space-between;
77+
78+
> a {
79+
font-size: 16px;
80+
color: var(--vp-c-text-1);
81+
display: inline-flex;
82+
align-items: center;
83+
font-weight: 600;
84+
border-radius: 10px;
85+
padding: 10px;
86+
height: 40px;
87+
transition: background-color 0.2s;
88+
background: var(--vp-c-brand-2);
89+
90+
&:hover {
91+
background: var(--vp-c-brand-1);
92+
}
93+
94+
@media screen and (max-width: 770px) {
95+
padding: 7px;
96+
font-size: 14px;
97+
height: 30px;
98+
border-radius: 5px;
99+
}
100+
}
101+
102+
> p {
103+
display: inline-flex;
104+
}
105+
}
106+
</style>

‎docs/.vuepress/theme/components/AboutMeLife.vue‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
<template>
2+
<div class="about-me-card-bg vp-blog-post-item about-me-life">
3+
<div style="margin-left: 20px">
4+
<p class="about-me-card-title-normal">生活</p>
5+
<p class="about-me-card-text-big">我的日常</p>
6+
</div>
7+
<div ref="chartRef" class="chart-container"></div>
8+
</div>
9+
</template>
10+
11+
<script setup>
12+
import { ref, onMounted } from "vue";
13+
import * as echarts from "echarts";
14+
15+
const chartRef = ref(null);
16+
17+
const lifeData = [
18+
{ name: "生活", value: 5 },
19+
{ name: "阅读", value: 1 },
20+
{ name: "游戏", value: 3 },
21+
{ name: "学习", value: 4 },
22+
{ name: "工作", value: 2 },
23+
];
24+
onMounted(() => {
25+
const myChart = echarts.init(chartRef.value);
26+
27+
const option = {
28+
tooltip: {
29+
trigger: "item",
30+
formatter: (params) => {
31+
return `${params.name}: ${params.percent}%`;
32+
},
33+
},
34+
series: [
35+
{
36+
name: "我的日常",
37+
type: "pie",
38+
radius: ["50%", "80%"],
39+
center: ["50%", "60%"],
40+
startAngle: 180,
41+
endAngle: 360,
42+
data: lifeData,
43+
},
44+
],
45+
};
46+
47+
myChart.setOption(option);
48+
49+
// 响应式调整
50+
window.addEventListener("resize", () => {
51+
myChart.resize();
52+
});
53+
});
54+
</script>
55+
56+
<style scoped>
57+
.about-me-life {
58+
height: 316px;
59+
padding: 20px 0;
60+
overflow: inherit;
61+
}
62+
63+
.chart-container {
64+
height: 100%;
65+
}
66+
</style>

‎docs/.vuepress/theme/components/AboutMeName.vue‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<script setup>
2+
3+
</script>
4+
5+
<template>
6+
<div class="about-me-name">
7+
<p>你好，很高兴认识你！👋</p>
8+
<p class="about-me-card-text-big">你可以叫我 KUN .</p>
9+
<p>是一个靠谱的测试工程师，更是一个爱好广泛的全栈工程师。</p>
10+
</div>
11+
</template>
12+
13+
<style scoped>
14+
.about-me-name {
15+
border-radius: 12px;
16+
justify-content: center;
17+
padding: 2rem;
18+
color: #fff;
19+
background-image: linear-gradient(120deg, var(--vp-c-brand-3), var(--vp-c-brand-soft));
20+
background-size: 200% 200%;
21+
22+
> p {
23+
color: var(--vp-c-text-1);
24+
}
25+
}
26+
</style>

0 commit comments

Comments
 (0)