Button: Removed ui-button-text-icon class. Added ui-button-text-icon-primary and ui-button-text-icon-secondary classes. Fixed #5382 - Button: specifying only a secondary icon for the button widget locates the icon on the left

1 files changed, 56 insertions, 25 deletions

diff --git a/tests/static/button/default.html b/tests/static/button/default.html
index a2c35a4ad..e0e005090 100644
--- a/tests/static/button/default.html
+++ b/tests/static/button/default.html
@@ -23,24 +23,34 @@
 		</button>
 		
 		<button class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
-			<span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
-			<span class="ui-button-text">Button</span>
+			<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
+			<span class="ui-button-text">Primary icon</span>
 		</button>
-		
-		<button class="ui-button ui-button-text-icon ui-widget ui-state-default ui-corner-all">
-			<span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
-			<span class="ui-button-text">Button</span>
+
+		<button class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
+			<span class="ui-button-text">Secondary icon</span>
+			<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
+		</button>
+
+		<button class="ui-button ui-button-text-icon-primary ui-widget ui-state-default ui-corner-all">
+			<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
+			<span class="ui-button-text">Primary icon</span>
+		</button>
+
+		<button class="ui-button ui-button-text-icon-secondary ui-widget ui-state-default ui-corner-all">
+			<span class="ui-button-text">Secondary icon</span>
+			<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
 		</button>
 		
 		<button class="ui-button ui-button-text-icons ui-widget ui-state-default ui-corner-all">
 			<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
-			<span class="ui-button-text">Button</span>
+			<span class="ui-button-text">Both icons</span>
 			<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
 		</button>
 		
 		<button class="ui-button ui-button-icons-only ui-widget ui-state-default ui-corner-all">
 			<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
-			<span class="ui-button-text">Button</span>
+			<span class="ui-button-text">No text</span>
 			<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
 		</button>
 	</div>
@@ -53,24 +63,34 @@
 		</a>
 		
 		<a href="#" class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
-			<span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
-			<span class="ui-button-text">Button</span>
+			<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
+			<span class="ui-button-text">Primary icon</span>
 		</a>
 		
-		<a href="#" class="ui-button ui-button-text-icon ui-widget ui-state-default ui-corner-all">
-			<span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
-			<span class="ui-button-text">Button</span>
+		<a href="#" class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
+			<span class="ui-button-text">Secondary icon</span>
+			<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
+		</a>
+		
+		<a href="#" class="ui-button ui-button-text-icon-primary ui-widget ui-state-default ui-corner-all">
+			<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
+			<span class="ui-button-text">Primary icon</span>
+		</a>
+
+		<a href="#" class="ui-button ui-button-text-icon-secondary ui-widget ui-state-default ui-corner-all">
+			<span class="ui-button-text">Secondary icon</span>
+			<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
 		</a>
 		
 		<a href="#" class="ui-button ui-button-text-icons ui-widget ui-state-default ui-corner-all">
 			<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
-			<span class="ui-button-text">Button</span>
+			<span class="ui-button-text">Both icons</span>
 			<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
 		</a>
 		
 		<a href="#" class="ui-button ui-button-icons-only ui-widget ui-state-default ui-corner-all">
 			<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
-			<span class="ui-button-text">Button</span>
+			<span class="ui-button-text">No text</span>
 			<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
 		</a>
 	</div>
@@ -85,24 +105,34 @@
 		</label>
 		
 		<label class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
-			<span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
-			<span class="ui-button-text">Button</span>
+			<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
+			<span class="ui-button-text">Primary icon</span>
 		</label>
 		
-		<label class="ui-button ui-button-text-icon ui-widget ui-state-default ui-corner-all">
-			<span class="ui-button-icon-primary ui-icon ui-icon-locked"></span>
-			<span class="ui-button-text">Button</span>
+		<label class="ui-button ui-button-icon-only ui-widget ui-state-default ui-corner-all" title="Button">
+			<span class="ui-button-text">Secondary icon</span>
+			<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
+		</label>
+		
+		<label class="ui-button ui-button-text-icon-primary ui-widget ui-state-default ui-corner-all">
+			<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
+			<span class="ui-button-text">Primary icon</span>
+		</label>
+		
+		<label class="ui-button ui-button-text-icon-secondary ui-widget ui-state-default ui-corner-all">
+			<span class="ui-button-text">Secondary icon</span>
+			<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
 		</label>
 		
 		<label class="ui-button ui-button-text-icons ui-widget ui-state-default ui-corner-all">
 			<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
-			<span class="ui-button-text">Button</span>
+			<span class="ui-button-text">Both icons</span>
 			<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
 		</label>
 		
 		<label class="ui-button ui-button-icons-only ui-widget ui-state-default ui-corner-all">
 			<span class="ui-button-icon-primary ui-icon ui-icon-gear"></span>
-			<span class="ui-button-text">Button</span>
+			<span class="ui-button-text">No text</span>
 			<span class="ui-button-icon-secondary ui-icon ui-icon-triangle-1-s"></span>
 		</label>
 	</div>
@@ -111,9 +141,10 @@
 	<h2>Button Sets</h2>
 	
 	<div class="ui-buttonset">
-		<button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-left"><span class="ui-button-text">Simple button</span></button>
-		<button class="ui-button ui-button-text-only ui-widget ui-state-default"><span class="ui-button-text">Simple button</span></button>
-		<button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-right"><span class="ui-button-text">Simple button</span></button>
+		<button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-left"><span class="ui-button-text">First</span></button>
+		<button class="ui-button ui-button-text-only ui-widget ui-state-default"><span class="ui-button-text">Middle</span></button>
+		<button class="ui-button ui-button-text-only ui-widget ui-state-default"><span class="ui-button-text">Middle</span></button>
+		<button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-right"><span class="ui-button-text">Last</span></button>
 	</div>