diff --git a/Dockerfile b/Dockerfile
index 4b2b3a7..1833c5d 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -59,6 +59,7 @@ COPY --from=build /app/deploy /app
COPY main/prisma /app/
RUN pnpm exec prisma generate
COPY --from=build-front /app/ui/dist /app/front
+ENV UI_PATH=/app/front
ENV DATA_DIR=/app/data
EXPOSE 8080
diff --git a/main/assets/richHeader.ejs b/main/assets/richHeader.ejs
index 3bd8405..a197163 100644
--- a/main/assets/richHeader.ejs
+++ b/main/assets/richHeader.ejs
@@ -6,7 +6,7 @@
<% if (!!title) { %>
<% }else { %>
-
+
<% } %>
群成员:<%= name %>
@@ -14,13 +14,97 @@
html, body {
padding: 0;
margin: 0;
+ color: #303133;
+ }
+
+ * {
+ box-sizing: border-box;
+ }
+
+ #app {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ gap: 20px;
+ }
+
+ #avatar, #card {
+ width: 100%;
+ max-width: 500px;
+ }
+
+ #card {
+ padding: 0 20px;
+ line-height: 1.8em;
+ }
+
+ .badge {
+ border-radius: 0.5em;
+ color: #fff;
+ padding: 0 0.2em;
+ }
+
+ .badge-owner {
+ background-color: #FDCE3A !important;
+ }
+
+ .badge-admin {
+ background-color: #2FE1D8 !important;
+ }
+
+ .badge-member {
+ background-color: #ADB5CA;
+ }
+
+ .badge-hasTitle {
+ background-color: #D88BFF;
+ }
+
+ .secondary {
+ color: #606266;
+ font-size: small;
+ }
+
+ .detailItem {
+ font-size: smaller;
+ margin-top: 0.5em;
+ }
+
+ @media screen and (min-width: 900px) {
+ #app {
+ flex-direction: row;
+ height: 100%;
+ }
+
+ #avatar {
+ width: 400px;
+ }
+
+ #card {
+ width: fit-content;
+ }
}
-
-<%= role %>
-<%= name %>
-<%= userId %>
+
+
+
+
+ <%= title || role %>
+ <%= name %>
+
+
<%= userId %>
+
+
加入时间
+ <%= joinTime %>
+
+
+
上次发言时间
+ <%= lastSentTime %>
+
+
+