1 files changed, 38 insertions, 0 deletions
diff --git a/app/assets/stylesheets/framework/forms.scss b/app/assets/stylesheets/framework/forms.scss
index bba995a6de3..e86edff3f13 100644
--- a/app/assets/stylesheets/framework/forms.scss
+++ b/app/assets/stylesheets/framework/forms.scss
@@ -14,6 +14,28 @@ input[type='text'].danger {
   text-shadow: 0 1px 1px $white;
 }
 
+/**
+ * When form input type is number, Firefox & Safari show the up/down arrows
+ * on the right side of the input persistently, while Chrome shows it only
+ * on hover or focus, this fix allows us to hide the arrows in all browsers.
+ * You can conditionally add/remove `hide-spinners` class to have consistent
+ * behaviour across browsers.
+ */
+
+/* stylelint-disable property-no-vendor-prefix */
+input[type='number'].hide-spinners {
+  -moz-appearance: textfield;
+  appearance: textfield;
+
+  &::-webkit-inner-spin-button,
+  &::-webkit-outer-spin-button {
+    -webkit-appearance: none;
+    appearance: none;
+    margin: 0;
+  }
+}
+/* stylelint-enable property-no-vendor-prefix */
+
 .datetime-controls {
   select {
     width: 100px;
@@ -204,6 +226,22 @@ label {
   }
 }
 
+.show-password-complexity-errors {
+  .form-control:not(textarea) {
+    height: 34px;
+  }
+
+  .password-complexity-error-outline {
+    border: 1px solid $red-500;
+
+    &:focus {
+      box-shadow: 0 0 0 1px $red-500 inset, 0 1px 1px $gl-field-focus-shadow inset,
+        0 0 4px 0 $gl-field-focus-shadow-error;
+      border: 0 none;
+    }
+  }
+}
+
 .input-icon-wrapper,
 .select-wrapper {
   position: relative;