<?php
/* ----------------------------------------------------------------
Element definitions here
-----------------------------------------------------------------*/
global $kleo_config, $kleo_theme;
$style_sets = $kleo_config['style_sets'];
$sections = kleo_style_options();
if (!empty($sections)) {
foreach ($sections as $name => $section) {
//checks if we have a dark or light background and then creates a stronger version of the main font color for headings
$section['heading'] = kleo_calc_similar_color($section['text'], kleo_calc_perceived_brightness($section['bg'], 100) ? 'lighter' : 'darker', 3);
//check if we have a dark or lighht background and then creates a lighter version of the main font color
$section['lighter'] = kleo_calc_similar_color($section['bg'], kleo_calc_perceived_brightness($section['bg'], 100) ? 'lighter' : 'darker', 4);
// Highlight background color in RBG
$section["high_bg_rgb"] = kleo_hex_to_rgb($section['high_bg']);
// Alternate background color in RBG
$section["alternate_bg_rgb"] = kleo_hex_to_rgb($section['alt_bg']);
// Text color in RBG
$section["text_color_rgb"] = kleo_hex_to_rgb($section['text']);
/* Use like this
*
* .<?php echo $name; ?>-color .rgb-element {
* background-color: rgba(<?php echo $section['high_bg_rgb']['r']; ?>,<?php echo $section['high_bg_rgb']['g']; ?>,<?php echo $section['high_bg_rgb']['b']; ?>,0.4);
* }
*/
?>
$section['headings'] = $section['heading'];
}
//check if we have a dark or light background and then creates a lighter version of the main font color
$section['lighter'] = kleo_calc_similar_color($section['bg'], kleo_calc_perceived_brightness($section['bg'], 100) ? 'lighter' : 'darker', 4);
// Highlight background color in RBG
$section["high_bg_rgb"] = kleo_hex_to_rgb($section['high_bg']);
// Alternate background color in RBG
$section["alternate_bg_rgb"] = kleo_hex_to_rgb($section['alt_bg']);
// Text color in RBG
$section["text_color_rgb"] = kleo_hex_to_rgb($section['text']);
// Background color in RBG
$section["bg_color_rgb"] = kleo_hex_to_rgb($section['bg']);
// Link color in RBG
$section["link_color_rgb"] = kleo_hex_to_rgb($section['link']);
//check if we have a dark or light background and then create a stronger version of the background color
$section['mat-color-bg'] = kleo_calc_similar_color($section['bg'], kleo_calc_perceived_brightness($section['bg'], 50) ? 'lighter' : 'darker', 1);
/* Use like this
*
* .<?php echo $name; ?>-color .rgb-element {
* background-color: rgba(<?php echo $section['high_bg_rgb']['r']; ?>,<?php echo $section['high_bg_rgb']['g']; ?>,<?php echo $section['high_bg_rgb']['b']; ?>,0.4);
* }
*/
?>
<?php
if ($name == 'main') {
//only for main-color
?>
/*** Popover ***/
.popover-content {
