gitea-mirror/Cockatrice
1
0
Fork 0
mirror of https://github.com/Cockatrice/Cockatrice.git synced 2026-01-06 18:14:23 -08:00
Code Issues Packages Projects Releases Wiki Activity

Webatrice: Update nav (#4380)

Browse Source 
* wip: subnav debug

* nav redesign

* remove unnecessary code

* remove subnav

* add leaveRoom button

Co-authored-by: Jeremy Letto <jeremy.letto@datasite.com>
This commit is contained in:
Jeremy Letto
2021-06-15 02:12:04 -05:00
committed by GitHub
parent da9222929b
commit c9ddd042fc
7 changed files with 205 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
webclient/src/containers/Room/Room.css
View File

@@ -1,4 +1,5 @@
.room-view,
.room-view__main,
.room-view__games,
.room-view__messages,
.room-view__messages-content,
@@ -6,12 +7,17 @@
height: 100%;
}
.room-view,
.room-view__messages,
.room-view__side {
display: flex;
flex-direction: column;
}
.room-view__main {
overflow: hidden;
}
.room-view__messages-sayMessage {
width: 100%;
margin: 10px auto 2px;

73
webclient/src/containers/Room/Room.tsx
View File

@@ -53,45 +53,48 @@ class Room extends Component<any> {
return (
<div className="room-view">
<AuthGuard />
<ThreePaneLayout
fixedHeight
top={(
<Paper className="room-view__games overflow-scroll">
<Games room={room} />
</Paper>
)}
<div className="room-view__main">
<ThreePaneLayout
fixedHeight
bottom={(
<div className="room-view__messages">
<Paper className="room-view__messages-content overflow-scroll">
<ScrollToBottomOnChanges changes={messages} content={(
<Messages messages={messages} />
)} />
</Paper>
<Paper className="room-view__messages-sayMessage">
<SayMessage onSubmit={this.handleRoomSay} />
</Paper>
</div>
)}
top={(
<Paper className="room-view__games overflow-scroll">
<Games room={room} />
</Paper>
)}
side={(
<Paper className="room-view__side overflow-scroll">
<div className="room-view__side-label">
Users in this room: {users.length}
bottom={(
<div className="room-view__messages">
<Paper className="room-view__messages-content overflow-scroll">
<ScrollToBottomOnChanges changes={messages} content={(
<Messages messages={messages} />
)} />
</Paper>
<Paper className="room-view__messages-sayMessage">
<SayMessage onSubmit={this.handleRoomSay} />
</Paper>
</div>
<VirtualList
className="room-view__side-list"
itemKey={(index, data) => users[index].name }
items={ users.map(user => (
<ListItem button className="room-view__side-list__item">
<UserDisplay user={user} />
</ListItem>
) ) }
/>
</Paper>
)}
/>
)}
side={(
<Paper className="room-view__side overflow-scroll">
<div className="room-view__side-label">
Users in this room: {users.length}
</div>
<VirtualList
className="room-view__side-list"
itemKey={(index, data) => users[index].name }
items={ users.map(user => (
<ListItem button className="room-view__side-list__item">
<UserDisplay user={user} />
</ListItem>
) ) }
/>
</Paper>
)}
/>
</div>
</div>
);
}

4
webclient/src/containers/Server/Server.tsx
View File

@@ -95,7 +95,9 @@ const ServerRooms = ({ rooms, joinedRooms, history, message, users}) => (
)}
bottom={(
<Paper className="serverMessage overflow-scroll" dangerouslySetInnerHTML={{ __html: message }} />
<Paper className="serverMessage overflow-scroll">
<div className="serverMessage__content" dangerouslySetInnerHTML={{ __html: message }} />
</Paper>
)}
side={(