<?php
/**
 * @package DJ-Catalog2-Yootheme
 * @copyright Copyright (C) DJ-Extensions.com, All rights reserved.
 * @license http://www.gnu.org/licenses GNU/GPL
 * @author url: http://dj-extensions.com
 * @author email contact@dj-extensions.com
 */
defined('_JEXEC') or die;
$el = $this->el('div', [

	'class' =>  $this->expr([
		'djc_compare',
		'uk-panel',
		'uk-text-{compare_text_style}' => ['compare_text_style' => $element['compare_text_style']],
		'uk-text-{compare_text_size} {@!compare_text_style}' => ['compare_text_size' => $element['compare_text_size'], 'compare_text_style' => $element['compare_text_style']],
		'uk-text-{compare_text_color}'  => ['compare_text_color' => $element['compare_text_color']],
		'uk-margin[-{compare_margin}]-top {@!compare_margin: remove}',
		'uk-margin-remove-top {@compare_margin: remove}',
		'uk-margin-remove-bottom',
		'uk-inline {@position_inline_compare}' => ['position_inline_compare' => $element['position_inline_compare']],
	], $element),
]);

//Style position && size of an element
$el->attr('style', [
	'position:{position_compare};' => ['position_compare' => $element['position_compare']],
	'left: {position_left_compare}px;' => ['position_left_compare' => $element['position_left_compare']],
	'right: {position_right_compare}px;' => ['position_right_compare' => $element['position_right_compare']],
	'top: {position_top_compare}px;' => ['position_top_compare' => $element['position_top_compare']],
	'bottom: {position_bottom_compare}px;' => ['position_bottom_compare' => $element['position_bottom_compare']],
	'z-index:{position_z_index_compare};' => ['position_z_index_compare' => $element['position_z_index_compare']],
	'width:{compare_width};' => ['compare_width' => $element['compare_width']],
	'height:{compare_height};' => ['compare_height' => $element['compare_height']],

], $element);

echo $el($props, $attrs, $props['compare']);
