How can I separate CSS elements and values using regex? - regex

Question

I have CSS file and want to separate elements and values in form fields to make it editable using regular expressions.
This is my CSS:
<cfsavecontent variable="css">
.input-block-level {
display: block;
width: 100%;
min-height: 30px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
##map_canvas img,
.google-maps img {
/*edit*/max-width: none;
}
#sup {
position: relative;
font-size: 75%;
line-height: 0;
vertical-align: baseline;
}
</cfsavecontent>
I have tried the expression below to extract the elements between the opening and closing braces. It works fine but I am wondering how to get elements and values delimited by lines.
<cfset reg1 = REMatch("{(?i)(.+?)}",css) />
<cfdump var="#reg1#" label="braces">
How can I write a regex pattern to separate the elements and values? Thanks in advance.

Answer 1

This works for me to split up the items and values, not sure it's exactly what you're needing though:
<cfset reg1 = REMatch("{(?i)(.+?)}",css) />
<cfloop index="item" array="#reg1#">
<cfset lines = listToArray(item, Chr(10))>
<cfloop index="line" array="#lines#">
<cfset arrLine = listToArray(line, ":")>
<cfif arrayLen(arrLine) EQ 2>
<cfset item = trim(arrLine[1])>
<cfset value = trim(arrLine[2])>
<cfoutput>
item: #item#<br>
value: #value#<br>
<br>
</cfoutput>
</cfif>
</cfloop>
</cfloop>