card planels and logging

1 files changed, 35 insertions, 17 deletions

diff --git a/play.html b/play.html
index 8bce1a6..063d039 100644
--- a/play.html
+++ b/play.html
@@ -41,6 +41,11 @@ body.Opposition header.your_turn { background-color: hsl(16 85% 75%);; }
 #log .h1 { background-color: silver; }
 #log .h2 { background-color: gainsboro; }
 
+#log .suf { background-color: hsl(273 39% 85%); }
+#log .opp { background-color: hsl(16 85% 85%); }
+#log .tip { cursor: pointer; }
+#log .tip:hover { text-decoration: underline; }
+
 #log > .p { padding-left: 20px; text-align: right; font-style: italic; opacity: 75%; }
 #log > .i { padding-left: 20px; }
 
@@ -55,10 +60,10 @@ body.Opposition header.your_turn { background-color: hsl(16 85% 75%);; }
 	gap: 20px;
 }
 
-#hand, #discard, #states_draw, #strategy_draw, #set_aside { min-height: 350px; }
-#hand_panel, #states_draw { min-width: 1100px; }
-#strategy_draw, #set_aside_panel { min-width: 830px; }
-#discard_panel { min-width: 290px; }
+#hand, #discard, #support_claimed, #support_discard, #opposition_claimed, #opposition_discard, #states_draw, #strategy_draw, #out_of_play { min-height: 350px; }
+#hand_panel, #states_draw, #support_discard_panel, #opposition_discard_panel, #out_of_play { min-width: 1100px; }
+#strategy_draw { min-width: 790px; }
+#support_claimed, #opposition_claimed { min-width: 290px; }
 
 .panel {
 	background-color: #555;
@@ -886,45 +891,58 @@ c5 3 13 7 17 8 8 2 9 3 11 12 1 5 5 12 8 16 5 8 5 8 3 22 l-3 14 -30 -1 c-35
 	</div>
 
 	<div class="panel_grid">
-
 		<div id="hand_panel" class="panel hide">
 		<div id="hand_header" class="panel_header">Hand</div>
 		<div id="hand" class="panel_body"></div>
 		</div>
+	</div>
 
-		<div id="discard_panel" class="panel">
-		<div id="discard_header" class="panel_header">Discard</div>
-		<div id="discard" class="panel_body"></div>
+	<div class="panel_grid">
+		<div id="support_claimed_panel" class="panel">
+		<div id="support_claimed_header" class="panel_header">Suffragist Claimed</div>
+		<div id="support_claimed" class="panel_body"></div>
 		</div>
 
+		<div id="opposition_claimed_panel" class="panel">
+		<div id="opposition_claimed_header" class="panel_header">Opposition Claimed</div>
+		<div id="opposition_claimed" class="panel_body"></div>
+		</div>
 	</div>
 
 	<div class="panel_grid">
-
 		<div id="strategy_draw_panel" class="panel">
-		<div id="strategy_draw_header" class="panel_header">Strategy cards</div>
+		<div id="strategy_draw_header" class="panel_header">Available Strategy cards</div>
 		<div id="strategy_draw" class="panel_body"></div>
 		</div>
 
 	</div>
 
 	<div class="panel_grid">
-
 		<div id="states_draw_panel" class="panel">
-		<div id="states_draw_header" class="panel_header">States cards</div>
+		<div id="states_draw_header" class="panel_header">Available States cards</div>
 		<div id="states_draw" class="panel_body"></div>
 		</div>
-
 	</div>
 
-
 	<div class="panel_grid">
+		<div id="support_discard_panel" class="panel">
+		<div id="support_discard_header" class="panel_header">Suffragist Discard</div>
+		<div id="support_discard" class="panel_body"></div>
+		</div>
+	</div>
 
-		<div id="set_aside_panel" class="panel hide">
-		<div id="set_aside_header" class="panel_header">Set-aside cards</div>
-		<div id="set_aside" class="panel_body"></div>
+	<div class="panel_grid">
+		<div id="opposition_discard_panel" class="panel">
+		<div id="opposition_discard_header" class="panel_header">Opposition Discard</div>
+		<div id="opposition_discard" class="panel_body"></div>
 		</div>
+	</div>
 
+	<div class="panel_grid">
+		<div id="out_of_play_panel" class="panel">
+		<div id="out_of_play_header" class="panel_header">Out of Play</div>
+		<div id="out_of_play" class="panel_body"></div>
+		</div>
 	</div>
 
 	<br><br><br>