优化样式，增加上个出牌的人的提示

HullQin · Oct 7, 2021 · ef91b3b · ef91b3b
1 parent 7a467d3
commit ef91b3b
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 4 deletions.
diff --git a/src/components/Seat/style.css b/src/components/Seat/style.css
@@ -24,7 +24,7 @@
   width: 20px;
   height: 20px;
   line-height: 20px;
-  font-size: 20px;
+  font-size: 18px;
   border-radius: 50%;
   border: var(--seat-border) 2px solid;
   background-color: black;

diff --git a/src/pages/Room/GamingRoom/index.jsx b/src/pages/Room/GamingRoom/index.jsx
@@ -37,8 +37,8 @@ const GamingRoom = (props) => {
         render={(seat) => (
           <>
             <div className='room-seat-info'>
-              <div className='room-seat-role'>{game.state === 2 && game.landlord === seat ? '👲 地主' : '👨‍🌾 农民'}</div>
-              <div><span className='room-seat-rest'>{game.held[seat]}</span> 张牌</div>
+              <div className='room-seat-role' style={game.top === seat ? { color: 'red' } : undefined}>{game.state === 2 && game.landlord === seat ? '👲 地主' : '👨‍🌾 农民'}</div>
+              <div><span className='room-seat-rest' style={game.held[seat] < 3 ? { color: 'red' } : undefined}>{game.held[seat]}</span> 张牌</div>
             </div>
             {game.state === 2 && (
               <StaticPokerList ids={game.last[seat]} overlap sort height={58} style={{ flex: '1 0 auto', marginLeft: 24 }} />

diff --git a/src/pages/Room/index.jsx b/src/pages/Room/index.jsx
@@ -25,6 +25,7 @@ const Room = () => {
     revealed: [],
     total: 0,
     landlord: null,
+    top: null,
   }));
 
   useEffect(() => {
@@ -169,7 +170,9 @@ const Room = () => {
       ) : room.state === 1 ? (
         <GamingRoom room={room} game={game} seat={seat} />
       ) : null}
-      <button style={{ position: 'absolute', top: 0, right: 0 }} onClick={() => setLocation('/')}>重选房间</button>
+      {room.state >= 0 && (
+        <button style={{ position: 'absolute', top: 0, right: 0 }} onClick={() => setLocation('/')}>重选房间</button>
+      )}
     </>
   );
 };