Get Oxygen Global colors as CSS Variables

If you want to write external CSS the easiest way to sync the global colors between the oxygen and an external CSS is through the variables.

You will need to get all variables into the header under the root. The output should look like this:

<style type='text/css'>
:root {
	 --blue: #2245f8;
	 --yellow: #ffeb57;
	 --black: #1d1d1b;
	 --white: #ffffff;
	 --grey: #89a0b5;
	 --light-grey: #e4e6e8;
	 --ultra-light-grey: #f8f9fb;
	 --new-feature: #64fcc2;
}
</style>

<?php
function dplugins_oxy_colors_css(){
    $oxy_colors = oxy_get_global_colors();
    //echo "<pre>"; print_r($oxy_colors); "</pre>";
    if(!empty($oxy_colors['colors'])){
        $html = "<style type='text/css'>\n:root {\n";
        $color_name = "";
        foreach($oxy_colors['colors'] as $color){
            $color_name = strtolower(trim(str_replace(" ", "-", $color['name'])));
            $html .= "\t --".$color_name.": " . $color['value'] . ";\n";
        }
        $html .= "}\n</style>";
        echo $html;
    }
    //exit;
}
add_action('wp_head', 'dplugins_oxy_colors_css', 999999999999);
?>