Multiple backgrounds

[celorodovalho]

Hi,
I have the following section/rule:

.gradient {
    background: linear-gradient(45deg,transparent 0%,transparent 74%,#cce7f5 74%,#cce7f5 80%,transparent 80%,transparent 82%,#cce7f5 82%,#cce7f5 85%,transparent 85%,transparent 89%,#cce7f5 89%,#cce7f5 91%,transparent 91%,transparent 100%) no-repeat border-box,linear-gradient(to bottom,#53bce2 0%,#53bce2 80%,#54abbe 100%) no-repeat border-box;
}

And I need to get the value of the rule "background", but I need get separately, for exemple:

array(
    'background-image' => array(
        'linear-gradient(45deg,transparent 0%,transparent 74%,#cce7f5 74%,#cce7f5 80%,transparent 80%,transparent 82%,#cce7f5 82%,#cce7f5 85%,transparent 85%,transparent 89%,#cce7f5 89%,#cce7f5 91%,transparent 91%,transparent 100%)',
        'linear-gradient(to bottom,#53bce2 0%,#53bce2 80%,#54abbe 100%')
    ),
    'background-repeat' => array('no-repeat','no-repeat'),
    'background-origin' => array('border-box','border-box'),
);

...or something like this, but I just need the get the values of "background" separately (background-image, background-repeat, background-origin).
How can I do this?

[sabberworm]

That’s not currently possible, I’m afraid. The CSS Parser has no knowledge of the semantic meaning of individual CSS property names and values. There is the work that @ju1ius has done with expanding and collapsing shorthands but I don’t think it supports multiple backgrounds as it predates support for these.

If you do find the time to adapt DeclarationBlock#expandBackgroundShorthand and DeclarationBlock#createBackgroundShorthand for CSS3 backgrounds, I’d love a patch.