From 6491a7dba6fd0e79f595d7db29db31d615448252 Mon Sep 17 00:00:00 2001
From: Guangcong Luo <guangcongluo@gmail.com>
Date: Fri, 11 Dec 2015 23:34:04 -0500
Subject: [PATCH] Redesign 'Look for a battle' button

---
 js/client-mainmenu.js | 6 +++---
 style/client.css      | 7 ++++++-
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/js/client-mainmenu.js b/js/client-mainmenu.js
index 2763d7148..dee78430a 100644
--- a/js/client-mainmenu.js
+++ b/js/client-mainmenu.js
@@ -38,7 +38,7 @@
 				buf += '<div class="menugroup"><form class="battleform" data-search="1">';
 				buf += '<p><label class="label">Format:</label>' + this.renderFormats() + '</p>';
 				buf += '<p><label class="label">Team:</label>' + this.renderTeams() + '</p>';
-				buf += '<p><button class="button mainmenu1 big" name="search"><strong>Look for a battle</strong></button></p></form></div>';
+				buf += '<p><button class="button mainmenu1 big" name="search"><strong>Battle!</strong><br /><small>Find a random opponent</small></button></p></form></div>';
 			}
 
 			buf += '<div class="menugroup"><p><button class="button mainmenu2" name="joinRoom" value="teambuilder">Teambuilder</button></p>';
@@ -474,7 +474,7 @@
 				$formatButton.replaceWith(this.renderFormats(format));
 				$teamButton.replaceWith(this.renderTeams(format, teamIndex));
 
-				$searchForm.find('button.big').html('<strong>Look for a battle</strong>').removeClass('disabled');
+				$searchForm.find('button.big').html('<strong>Battle!</strong><br /><small>Find a random opponent</small>').removeClass('disabled');
 				$searchForm.find('p.cancel').remove();
 			} else {
 				$formatButton.addClass('preselected')[0].disabled = true;
@@ -578,7 +578,7 @@
 			}
 			this.$('button.onlineonly').removeClass('disabled');
 
-			if (!this.searching) this.$('.mainmenu button.big').html('<strong>Look for a battle</strong>').removeClass('disabled');
+			if (!this.searching) this.$('.mainmenu button.big').html('<strong>Battle!</strong><br /><small>Find a random opponent</small>').removeClass('disabled');
 			var self = this;
 			this.$('button[name=format]').each(function (i, el) {
 				var val = el.value;
diff --git a/style/client.css b/style/client.css
index 46cc7a35f..b3a313bb1 100644
--- a/style/client.css
+++ b/style/client.css
@@ -848,9 +848,14 @@ p.or:after {
 }
 .menugroup button.big {
 	width: 230px;
-	padding: 6px 7px 6px 7px;
+	height: 50px;
+	padding: 0;
 	font-size: 14pt;
 }
+.menugroup button.big small {
+	display: block;
+	font-size: 9pt;
+}
 .menugroup .button:hover {
 	background: #5485B6;
 	background: hsl(210,40%,52%);