Question

I am trying to get regular expressions that will do these cases:

Case 1:

background: -webkit-linear-gradient(top, #RANDOM_COLOR, #RANDOM_COLOR);

with

background: -ms-linear-gradient(top, #RANDOM_COLOR, #RANDOM_COLOR); 
background: -webkit-linear-gradient(top, #RANDOM_COLOR, #RANDOM_COLOR);

Case 2

box-shadow: RANDOM_TEXT;

with

-webkit-box-shadow: RANDOM_TEXT;
box-shadow: RANDOM_TEXT;

I just want to then take use of the Control+F feature in Dreamweaver and replace the text by using regular expressions.

Thank you

Answer 1

Dreamweaver is using the Javascript Regex flavor.

Find 1:

([ \t]*)(background:\s*-webkit-linear-gradient\(top\s*,\s*(#[a-fA-F0-9]{3,6})\s*,\s*(#[a-fA-F0-9]{3,6})\s*\)\s*;)
// assuming these are hexadecimal colors like you indicated with #

Replace 1:

$1background: -ms-linear-gradient(top, $3, $4); 
$1$2

Find 2:

([ \t]*)(box-shadow:\s*([^;]+)\s*;)

Replace 2:

$1-webkit-box-shadow: $3;
$1$2

---

Explanation of 1st find pattern:

All space characters \s are optional (thanks to *). Also, literal parentheses were escaped. In the replacement, the $1, $2 etc indicate [capturingGroup n].

(                          # capturing group #1
    [ \t]*                 # 0 or more spaces and/or tabs (could be any number of both)
)
(                          # capturing group #2

    background:\s*-webkit-linear-gradient\(top\s*,\s*
    (                      # capturing group #3
        #[a-fA-F0-9]{3,6}  # a number sign and a string with 3 or 6 digits that's made of a-zA-Z0-9 (aka. hexadecimal characters)
    )
    \s*,\s*
    (                      # capturing group #4
        #[a-fA-F0-9]{3,6}
    )
    \s*\)\s*;
)