UI: 优化名片弹窗中经验、金币、魅力的横向布局显示

This commit is contained in:
2026-02-27 11:50:31 +08:00
parent d73dda6cd2
commit 2195462886
@@ -333,13 +333,22 @@
{{-- 详细信息区 (等级高看等级低,或自己看自己时才有这些字段) --}}
<div x-show="userInfo.exp_num !== undefined"
style="margin-top: 12px; padding: 10px; background: #f8fafc; border-radius: 8px; font-size: 12px; color: #475569; display: grid; grid-template-columns: 1fr 1fr; gap: 8px;">
<div><span style="color: #94a3b8;">经验:</span><span x-text="userInfo.exp_num"
style="font-weight: 600; color: #4f46e5;"></span></div>
<div><span style="color: #94a3b8;">金币:</span><span x-text="userInfo.jjb"
style="font-weight: 600; color: #d97706;"></span></div>
<div><span style="color: #94a3b8;">魅力:</span><span x-text="userInfo.meili"
style="font-weight: 600; color: #db2777;"></span></div>
style="margin-top: 12px; padding: 12px; background: linear-gradient(to right, #f8fafc, #f1f5f9); border-radius: 8px; font-size: 13px; color: #475569; display: flex; justify-content: space-around; align-items: center; border: 1px solid #e2e8f0;">
<div style="display: flex; flex-direction: column; align-items: center; gap: 4px;">
<span style="color: #64748b; font-size: 11px;">经验</span>
<span x-text="userInfo.exp_num"
style="font-weight: 700; color: #4f46e5; font-size: 15px;"></span>
</div>
<div style="width: 1px; height: 24px; background-color: #cbd5e1;"></div>
<div style="display: flex; flex-direction: column; align-items: center; gap: 4px;">
<span style="color: #64748b; font-size: 11px;">金币</span>
<span x-text="userInfo.jjb" style="font-weight: 700; color: #d97706; font-size: 15px;"></span>
</div>
<div style="width: 1px; height: 24px; background-color: #cbd5e1;"></div>
<div style="display: flex; flex-direction: column; align-items: center; gap: 4px;">
<span style="color: #64748b; font-size: 11px;">魅力</span>
<span x-text="userInfo.meili" style="font-weight: 700; color: #db2777; font-size: 15px;"></span>
</div>
</div>
{{-- 管理员可见区域 (IP 归属地) --}}