lkddi/chatroom
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 4 Wiki Activity

优化商店个性装扮体验

Browse Source
This commit is contained in:
流星
2026-04-27 11:12:51 +08:00
parent 32af6abeb2
commit ffccfa26e9
14 changed files with 1027 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/chat/partials/shop-panel.blade.php
+63 -3
View File
@@ -9,8 +9,8 @@
#shop-panel {
display: none;
position: absolute;
/* 顶部 tab 栏高度约 26px，底部状态栏约 22px */
top: 26px;
/* 顶部 tab 栏高度约 56px，底部状态栏约 22px */
top: 56px;
left: 0;
right: 0;
bottom: 22px;
@@ -19,6 +19,9 @@
z-index: 10;
}
.shop-tab.active { color: #e2e8f0 !important; border-bottom-color: #818cf8 !important; }
.shop-tab:hover { color: #c7d2fe; }
#shop-balance-bar {
padding: 6px 8px;
background: linear-gradient(135deg, #1e1b4b, #312e81);
@@ -133,6 +136,21 @@
line-height: 1.35;
}
.shop-validity {
display: inline-flex;
align-items: center;
width: fit-content;
margin-top: 4px;
padding: 1px 6px;
border-radius: 999px;
background: rgba(79, 70, 229, .18);
border: 1px solid rgba(129, 140, 248, .42);
color: #c7d2fe;
font-size: 9px;
font-weight: 700;
line-height: 1.5;
}
/* 购买按钮 */
.shop-btn {
display: inline-flex;
@@ -241,6 +259,37 @@
margin-top: 5px;
min-height: 14px;
}
/* ── 装扮卡片状态标签 ────────────── */
.decoration-status {
font-size: 9px;
padding: 1px 6px;
border-radius: 8px;
margin-left: 6px;
}
.decoration-status.active { background: #065f46; color: #6ee7b7; }
.decoration-expiry { font-size: 9px; color: #9ca3af; margin-top: 2px; }
.decoration-note {
grid-column: 1 / -1;
margin: 0 0 6px;
padding: 7px 8px;
border: 1px solid rgba(251, 191, 36, .35);
border-radius: 8px;
background: rgba(120, 53, 15, .28);
color: #fde68a;
font-size: 10px;
line-height: 1.45;
}
#shop-decorations-list {
flex: 1;
overflow-y: auto;
padding: 6px 5px;
scrollbar-width: thin;
scrollbar-color: #4338ca #0f0c29;
display: none;
}
</style>
<div id="shop-panel"
@@ -254,14 +303,25 @@
<span id="shop-week-badge"></span>
</div>
{{-- Tab 导航 --}}
<div id="shop-tabs" style="display:flex; border-bottom: 1px solid #3730a3; flex-shrink: 0;">
<button class="shop-tab active" data-shop-tab="items" style="flex:1; padding: 6px; background: transparent; border: none; color: #a5b4fc; font-size: 11px; cursor: pointer; border-bottom: 2px solid transparent;">特效道具</button>
<button class="shop-tab" data-shop-tab="decorations" style="flex:1; padding: 6px; background: transparent; border: none; color: #6b7280; font-size: 11px; cursor: pointer; border-bottom: 2px solid transparent;">个人装扮</button>
</div>
{{-- Toast --}}
<div id="shop-toast"></div>
{{-- 商品列表 --}}
{{-- 特效道具列表 --}}
<div id="shop-items-list">
<div style="text-align:center;color:#6366f1;padding:20px 0;font-size:11px;">加载中…</div>
</div>
{{-- 个人装扮列表 --}}
<div id="shop-decorations-list">
<div style="text-align:center;color:#6366f1;padding:20px 0;font-size:11px;">加载中…</div>
</div>
{{-- 改名弹框 --}}
<div id="rename-modal">
<div id="rename-modal-inner">