Style the revealed character names extra large

These are an essential element of the game. They should basically fill
the content area of the screen.

(I think ideally, the game would size the text so the largest name
_does_ fill the screen and then use a consistent font size for all of
them, but this will do for now.)

diff --git a/empires/index.html b/empires/index.html
index 4f574b90b22c9bf071225e81bb8799c357e86040..7ccc7c33c49093000182777d862b352ec06e5f9f 100644 (file)
--- a/empires/index.html
+++ b/empires/index.html
@@ -63,7 +63,7 @@
   <div class="show-state-reveal">
     <h1>Watch and memorize each character!</h1>
 
-    <h1 id="character-reveal"></h1>
+    <span id="character-reveal"></span>
   </div>
 
   <div class="hide-state-reveal" id="players-div">

diff --git a/empires/style.css b/empires/style.css
index 0c4f01008fb45103d8bb66bbe091e2205bfcd125..b1955f04eb35caef2608a0d793616ac93f09befd 100644 (file)
--- a/empires/style.css
+++ b/empires/style.css
@@ -196,3 +196,9 @@ button:hover {
 ::-moz-focus-inner {
     border: 0;
 }
+
+#character-reveal {
+    color: #333738;
+    font-size: 300%;
+    font-weight: bold;
+}