Devtools Color: Basic support for #RRGGBBAA and #RGBA

third_party/WebKit/Source/devtools/front_end/elements/StylesSidebarPane.js

 /*
  * Copyright (C) 2007 Apple Inc.  All rights reserved.
  * Copyright (C) 2009 Joseph Pecoraro
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
  *     notice, this list of conditions and the following disclaimer.
@@ skipping 3013 matching lines @@
  */
 WebInspector.StylesSidebarPropertyRenderer = function(rule, node, name, value)
 {
     this._rule = rule;
     this._node = node;
     this._propertyName = name;
     this._propertyValue = value;
 }
 
 WebInspector.StylesSidebarPropertyRenderer._variableRegex = /(var\(--.*?\))/g;
-WebInspector.StylesSidebarPropertyRenderer._colorRegex = /((?:rgb|hsl)a?\([^)]+\)|#[0-9a-fA-F]{6}|#[0-9a-fA-F]{3}|\b\w+\b(?!-))/g;
+WebInspector.StylesSidebarPropertyRenderer._colorRegex = /((?:rgb|hsl)a?\([^)]+\)|#[0-9a-fA-F]{8}|#[0-9a-fA-F]{6}|#[0-9a-fA-F]{3,4}|\b\w+\b(?!-))/g;
 WebInspector.StylesSidebarPropertyRenderer._bezierRegex = /((cubic-bezier\([^)]+\))|\b(linear|ease-in-out|ease-in|ease-out|ease)\b)/g;
 
 /**
  * @param {string} value
  * @return {!RegExp}
  */
 WebInspector.StylesSidebarPropertyRenderer._urlRegex = function(value)
 {
     // Heuristically choose between single-quoted, double-quoted or plain URL regex.
     if (/url\(\s*'.*\s*'\s*\)/.test(value))
@@ skipping 93 matching lines @@
     WebInspector.context.addFlavorChangeListener(WebInspector.DOMNode, onNodeChanged);
     onNodeChanged();
     return button;
 
     function onNodeChanged()
     {
         var node = WebInspector.context.flavor(WebInspector.DOMNode);
         button.setEnabled(!!node);
     }
 }