jiazhizhong/OpenIsle
1
0
Fork 0
mirror of https://github.com/nagisa77/OpenIsle.git synced 2026-03-07 04:20:47 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: update icons

Browse Source
This commit is contained in:
tim
2025-07-12 00:28:40 +08:00
parent eda14105f2
commit 0df116918f
3 changed files with 154 additions and 145 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
open-isle-cli/public/favicon.ico
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.2 KiB

After

Width:  |  Height:  |  Size: 116 KiB

2
open-isle-cli/public/index.html
View File

@@ -7,7 +7,7 @@
<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="icon" href="<%= BASE_URL %>favicon.ico">
<link rel="icon" href="<%= BASE_URL %>favicon.ico?v=20250712">
<title><%= htmlWebpackPlugin.options.title %></title>
<script src="https://accounts.google.com/gsi/client" async defer></script>
</head>

297
open-isle-cli/src/views/ProfileView.vue
View File

@@ -12,19 +12,11 @@
<div class="profile-page-header-user-info">
<div class="profile-page-header-user-info-name">{{ user.username }}</div>
<div class="profile-page-header-user-info-description">{{ user.introduction }}</div>
<div
v-if="!isMine && !subscribed"
class="profile-page-header-subscribe-button"
@click="subscribeUser"
>
<div v-if="!isMine && !subscribed" class="profile-page-header-subscribe-button" @click="subscribeUser">
<i class="fas fa-user-plus"></i>
关注
</div>
<div
v-if="!isMine && subscribed"
class="profile-page-header-unsubscribe-button"
@click="unsubscribeUser"
>
<div v-if="!isMine && subscribed" class="profile-page-header-unsubscribe-button" @click="unsubscribeUser">
<i class="fas fa-user-minus"></i>
取消关注
</div>
@@ -55,7 +47,8 @@
<i class="fas fa-clock"></i>
<div class="profile-tabs-item-label">时间线</div>
</div>
<div :class="['profile-tabs-item', { selected: selectedTab === 'following' }]" @click="selectedTab = 'following'">
<div :class="['profile-tabs-item', { selected: selectedTab === 'following' }]"
@click="selectedTab = 'following'">
<i class="fas fa-user-plus"></i>
<div class="profile-tabs-item-label">关注</div>
</div>
@@ -65,148 +58,143 @@
<l-hatch size="28" stroke="4" speed="3.5" color="var(--primary-color)" />
</div>
<template v-else>
<div v-if="selectedTab === 'summary'" class="profile-summary">
<div class="total-summary">
<div class="summary-title">统计信息</div>
<div class="total-summary-content">
<div class="total-summary-item">
<div class="total-summary-item-label">访问天数</div>
<div class="total-summary-item-value">0</div>
</div>
<div class="total-summary-item">
<div class="total-summary-item-label">已读帖子</div>
<div class="total-summary-item-value">165k</div>
</div>
<div class="total-summary-item">
<div class="total-summary-item-label">已送出</div>
<div class="total-summary-item-value">165k</div>
</div>
<div class="total-summary-item">
<div class="total-summary-item-label">已收到</div>
<div class="total-summary-item-value">165k</div>
<div v-if="selectedTab === 'summary'" class="profile-summary">
<div class="total-summary">
<div class="summary-title">统计信息</div>
<div class="total-summary-content">
<div class="total-summary-item">
<div class="total-summary-item-label">访问天数</div>
<div class="total-summary-item-value">0</div>
</div>
<div class="total-summary-item">
<div class="total-summary-item-label">已读帖子</div>
<div class="total-summary-item-value">165k</div>
</div>
<div class="total-summary-item">
<div class="total-summary-item-label">已送出</div>
<div class="total-summary-item-value">165k</div>
</div>
<div class="total-summary-item">
<div class="total-summary-item-label">已收到</div>
<div class="total-summary-item-value">165k</div>
</div>
</div>
</div>
</div>
<div class="summary-divider">
<div class="hot-reply">
<div class="summary-title">热门回复</div>
<div class="summary-content" v-if="hotReplies.length > 0">
<BaseTimeline :items="hotReplies">
<template #item="{ item }">
在
<router-link
:to="`/posts/${item.comment.post.id}`"
class="timeline-link"
>
{{ item.comment.post.title }}
</router-link>
<template v-if="item.comment.parentComment">
下对
<router-link
:to="`/posts/${item.comment.post.id}#comment-${item.comment.parentComment.id}`"
class="timeline-link"
>
{{ item.comment.parentComment.content }}
<div class="summary-divider">
<div class="hot-reply">
<div class="summary-title">热门回复</div>
<div class="summary-content" v-if="hotReplies.length > 0">
<BaseTimeline :items="hotReplies">
<template #item="{ item }">
在
<router-link :to="`/posts/${item.comment.post.id}`" class="timeline-link">
{{ item.comment.post.title }}
</router-link>
回复了
<template v-if="item.comment.parentComment">
下对
<router-link :to="`/posts/${item.comment.post.id}#comment-${item.comment.parentComment.id}`"
class="timeline-link">
{{ item.comment.parentComment.content }}
</router-link>
回复了
</template>
<template v-else>
下评论了
</template>
<router-link :to="`/posts/${item.comment.post.id}#comment-${item.comment.id}`"
class="timeline-link">
{{ item.comment.content }}
</router-link>
<div class="timeline-date">
{{ formatDate(item.comment.createdAt) }}
</div>
</template>
<template v-else>
下评论了
</BaseTimeline>
</div>
<div v-else>
<div class="summary-empty">暂无热门回复</div>
</div>
</div>
<div class="hot-topic">
<div class="summary-title">热门话题</div>
<div class="summary-content" v-if="hotPosts.length > 0">
<BaseTimeline :items="hotPosts">
<template #item="{ item }">
<router-link :to="`/posts/${item.post.id}`" class="timeline-link">
{{ item.post.title }}
</router-link>
<div class="timeline-snippet">
{{ stripMarkdown(item.post.snippet) }}
</div>
<div class="timeline-date">
{{ formatDate(item.post.createdAt) }}
</div>
</template>
<router-link
:to="`/posts/${item.comment.post.id}#comment-${item.comment.id}`"
class="timeline-link"
>
{{ item.comment.content }}
</router-link>
<div class="timeline-date">
{{ formatDate(item.comment.createdAt) }}
</div>
</template>
</BaseTimeline>
</div>
<div v-else>
<div class="summary-empty">暂无热门回复</div>
</div>
</div>
<div class="hot-topic">
<div class="summary-title">热门话题</div>
<div class="summary-content" v-if="hotPosts.length > 0">
<BaseTimeline :items="hotPosts">
<template #item="{ item }">
<router-link
:to="`/posts/${item.post.id}`"
class="timeline-link"
>
{{ item.post.title }}
</router-link>
<div class="timeline-snippet">
{{ stripMarkdown(item.post.snippet) }}
</div>
<div class="timeline-date">
{{ formatDate(item.post.createdAt) }}
</div>
</template>
</BaseTimeline>
</div>
<div v-else>
<div class="summary-empty">暂无热门话题</div>
</BaseTimeline>
</div>
<div v-else>
<div class="summary-empty">暂无热门话题</div>
</div>
</div>
</div>
</div>
</div>
<div v-else-if="selectedTab === 'timeline'" class="profile-timeline">
<BasePlaceholder v-if="timelineItems.length === 0" text="暂无时间线" icon="fas fa-inbox" />
<BaseTimeline :items="timelineItems">
<template #item="{ item }">
<template v-if="item.type === 'post'">
发布了文章
<router-link :to="`/posts/${item.post.id}`" class="timeline-link">
{{ item.post.title }}
</router-link>
<div class="timeline-date">{{ formatDate(item.createdAt) }}</div>
<div v-else-if="selectedTab === 'timeline'" class="profile-timeline">
<BasePlaceholder v-if="timelineItems.length === 0" text="暂无时间线" icon="fas fa-inbox" />
<BaseTimeline :items="timelineItems">
<template #item="{ item }">
<template v-if="item.type === 'post'">
发布了文章
<router-link :to="`/posts/${item.post.id}`" class="timeline-link">
{{ item.post.title }}
</router-link>
<div class="timeline-date">{{ formatDate(item.createdAt) }}</div>
</template>
<template v-else-if="item.type === 'comment'">
在
<router-link :to="`/posts/${item.comment.post.id}`" class="timeline-link">
{{ item.comment.post.title }}
</router-link>
下评论了
<router-link :to="`/posts/${item.comment.post.id}#comment-${item.comment.id}`" class="timeline-link">
{{ item.comment.content }}
</router-link>
<div class="timeline-date">{{ formatDate(item.createdAt) }}</div>
</template>
<template v-else-if="item.type === 'reply'">
在
<router-link :to="`/posts/${item.comment.post.id}`" class="timeline-link">
{{ item.comment.post.title }}
</router-link>
下对
<router-link :to="`/posts/${item.comment.post.id}#comment-${item.comment.parentComment.id}`"
class="timeline-link">
{{ item.comment.parentComment.content }}
</router-link>
回复了
<router-link :to="`/posts/${item.comment.post.id}#comment-${item.comment.id}`" class="timeline-link">
{{ item.comment.content }}
</router-link>
<div class="timeline-date">{{ formatDate(item.createdAt) }}</div>
</template>
</template>
<template v-else-if="item.type === 'comment'">
在
<router-link :to="`/posts/${item.comment.post.id}`" class="timeline-link">
{{ item.comment.post.title }}
</router-link>
下评论了
<router-link :to="`/posts/${item.comment.post.id}#comment-${item.comment.id}`" class="timeline-link">
{{ item.comment.content }}
</router-link>
<div class="timeline-date">{{ formatDate(item.createdAt) }}</div>
</template>
<template v-else-if="item.type === 'reply'">
在
<router-link :to="`/posts/${item.comment.post.id}`" class="timeline-link">
{{ item.comment.post.title }}
</router-link>
下对
<router-link :to="`/posts/${item.comment.post.id}#comment-${item.comment.parentComment.id}`" class="timeline-link">
{{ item.comment.parentComment.content }}
</router-link>
回复了
<router-link :to="`/posts/${item.comment.post.id}#comment-${item.comment.id}`" class="timeline-link">
{{ item.comment.content }}
</router-link>
<div class="timeline-date">{{ formatDate(item.createdAt) }}</div>
</template>
</template>
</BaseTimeline>
</div>
</BaseTimeline>
</div>
<div v-else class="follow-container">
<div class="follow-tabs">
<div :class="['follow-tab-item', { selected: followTab === 'followers' } ]" @click="followTab = 'followers'">关注者</div>
<div :class="['follow-tab-item', { selected: followTab === 'following' } ]" @click="followTab = 'following'">正在关注</div>
<div v-else class="follow-container">
<div class="follow-tabs">
<div :class="['follow-tab-item', { selected: followTab === 'followers' }]"
@click="followTab = 'followers'">关注者
</div>
<div :class="['follow-tab-item', { selected: followTab === 'following' }]"
@click="followTab = 'following'">正在关注
</div>
</div>
<div class="follow-list">
<UserList v-if="followTab === 'followers'" :users="followers" />
<UserList v-else :users="followings" />
</div>
</div>
<div class="follow-list">
<UserList v-if="followTab === 'followers'" :users="followers" />
<UserList v-else :users="followings" />
</div>
</div>
</template>
</div>
@@ -413,16 +401,19 @@ export default {
align-items: center;
height: 300px;
}
.profile-page {
background-color: var(--background-color);
height: calc(100vh - var(--header-height));
overflow-y: auto;
}
.profile-page-header {
display: flex;
align-items: center;
padding: 20px;
}
.profile-page-header-avatar-img {
width: 200px;
height: 200px;
@@ -430,17 +421,21 @@ export default {
background-color: lightblue;
object-fit: cover;
}
.profile-page-header-user-info {
margin-left: 20px;
}
.profile-page-header-user-info-name {
font-size: 24px;
font-weight: bold;
}
.profile-page-header-user-info-description {
font-size: 20px;
color: #666;
}
.profile-page-header-subscribe-button {
display: flex;
flex-direction: row;
@@ -484,6 +479,7 @@ export default {
border-top: 1px solid #e0e0e0;
border-bottom: 1px solid #e0e0e0;
}
.profile-info-item {
display: flex;
flex-direction: row;
@@ -491,19 +487,23 @@ export default {
align-items: center;
padding: 10px 0;
}
.profile-info-item-label {
font-size: 14px;
opacity: 0.7;
}
.profile-info-item-value {
font-size: 14px;
}
.profile-tabs {
display: flex;
flex-direction: row;
padding: 0 20px;
border-bottom: 1px solid #e0e0e0;
}
.profile-tabs-item {
display: flex;
flex-direction: row;
@@ -514,28 +514,34 @@ export default {
width: 200px;
cursor: pointer;
}
.profile-tabs-item.selected {
color: var(--primary-color);
border-bottom: 2px solid var(--primary-color);
}
.profile-summary {
display: flex;
flex-direction: column;
padding: 20px;
gap: 20px;
}
.summary-title {
font-size: 20px;
font-weight: bold;
}
.total-summary {
width: 100%;
}
.total-summary-content {
display: flex;
flex-direction: row;
gap: 20px;
}
.total-summary-item {
display: flex;
flex-direction: row;
@@ -543,14 +549,17 @@ export default {
align-items: center;
padding: 10px 0;
}
.total-summary-item-label {
font-size: 18px;
opacity: 0.7;
}
.total-summary-item-value {
font-size: 24px;
font-weight: bold;
}
.summary-divider {
margin-top: 20px;
display: flex;
@@ -558,10 +567,12 @@ export default {
gap: 20px;
width: 100%;
}
.hot-reply,
.hot-topic {
width: 50%;
}
.profile-timeline {
padding: 20px;
}
@@ -605,8 +616,7 @@ export default {
padding: 40px 0;
}
.follow-container {
}
.follow-container {}
.follow-tabs {
display: flex;
@@ -628,5 +638,4 @@ export default {
.follow-list {
padding-left: 20px;
}
</style>