fix: support 3digit hex color input (#3706)

flarum · Dec 12, 2022 · 07f8b61 · 07f8b61
1 parent 0eff1f6
commit 07f8b61
Showing 1 changed file with 5 additions and 0 deletions.
diff --git a/framework/core/js/src/common/components/ColorPreviewInput.tsx b/framework/core/js/src/common/components/ColorPreviewInput.tsx
@@ -10,6 +10,11 @@ export default class ColorPreviewInput extends Component {
 
     attrs.type ||= 'text';
 
+    // If the input is a 3 digit hex code, convert it to 6 digits.
+    if (attrs.value.length === 4) {
+      attrs.value = attrs.value.replace(/#([a-f0-9])([a-f0-9])([a-f0-9])/, '#$1$1$2$2$3$3');
+    }
+
     return (
       <div className="ColorInput">
         <input className={classList('FormControl', className)} id={id} {...attrs} />