#46423 - [Modern] focus borders on widgets, r=hangas, a=ben

themes/modern/global/button.css

@@ -40,12 +40,19 @@ button.plain-extended {}
     {
 	  -moz-binding			: url("chrome://global/skin/globalBindings.xml#three-slice-button");
       background-color      : transparent;
-      border				: 0px;
-      margin				: 4px 5px 5px 5px;
+      border				: 3px solid transparent;
+      margin        : 2px;
       color					: #1C1D1F;
       min-width				: 60px;
+      -moz-user-focus: normal !important;
     }
 
+  button:focus 
+    {
+      border-color: #73869C;
+      -moz-border-radius: 10px;
+    }
+    
   button[disabled="true"], button[disabled="true"]:hover, button[disabled="true"]:hover:active
     {
       border				: 0px;
@@ -122,13 +129,17 @@ button.plain-extended {}
 /* Default Button States */
 
   button[default="true"] {
-  	margin: 2px 5px 3px 5px;
+    margin        : 1px;
+  }
+
+  button[default="true"]:focus {
+    -moz-border-radius: 12px;
   }
 
   .button-image-left[default="true"] {
 	background	: url(chrome://global/skin/button-def-left.gif) no-repeat;
-	width: 11px;
-	height: 23px;
+	width: 10px;
+	height: 21px;
   }
 
   .button-image-middle[default="true"] {
@@ -137,8 +148,8 @@ button.plain-extended {}
 
   .button-image-right[default="true"] {
 	background	: url(chrome://global/skin/button-def-right.gif) no-repeat;
-	width: 9px;
-	height: 23px;
+	width: 8px;
+	height: 21px;
   }
 
   button:hover:active > .button-image-left[default="true"] {

themes/modern/global/checkbox.css

@@ -5,8 +5,8 @@
 /* outer checkbox frame */
   checkbox 
     {
-      margin: 3px 5px 3px 5px;
-      border: 1px solid transparent;
+      border        : 2px solid transparent;
+      margin			  : 0px 2px 0px 2px;
       padding-left: 1px;
       padding-right: 1px;
     }
@@ -19,15 +19,9 @@
 /* checkmark outer frame */
   checkbox > .internal-box > .checkmark-box 
     {
-	  margin: 3px 3px 3px 3px;
+	  margin: 3px 2px 3px 3px;
     }
 
-  checkbox[disabled="true"] > .internal-box > .checkmark-box,
-  checkbox[disabled="true"]:hover > .internal-box > .checkmark-box 
-    {
-      //border: 1px solid #999999;
-    }
-    
 /* checkmark inner frame */
   checkbox > .internal-box > .checkmark-box > .checkbox-check 
     {
@@ -69,7 +63,7 @@
   checkbox[value] > .internal-box > html
     {
       margin: 0px 0px 2px 0px;
-      padding: 2px 2px 2px 0px;
+      padding: 1px;
     }
 
   checkbox[disabled="true"][value] > .internal-box > html 
@@ -77,9 +71,8 @@
       color: #999999;
     }
     
-  checkbox:focus > .internal-box > .checkmark-box
+  checkbox:focus
     {
-      border              : 2px solid #F2C34F;
-      margin			  : 1px 1px 1px 1px;
+      border-color: #73869C;
       -moz-border-radius  : 4px 5px 4px 5px;
     }

themes/modern/global/radio.css

@@ -4,19 +4,24 @@
 /* outer frame */
   radio 
     {
-      margin: 3px 5px 3px 5px;
+      border: 2px solid transparent;
+      margin: 0px 3px 0px 3px;
     }
 
   radio > .internal-box
     {
-      -moz-user-focus: none;
     }
 
-
+  #radio:focus 
+    {
+      border-color: #73869C;
+      -moz-border-radius  : 4px 5px 4px 5px;
+    }
+    
 /* checkmark outer frame */
   radio > .internal-box > .checkmark-box 
     {
-	  margin: 3px 3px 3px 3px;
+      margin: 3px;
     }
 
   radio[disabled="true"] > .internal-box > .checkmark-box,
@@ -82,11 +87,3 @@
       color: #999999;
     }
   
-  radio:focus > .internal-box > .checkmark-box 
-    { 
-      border              : 2px solid #F2C34F;
-      margin			  : 1px 1px 1px 1px;
-      -moz-border-radius  : 8px 8px 8px 8px;
-    }
-    
-    

themes/modern/global/textfield.css

@@ -7,94 +7,42 @@
 /* outer frame */
   textfield
     {
-      /*-moz-binding		  : url(chrome://global/skin/globalBindings.xml#textfield);*/
+      padding             : 0px;
+      border              : 0px;
+      margin              : 4px;
+      background-color    : #FFFFFF;
       font                : inherit;
       color               : #000000;
-      padding             : 0px;
-      margin              : 2px 4px 2px 4px;
-      background-color    : #FFFFFF;
-      -moz-border-radius  : 4px 4px 3px 6px;
-      border              : 2px inset #B4C3D4;
       cursor              : text;
     }
-
+  
   textfield[readonly="true"]
     {
-      background-color    : #CCCCCC;
+      background-color    : #B4C3D4;
     }
   
   textfield[focused="true"]
     {
-      border              : 2px solid #F2C34F;
-      margin              : 2px 4px 2px 4px;
-      -moz-border-radius  : 7px 7px 4px 6px;
+      border              : 3px solid #73869C;
+      margin              : 1px;
+      -moz-border-radius  : 6px;
     }
    
+  textfield[focused="true"] > .textfield-internal-box
+    {
+      border: 1px solid black;
+    }
+
   textfield[focused="true"][readonly="true"]
     {
-      border              : 1px inset #CCCCCC;
-      margin              : 2px 4px 2px 4px;
+      border-color: #CCCCCC;
     }
 
-/* Border Pieces */
-
-  .textfield-left-top 
-  	{
-  	  background		  : url(chrome://global/skin/textfield-left-top.gif) no-repeat;
-  	  width				  : 4px;
-  	  height			  : 4px;
-  	}
-
-  .textfield-left-middle
-    {
-  	  background		  : url(chrome://global/skin/textfield-left-middle.gif) repeat-y;
-  	  width				  : 4px;
-    }
-
-  .textfield-left-bottom 
-  	{
-  	  background		  : url(chrome://global/skin/textfield-left-bottom.gif) no-repeat;
-  	  width				  : 4px;
-  	  height			  : 4px;
-  	}
-
-  .textfield-middle-top
-    {
-  	  background		  : url(chrome://global/skin/textfield-middle-top.gif) repeat-x;
-  	  height			  : 4px;
-    }
-
-  .textfield-middle-bottom
-    {
-  	  background		  : url(chrome://global/skin/textfield-middle-bottom.gif) repeat-x;
-  	  height			  : 2px;
-    }
-
-  .textfield-right-top 
-  	{
-  	  background		  : url(chrome://global/skin/textfield-right-top.gif) no-repeat;
-  	  width				  : 3px;
-  	  height			  : 4px;
-  	}
-
-  .textfield-right-middle
-    {
-  	  background		  : url(chrome://global/skin/textfield-right-middle.gif) repeat-y right;
-  	  width				  : 2px;
-    }
-
-  .textfield-right-bottom 
-  	{
-  	  background		  : url(chrome://global/skin/textfield-right-bottom.gif) no-repeat;
-  	  width				  : 2px;
-  	  height			  : 2px;
-  	}
-
-
 /* internal frame */
   .textfield-internal-box 
     {
       margin              : 0px;
+      border              : 1px inset #B4C3D4;
       padding             : 1px 2px 1px 2px;
       cursor              : text;
       background-color    : inherit;
@@ -103,7 +51,7 @@
   
   textfield[disabled="true"] > .textfield-internal-box
     {
-      background-color    : threedface;
+      background-color    : #B4C3D4;
     }
   
   .textarea-internal-box