otto/AWCharacterCreator
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Lobby: tabs, live chat with whispers, event log, embedded read-only character sheets

Browse Source 
Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01HJhXuLD2Z6hv3Wqeq9UL9K
This commit is contained in:
Claude
2026-10-21 16:38:28 +00:00
parent aad8e0515b
commit 94d3505b82
7 changed files with 343 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/styles.css
+22
View File
@@ -182,3 +182,25 @@ a.button:hover { filter: brightness(1.1); }
span.chip { border: 1px solid var(--line); font-size: .85rem; padding: .1rem .6rem; }
.lobbycard .chips { gap: .4rem; }
h2 + .charlist, .card + h2 { margin-top: 1.4rem; }
/* lobby page: tabs, chat, sheet */
.lobbypage { max-width: 980px; }
.tabs { display: flex; flex-wrap: wrap; gap: .3rem; border-bottom: 1px solid var(--line); margin: .8rem 0 1rem; }
.tabs button { background: transparent; color: var(--text); border: 1px solid transparent; border-bottom: none; border-radius: var(--radius) var(--radius) 0 0; font-weight: 500; padding: .45rem .9rem; margin-bottom: -1px; }
.tabs button.on { background: var(--panel); border-color: var(--line); border-bottom: 1px solid var(--panel); color: var(--text); font-weight: 700; }
.chatwrap { display: grid; gap: .6rem; }
.chatbox { height: min(55vh, 520px); overflow-y: auto; background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); padding: .6rem .8rem; display: flex; flex-direction: column; gap: .25rem; }
.msg { overflow-wrap: anywhere; line-height: 1.35; }
.msg .time { color: var(--muted); font-size: .75rem; font-variant-numeric: tabular-nums; }
.msg.event { color: var(--muted); font-size: .85rem; font-style: italic; }
.msg.mine strong { color: var(--noxium); }
.msg.whisper { background: var(--panel2); border-left: 3px solid #8a63c7; padding: .15rem .5rem; border-radius: 4px; }
.msg.whisper em { color: #8a63c7; }
.chatform { flex-wrap: nowrap; gap: .5rem; }
.chatform select { width: 12rem; flex: 0 0 auto; }
.chatform select.whisper { border-color: #8a63c7; }
.chatform input { flex: 1 1 auto; width: auto; min-width: 0; }
.sheetcols { display: grid; grid-template-columns: 1fr 1fr; gap: 0 2rem; }
.sheetview h4 { margin: 1rem 0 .3rem; }
.sheetview table { width: 100%; }
@media (max-width: 760px) { .sheetcols { grid-template-columns: 1fr; } .chatform { flex-wrap: wrap; } .chatform select { width: 100%; } }