Bug 43396: change style for selected fields (input field, spinner, combobox, textarea)

apps/common/main/resources/less/chat.less

@@ -145,6 +145,10 @@
             margin-bottom: 5px;
             border: 1px solid @gray-dark;
             font-size: 12px;
+
+            &:focus {
+                border-color: @gray-darker;
+            }
         }
     }
 }

apps/common/main/resources/less/combobox.less

@@ -9,10 +9,23 @@
         padding:  @padding-base-vertical @padding-base-horizontal;
         font-size:  @font-size-base;
         line-height: @line-height-base;
+
+        -o-transition: border-color ease-in-out .15s;
+        -webkit-transition: border-color ease-in-out .15s;
+        -moz-transition: border-color ease-in-out .15s;
+        transition: border-color ease-in-out .15s;
+
+        border-top-right-radius: 2px !important;
+        border-bottom-right-radius: 2px !important;
     }
 
     &.input-group-nr > .form-control {
         padding-right: 7px + 2 * @padding-base-horizontal;
+
+        &:focus,
+        &:focus ~ button.dropdown-toggle {
+            border-color: @gray-darker;
+        }
     }
 
     &.input-group-nr > .btn {
@@ -34,7 +47,6 @@
     }
 
     .form-control {
-        .border-right-radius(0);
         border-right: 0;
         position: static;
         z-index: auto;
@@ -44,7 +56,6 @@
     .btn,
     .btn:hover,
     .btn:focus {
-        .border-left-radius(0);
         border-left: 0;
         border-color: @input-border;
         background-color: transparent;
@@ -60,6 +71,13 @@
         border-color: @input-border;
     }
 
+    &.input-group-nr.open {
+        & > .form-control,
+        & > .btn {
+            border-color: @gray-darker;
+        }
+    }
+
     li {
         a {
             white-space: pre;

apps/common/main/resources/less/comments.less

@@ -60,6 +60,9 @@
             margin-bottom: 5px;
             border: 1px solid @gray-dark;
             height: 100%;
+            &:focus {
+                border-color: @gray-darker;
+            }
         }
     }
 
@@ -91,6 +94,9 @@
         word-break: break-all;
         line-height: 15px;
         color: @gray-deep;
+        &:focus {
+            border-color: @gray-darker;
+        }
     }
 
     .btn-fix {

apps/common/main/resources/less/input.less

@@ -56,6 +56,10 @@
             display: block;
         }
     }
+
+    .form-control:focus {
+        border-color: @gray-darker;
+    }
 }
 
 input:required:focus:invalid,
@@ -85,3 +89,7 @@ input[type="text"]::selection, textarea::selection {
     background: #3494fb;
     color: white;
 }
+
+textarea.form-control:focus {
+    border-color: @gray-darker;
+}

apps/common/main/resources/less/masked-field.less

@@ -3,4 +3,8 @@
     border: 1px solid @gray;
     border-radius: 2px;
     padding: 0 3px;
+
+    &:focus {
+        border-color: @gray-darker;
+    }
 }

apps/common/main/resources/less/spinner.less

@@ -8,6 +8,10 @@
         text-align: right;
         padding-left: 1px;
         padding-right: @trigger-width + 2px;
+
+        &:focus {
+            border-color: @gray-darker;
+        }
     }
 
     button {
@@ -34,7 +38,7 @@
     .spinner-buttons {
         position: absolute;
         top: 0;
-        right: 0;
+        right: 1px;
 
         i {
             display: inline-block;