From 0a39ebf140dcd7efcaf5f1dbb0be6dbe4e9d26f9 Mon Sep 17 00:00:00 2001
From: Guangcong Luo <guangcongluo@gmail.com>
Date: Thu, 21 Jan 2016 20:49:17 -0800
Subject: [PATCH] Use .textbox for teambuilder textboxes

Teambuilder textboxes used to have their own CSS. They've been updated
to use the regular textbox CSS. This also makes them dark in Dark
Mode.
---
 js/client-teambuilder.js | 22 ++++++------
 style/client.css         | 75 ++++++++++++++--------------------------
 2 files changed, 36 insertions(+), 61 deletions(-)

diff --git a/js/client-teambuilder.js b/js/client-teambuilder.js
index b735d9f99..0a2b0d897 100644
--- a/js/client-teambuilder.js
+++ b/js/client-teambuilder.js
@@ -1022,13 +1022,13 @@
 					buf += '<div class="setmenu setmenu-left"><button name="undeleteSet"><i class="fa fa-undo"></i> Undo Delete</button></div>';
 				}
 				buf += '<div class="setmenu"><button name="importSet"><i class="fa fa-upload"></i>Import</button></div>';
-				buf += '<div class="setchart" style="background-image:url(' + Tools.resourcePrefix + 'sprites/bw/0.png);"><div class="setcol setcol-icon"><span class="itemicon"></span><div class="setcell setcell-pokemon"><label>Pok&eacute;mon</label><input type="text" name="pokemon" class="chartinput" value="" /></div></div></div>';
+				buf += '<div class="setchart" style="background-image:url(' + Tools.resourcePrefix + 'sprites/bw/0.png);"><div class="setcol setcol-icon"><span class="itemicon"></span><div class="setcell setcell-pokemon"><label>Pok&eacute;mon</label><input type="text" name="pokemon" class="textbox chartinput" value="" /></div></div></div>';
 				buf += '</li>';
 				return buf;
 			}
 			buf += '<div class="setmenu"><button name="copySet"><i class="fa fa-files-o"></i>Copy</button> <button name="importSet"><i class="fa fa-upload"></i>Import/Export</button> <button name="moveSet"><i class="fa fa-arrows"></i>Move</button> <button name="deleteSet"><i class="fa fa-trash"></i>Delete</button></div>';
 			buf += '<div class="setchart-nickname">';
-			buf += '<label>Nickname</label><input type="text" value="' + Tools.escapeHTML(set.name || '') + '" placeholder="' + Tools.escapeHTML(template.baseSpecies) + '" name="nickname" />';
+			buf += '<label>Nickname</label><input type="text" name="nickname" class="textbox" value="' + Tools.escapeHTML(set.name || '') + '" placeholder="' + Tools.escapeHTML(template.baseSpecies) + '" />';
 			buf += '</div>';
 			buf += '<div class="setchart" style="' + Tools.getTeambuilderSprite(set, this.curTeam.gen) + ';">';
 
@@ -1038,11 +1038,11 @@
 				var item = Tools.getItem(set.item);
 				itemicon = '<span class="itemicon" style="' + Tools.getItemIcon(item) + '"></span>';
 			}
-			buf += '<div class="setcol setcol-icon">' + itemicon + '<div class="setcell setcell-pokemon"><label>Pok&eacute;mon</label><input type="text" name="pokemon" class="chartinput" value="' + Tools.escapeHTML(set.species) + '" /></div></div>';
+			buf += '<div class="setcol setcol-icon">' + itemicon + '<div class="setcell setcell-pokemon"><label>Pok&eacute;mon</label><input type="text" name="pokemon" class="textbox chartinput" value="' + Tools.escapeHTML(set.species) + '" /></div></div>';
 
 			// details
 			buf += '<div class="setcol setcol-details"><div class="setrow">';
