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

增加每日游戏三杰榜

Browse Source
This commit is contained in:
pllx
2026-05-09 10:23:38 +08:00
parent 41522393de
commit 1b062f67ea
5 changed files with 384 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/css/chat.css
+186
View File
@@ -170,6 +170,7 @@ a:hover {
.room-title-bar {
background: var(--bg-header);
color: var(--text-white);
position: relative;
text-align: center;
padding: 6px 10px;
font-size: 12px;
@@ -178,6 +179,10 @@ a:hover {
border-bottom: 1px solid var(--border-blue);
}
.room-title-main {
text-align: center;
}
.room-title-bar .room-name {
font-weight: bold;
font-size: 14px;
@@ -188,6 +193,145 @@ a:hover {
font-size: 11px;
}
.daily-game-profit-board {
position: absolute;
top: 8px;
right: 34px;
width: 132px;
color: #fff7ed;
text-align: center;
font-size: 13px;
line-height: 1.28;
z-index: 2;
}
.daily-game-profit-board-title {
color: #fde68a;
font-weight: bold;
margin-bottom: 5px;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}
.daily-game-profit-avatars {
display: flex;
align-items: center;
justify-content: center;
gap: 7px;
}
.daily-game-profit-avatar-wrap {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
width: 34px;
height: 34px;
border-radius: 999px;
box-shadow: 0 2px 6px rgba(15, 23, 42, 0.24);
}
.daily-game-profit-avatar {
width: 30px;
height: 30px;
border-radius: 999px;
object-fit: cover;
background: rgba(255, 255, 255, 0.18);
}
.daily-game-profit-avatar-rank-1 {
background: linear-gradient(135deg, #fde047, #f59e0b 48%, #fff7ad);
}
.daily-game-profit-avatar-rank-1::before {
content: "1";
position: absolute;
right: -2px;
bottom: -2px;
width: 14px;
height: 14px;
border-radius: 999px;
background: #f59e0b;
color: #fff7ed;
font-size: 9px;
font-weight: bold;
line-height: 14px;
text-align: center;
box-shadow: 0 0 0 1px rgba(255, 247, 237, 0.9);
}
.daily-game-profit-avatar-rank-2 {
background: linear-gradient(135deg, #f8fafc, #94a3b8 48%, #ffffff);
}
.daily-game-profit-avatar-rank-2::before {
content: "2";
position: absolute;
right: -2px;
bottom: -2px;
width: 14px;
height: 14px;
border-radius: 999px;
background: #64748b;
color: #ffffff;
font-size: 9px;
font-weight: bold;
line-height: 14px;
text-align: center;
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.9);
}
.daily-game-profit-avatar-rank-3 {
background: linear-gradient(135deg, #fed7aa, #c2410c 48%, #ffedd5);
}
.daily-game-profit-avatar-rank-3::before {
content: "3";
position: absolute;
right: -2px;
bottom: -2px;
width: 14px;
height: 14px;
border-radius: 999px;
background: #c2410c;
color: #fff7ed;
font-size: 9px;
font-weight: bold;
line-height: 14px;
text-align: center;
box-shadow: 0 0 0 1px rgba(255, 247, 237, 0.9);
}
.daily-game-profit-avatar-wrap::after {
content: attr(data-username);
position: absolute;
left: 50%;
bottom: -24px;
transform: translateX(-50%);
max-width: 110px;
padding: 3px 7px;
border-radius: 999px;
background: rgba(15, 23, 42, 0.88);
color: #ffffff;
font-size: 11px;
line-height: 1.2;
white-space: nowrap;
opacity: 0;
pointer-events: none;
transition: opacity 0.12s ease;
overflow: hidden;
text-overflow: ellipsis;
}
.daily-game-profit-avatar-wrap:hover::after {
opacity: 1;
}
.daily-game-profit-empty {
color: #dbeafe;
font-size: 11px;
opacity: 0.82;
}
/* 公告/祝福语滚动条（复刻原版 marquee） */
.room-announcement-bar {
background: linear-gradient(to right, #a8d8a8, #c8f0c8, #a8d8a8);
@@ -956,6 +1100,48 @@ a:hover {
overflow-y: auto !important;
}
.daily-game-profit-board {
top: 5px;
right: 6px;
width: 102px;
font-size: 10px;
}
.daily-game-profit-empty {
display: none;
}
.daily-game-profit-board-title {
margin-bottom: 2px;
}
.daily-game-profit-avatars {
gap: 4px;
}
.daily-game-profit-avatar-wrap {
width: 25px;
height: 25px;
}
.daily-game-profit-avatar {
width: 22px;
height: 22px;
}
.daily-game-profit-avatar-rank-1::before,
.daily-game-profit-avatar-rank-2::before,
.daily-game-profit-avatar-rank-3::before {
width: 11px;
height: 11px;
font-size: 8px;
line-height: 11px;
}
.daily-game-profit-avatar-wrap::after {
display: none;
}
/* ── 手机端隐藏房间介绍 ── */
.room-desc {
display: none !important;