1 files changed, 72 insertions, 52 deletions

diff --git a/lib/dijit/themes/claro/form/Select.css b/lib/dijit/themes/claro/form/Select.css
index c8f1d43fa..a30ede640 100644
--- a/lib/dijit/themes/claro/form/Select.css
+++ b/lib/dijit/themes/claro/form/Select.css
@@ -1,89 +1,109 @@
-
+/* Select
+ * 
+ * Styling Select mainly includes:
+ * 
+ * 1. Containers
+ * 		.dijitSelect - for border, background-color
+ * 		.dijitButtonContents - for border
+ *
+ * 2. Arrow
+ * 		.dijitArrowButton - for border, padding and background-color|image
+ * 		.dijitArrowButtonInner - for border, background-color|image, display and width|height
+ * 
+ * 3. Menu
+ * 		.dijitSelectMenu .* - for border, padding
+ * 
+ * 4. Various states
+ * 		.dijitSelectHover|.dijitSelectFocused|.dijitSelectDisabled .* - for border, padding and background-color|image 
+ */
 .claro .dijitSelect .dijitButtonText {
-	padding: 0px 5px 2px 5px;
+  padding: 2px;
 }
+/* normal status */
 .claro .dijitSelect {
-	border: 1px solid #b5bcc7;
-	background-color: #f7fcff;
-	border-collapse: separate;
+  border: 1px solid #b5bcc7;
+  background-color: #ffffff;
+  border-collapse: separate;
 }
-.dj_ie6 .claro .dijitSelect,
-.dj_ie6 .claro .dijitSelect .dijitButtonNode {
-	background-image:none;
+.dj_ie6 .claro .dijitSelect, .dj_ie6 .claro .dijitSelect .dijitButtonNode {
+  background-image: none;
 }
 .claro .dijitSelect .dijitButtonContents {
-	border: 0px solid #b5bcc7;
-	border-right-width: 1px;
+  border: 0 solid #b5bcc7;
+  border-right-width: 1px;
 }
 .claro .dijitSelect .dijitArrowButton {
-	padding: 0;
-	border: 1px solid #fff;	
-	border-top:none;
-	background-color:#ebeef4;
-	background-image: url("images/formHighlight.png");
-	background-repeat:repeat-x;
+  padding: 0;
+  border: 1px solid #ffffff;
+  border-top: none;
+  background-color: #efefef;
+  background-image: url("images/formHighlight.png");
+  background-repeat: repeat-x;
 }
 .claro .dijitSelect .dijitArrowButton .dijitArrowButtonInner {
-	background-image: url("images/commonFormArrows.png");
-	background-position:-35px 70%;
-	background-repeat: no-repeat;
-	width:16px;
-	height:16px;
-	display:block;
+  background-image: url("images/commonFormArrows.png");
+  background-position: -35px 70%;
+  background-repeat: no-repeat;
+  width: 16px;
+  height: 16px;
 }
+/* hover status */
 .claro .dijitSelectHover {
-	border: 1px solid #769dc0;
-	background-color: #e9f4fe;
-	background-image: url('images/textBox_back.png');
-	background-repeat: repeat-x;
+  border: 1px solid #769dc0;
+  background-color: #e9f4fe;
+  background-image: url('images/textBox_back.png');
+  background-repeat: repeat-x;
 }
 .claro .dijitSelectHover .dijitButtonContents {
-	border-color:#81a5c6;
+  border-color: #769dc0;
 }
 .claro .dijitSelectHover .dijitArrowButton {
-	background-color:#abd6ff;
+  background-color: #abd6ff;
 }
 .claro .dijitSelectHover .dijitArrowButton .dijitArrowButtonInner {
-	background-position:-70px 70%;
+  background-position: -70px 70%;
 }
+/* focused status */
 .claro .dijitSelectFocused {
-	border: 1px solid #769dc0;
+  border: 1px solid #769dc0;
 }
 .claro .dijitSelectFocused .dijitButtonContents {
-	border-color:#81a5c6;
+  border-color: #769dc0;
 }
 .claro .dijitSelectFocused .dijitArrowButton {
-	background-color:#7dbefa;
-	background-position:0px -177px;
-	border: none;
-	padding: 0px 1px;
+  background-color: #7dbefa;
+  background-position: 0 -177px;
+  border: none;
+  padding: 0 1px;
 }
 .claro .dijitSelectFocused .dijitArrowButton .dijitArrowButtonInner {
-	background-position:-70px 70%;
-	margin-bottom: 1px;
+  background-position: -70px 70%;
+  margin-bottom: 1px;
 }
+/* disable status */
 .claro .dijitSelectDisabled {
-	border: 1px solid #d3d3d3;
-	background-color: #efefef;
-	background-image: none;
-	color: #818181;
+  border: 1px solid #d3d3d3;
+  background-color: #efefef;
+  background-image: none;
+  color: #818181;
 }
-.claro .dijitSelectDisabled .dijitArrowButton { 
-	background-color: #efefef;
+.claro .dijitSelectDisabled .dijitArrowButton {
+  background-color: #efefef;
 }
 .claro .dijitSelectDisabled .dijitArrowButton .dijitArrowButtonInner {
-	background-position:0px 70%
+  background-position: 0 70%;
 }
-.claro .dijitSelectMenu td.dijitMenuItemIconCell,
-.claro .dijitSelectMenu td.dijitMenuArrowCell { 
-	
-	display: none;  
+/* Dropdown menu style for select */
+.claro .dijitSelectMenu td.dijitMenuItemIconCell, .claro .dijitSelectMenu td.dijitMenuArrowCell {
+  /* so that arrow and icon cells from MenuItem are not displayed */
+
+  display: none;
 }
 .claro .dijitSelectMenu td.dijitMenuItemLabel {
-	
-	padding-left: 5px;
-	padding-right: 5px;
+  /* line up menu text with text in select box (in LTR and RTL modes) */
+
+  padding: 2px;
 }
 .claro .dijitSelectMenu .dijitMenuSeparatorTop {
-	border-bottom:1px solid #769dc0;
+  border-bottom: 1px solid #769dc0;
 }