-			buf += '<div class="setcell setcell-details"><label>Details</label><button class="setdetails" tabindex="-1" name="details">';
+			buf += '<div class="setcell setcell-details"><label>Details</label><button class="textbox setdetails" tabindex="-1" name="details">';
 
 			var GenderChart = {
 				'M': 'Male',
@@ -1058,21 +1058,21 @@
 
 			buf += '</button></div>';
 			buf += '</div><div class="setrow">';
-			if (this.curTeam.gen > 1) buf += '<div class="setcell setcell-item"><label>Item</label><input type="text" name="item" class="chartinput" value="' + Tools.escapeHTML(set.item) + '" /></div>';
-			if (this.curTeam.gen > 2) buf += '<div class="setcell setcell-ability"><label>Ability</label><input type="text" name="ability" class="chartinput" value="' + Tools.escapeHTML(set.ability) + '" /></div>';
+			if (this.curTeam.gen > 1) buf += '<div class="setcell setcell-item"><label>Item</label><input type="text" name="item" class="textbox chartinput" value="' + Tools.escapeHTML(set.item) + '" /></div>';
+			if (this.curTeam.gen > 2) buf += '<div class="setcell setcell-ability"><label>Ability</label><input type="text" name="ability" class="textbox chartinput" value="' + Tools.escapeHTML(set.ability) + '" /></div>';
 			buf += '</div></div>';
 
 			// moves
 			if (!set.moves) set.moves = [];
 			buf += '<div class="setcol setcol-moves"><div class="setcell"><label>Moves</label>';
-			buf += '<input type="text" name="move1" class="chartinput" value="' + Tools.escapeHTML(set.moves[0]) + '" /></div>';
-			buf += '<div class="setcell"><input type="text" name="move2" class="chartinput" value="' + Tools.escapeHTML(set.moves[1]) + '" /></div>';
-			buf += '<div class="setcell"><input type="text" name="move3" class="chartinput" value="' + Tools.escapeHTML(set.moves[2]) + '" /></div>';
-			buf += '<div class="setcell"><input type="text" name="move4" class="chartinput" value="' + Tools.escapeHTML(set.moves[3]) + '" /></div>';
+			buf += '<input type="text" name="move1" class="textbox chartinput" value="' + Tools.escapeHTML(set.moves[0]) + '" /></div>';
+			buf += '<div class="setcell"><input type="text" name="move2" class="textbox chartinput" value="' + Tools.escapeHTML(set.moves[1]) + '" /></div>';
+			buf += '<div class="setcell"><input type="text" name="move3" class="textbox chartinput" value="' + Tools.escapeHTML(set.moves[2]) + '" /></div>';
+			buf += '<div class="setcell"><input type="text" name="move4" class="textbox chartinput" value="' + Tools.escapeHTML(set.moves[3]) + '" /></div>';
 			buf += '</div>';
 
 			// stats
-			buf += '<div class="setcol setcol-stats"><div class="setrow"><label>Stats</label><button class="setstats" name="stats" class="chartinput">';
+			buf += '<div class="setcol setcol-stats"><div class="setrow"><label>Stats</label><button class="textbox setstats" name="stats">';
 			buf += '<span class="statrow statrow-head"><label></label> <span class="statgraph"></span> <em>EV</em></span>';
 			var stats = {};
 			var defaultEV = (this.curTeam.gen > 2 ? 0 : 252);
diff --git a/style/client.css b/style/client.css
index e5a0b48a7..4b02909e1 100644
--- a/style/client.css
+++ b/style/client.css
@@ -62,7 +62,7 @@ body {
 }
 .textbox:focus {
 	outline: 0 none;
-	border: 1px solid #004488;
+	border-color: #004488;
 	box-shadow: inset 0px 1px 2px #D2D2D2, 0px 0px 5px #2266AA;
 	background: #FFFFFF;
 }
@@ -115,6 +115,28 @@ button:disabled {
 .dark a.button.subtle-notifying {
 	color: #AA6600;
 }
+
+.dark .textbox {
+	border: 1px solid #777777;
+	border-radius: 3px;
+	font-family: Verdana, Helvetica, Arial, sans-serif;
+	font-size: 9pt;
+
+	box-shadow: none;
+	background: #282B2D;
+	color: #DDD;
+}
+.dark .textbox:hover {
+	border-color: #AAAAAA;
+	box-shadow: none;
+	background: #111111;
+}
+.dark .textbox:focus {
+	outline: 0 none;
+	border-color: #AAAAAA;
+	box-shadow: 0px 0px 4px #77BBFF;
+	background: #111111;
+}
 /* .dark button {
 	background: #777777;
 	box-shadow: none;
@@ -2477,7 +2499,8 @@ a.ilink.yours {
 	box-shadow: inset 0px 1px 2px #D2D2D2, 1px 1px 0 rgba(255,255,255,.6);
 	background: #FFFFFF;
 }
-.setdetails:focus, .setstats:focus {
+.setdetails:focus, .setstats:focus,
+.dark .setdetails:focus, .dark .setstats:focus {
 	border: 2px solid #004488;
 	margin: 1px 1px 0 0;
 	outline: 0 none;
@@ -2582,35 +2605,10 @@ a.ilink.yours {
 .setchart-nickname input,
 .statform input.inputform {
 	display: block;
-	border: 1px solid #AAAAAA;
-	border-radius: 3px;
 	padding: 1px;
 	margin: 2px 3px 1px 1px;
-	font-family: Verdana, sans-serif;
-	font-size: 9pt;
 	width: 104px;
 	height: 20px;
-
-	box-shadow: inset 0px 1px 2px #CCCCCC, 1px 1px 0 rgba(255,255,255,.6);
-	background: #F8FBFD;
-	color: black;
-}
-.setchart input:hover,
-.setchart-nickname input:hover,
-.statform input.inputform:hover,
-.textbox:hover {
-	border-color: #474747;
-	box-shadow: inset 0px 1px 2px #D2D2D2, 1px 1px 0 rgba(255,255,255,.6);
-	background: #FFFFFF;
-}
-.setchart input:focus,
-.setchart-nickname input:focus,
-.statform input.inputform:focus,
-.textbox:focus {
-	outline: 0 none;
-	border: 1px solid #004488;
-	box-shadow: inset 0px 1px 2px #D2D2D2, 0px 0px 5px #2266AA;
-	background: #FFFFFF;
 }
 .setchart input.incomplete {
 	color: #CC3311;
@@ -3077,29 +3075,6 @@ a.ilink.yours {
 	background: black;
 }
 
-.dark .textbox {
-	border: 1px solid #777777;
-	border-radius: 3px;
-	padding: 2px 3px;
-	font-family: Verdana, Helvetica, Arial, sans-serif;
-	font-size: 9pt;
-
-	box-shadow: none;
-	background: #282B2D;
-	color: #DDD;
-}
-.dark .textbox:hover {
-	border-color: #AAAAAA;
-	box-shadow: none;
-	background: #111111;
-}
-.dark .textbox:focus {
-	outline: 0 none;
-	border: 1px solid #AAAAAA;
-	box-shadow: 0px 0px 5px #4488CC;
-	background: #111111;
-}
-
 .dark iframe.textbox,
 .dark iframe.textbox:hover,
 .dark iframe.textbox:focus {