From a2dd2ed3edd350a03fa75723184cadc70eca798e Mon Sep 17 00:00:00 2001
From: Tor Andersson <tor@ccxvii.net>
Date: Sat, 1 Jan 2022 01:38:01 +0100
Subject: Split into separate module.

---
 README    |  5 +++++
 README.md |  5 -----
 play.css  | 25 +++++++++++++++++--------
 play.html |  6 ++----
 play.js   |  6 +++---
 title.sql |  2 +-
 6 files changed, 28 insertions(+), 21 deletions(-)
 create mode 100644 README
 delete mode 100644 README.md

diff --git a/README b/README
new file mode 100644
index 0000000..05c9db8
--- /dev/null
+++ b/README
@@ -0,0 +1,5 @@
+This game is implemented with the generous permission of Columbia Games.
+
+Rules and art assets are Copyright 2010 Columbia Games.
+
+Source code to this digital implementation is Copyright 2021-2022 Tor Andersson.
diff --git a/README.md b/README.md
deleted file mode 100644
index 05c9db8..0000000
--- a/README.md
+++ /dev/null
@@ -1,5 +0,0 @@
-This game is implemented with the generous permission of Columbia Games.
-
-Rules and art assets are Copyright 2010 Columbia Games.
-
-Source code to this digital implementation is Copyright 2021-2022 Tor Andersson.
diff --git a/play.css b/play.css
index 811a74b..3ae1280 100644
--- a/play.css
+++ b/play.css
@@ -39,31 +39,40 @@ header.your_turn { background-color: orange; }
 	width: 225px;
 	height: 350px;
 	border-radius: 12px;
+	box-shadow: 1px 1px 5px rgba(0,0,0,0.5);
+	transition: 100ms;
+	display: none;
+}
+
+.card.show {
+	display: block;
 }
 
 .card.enabled:hover {
 	transform: scale(1.1);
 }
 
-.small_card.prior {
+.card.prior {
 	filter: grayscale(100%);
 }
 
-.card, .small_card { background-color: white; }
-.card_back { background-color: #822c1f; }
+.card_back {
+	background-color: #822c1f;
+}
 
 .role_info { padding: 15px; }
-.small_card { width: 90px; height: 140px; border-radius: 5px; }
-.small_card:hover { width: 180px; height: 280px; border-radius: 10px; }
+.role_info .card { margin: 0 auto; }
+.role_info .card { width: 90px; height: 140px; border-radius: 5px; }
+.role_info .card:hover { width: 180px; height: 280px; border-radius: 10px; }
 
 @media (max-height: 800px) {
 	.role_info { padding: 15px 0 0 0; }
-	.small_card { width: 135px; height: 80px; border-radius: 8px 8px 0 0; }
-	.small_card:hover { width: 180px; height: 280px; border-radius: 10px; margin-bottom: 15px; }
+	.role_info .card { width: 135px; height: 80px; border-radius: 8px 8px 0 0; }
+	.role_info .card:hover { width: 180px; height: 280px; border-radius: 10px; margin-bottom: 15px; }
 }
 
 @media (min-height: 1200px) {
-	.small_card { width: 180px; height: 280px; border-radius: 10px; }
+	.role_info .card { width: 180px; height: 280px; border-radius: 10px; }
 }
 
 /* BATTLE BOARD */
diff --git a/play.html b/play.html
index 21439d1..bd37f2f 100644
--- a/play.html
+++ b/play.html
@@ -75,7 +75,7 @@
 				<div class="role_vp" id="caesar_vp">VP</div>
 				<div class="role_user">-</div>
 			</div>
-			<div class="role_info"><div class="small_card card_back" id="caesar_card"></div></div>
+			<div class="role_info"><div class="show card card_back" id="caesar_card"></div></div>
 		</div>
 		<div class="role two">
 			<div class="role_name">
@@ -83,9 +83,7 @@
 				<div class="role_vp" id="pompeius_vp">VP</div>
 				<div class="role_user">-</div>
 			</div>
-			<div class="role_info">
-				<div class="small_card card_back" id="pompeius_card"></div>
-			</div>
+			<div class="role_info"><div class="show card card_back" id="pompeius_card"></div></div>
 		</div>
 		<div id="turn_info">-</div>
 	</div>
diff --git a/play.js b/play.js
index b57ee5b..52545f8 100644
--- a/play.js
+++ b/play.js
@@ -662,11 +662,11 @@ function update_battle() {
 
 function update_card_display(element, card, prior_card) {
 	if (!card && !prior_card) {
-		element.className = "small_card card_back";
+		element.className = "show card card_back";
 	} else if (prior_card) {
-		element.className = "small_card prior card_" + CARDS[prior_card].image;
+		element.className = "show card prior card_" + CARDS[prior_card].image;
 	} else {
-		element.className = "small_card card_" + CARDS[card].image;
+		element.className = "show card card_" + CARDS[card].image;
 	}
 }
 
diff --git a/title.sql b/title.sql
index bbb0e99..ccd65ab 100644
--- a/title.sql
+++ b/title.sql
@@ -1,3 +1,3 @@
-insert or replace into titles values ( 'julius-caesar', 'Julius Caesar', 37836 );
+insert or replace into titles ( title_id, title_name, bgg ) values ( 'julius-caesar', 'Julius Caesar', 37836 );
 insert or replace into roles values ( 'julius-caesar', 'Caesar' );
 insert or replace into roles values ( 'julius-caesar', 'Pompeius' );
-- 
cgit v1.2.3