| Current File : /home/digitaw/www/wp-content/plugins/otter-blocks/inc/css/blocks/class-font-awesome-icons-css.php |
<?php
/**
* Css handling logic for blocks.
*
* @package ThemeIsle\GutenbergBlocks\CSS\Blocks
*/
namespace ThemeIsle\GutenbergBlocks\CSS\Blocks;
use ThemeIsle\GutenbergBlocks\Base_CSS;
use ThemeIsle\GutenbergBlocks\CSS\CSS_Utility;
/**
* Class Font_Awesome_Icons_CSS
*/
class Font_Awesome_Icons_CSS extends Base_CSS {
/**
* The namespace under which the blocks are registered.
*
* @var string
*/
public $block_prefix = 'font-awesome-icons';
/**
* Generate Font Awesome Icons CSS
*
* @param mixed $block Block data.
* @return string
* @since 1.3.0
* @access public
*/
public function render_css( $block ) {
$css = new CSS_Utility( $block );
$align_map = array(
'left' => 'flex-start',
'center' => 'center',
'right' => 'flex-end',
);
$css->add_item(
array(
'properties' => array(
array(
'property' => '--align',
'value' => 'align',
'condition' => function ( $attrs ) {
return isset( $attrs['align'] ) && is_string( $attrs['align'] );
},
'format' => function ( $value, $attrs ) use ( $align_map ) {
return $align_map[ $value ];
},
),
array(
'property' => '--align',
'value' => 'align',
'condition' => function ( $attrs ) {
return isset( $attrs['align'] ) && isset( $attrs['align']['desktop'] );
},
'format' => function ( $value, $attrs ) {
return $value['desktop'];
},
),
array(
'property' => '--align-tablet',
'value' => 'align',
'condition' => function ( $attrs ) {
return isset( $attrs['align'] ) && isset( $attrs['align']['tablet'] );
},
'format' => function ( $value, $attrs ) {
return $value['tablet'];
},
),
array(
'property' => '--align-mobile',
'value' => 'align',
'condition' => function ( $attrs ) {
return isset( $attrs['align'] ) && isset( $attrs['align']['mobile'] );
},
'format' => function ( $value, $attrs ) {
return $value['mobile'];
},
),
array(
'property' => '--border-color',
'value' => 'borderColor',
),
array(
'property' => '--border-size',
'value' => 'borderSize',
'unit' => 'px',
),
array(
'property' => '--border-radius',
'value' => 'borderRadius',
'unit' => '%',
),
array(
'property' => '--margin',
'value' => 'margin',
'format' => function ( $value ) {
if ( is_numeric( $value ) ) {
return $value . 'px';
}
return CSS_Utility::box_values(
$value,
array(
'top' => '5px',
'right' => '5px',
'bottom' => '5px',
'left' => '5px',
)
);
},
'hasSync' => 'icon-margin',
),
array(
'property' => '--padding',
'value' => 'padding',
'format' => function ( $value ) {
if ( is_numeric( $value ) ) {
return $value . 'px';
}
return CSS_Utility::box_values(
$value,
array(
'top' => '5px',
'right' => '5px',
'bottom' => '5px',
'left' => '5px',
)
);
},
'hasSync' => 'icon-padding',
),
array(
'property' => '--font-size',
'value' => 'fontSize',
'format' => function ( $value, $attrs ) {
return is_numeric( $value ) ? $value . 'px' : $value;
},
'hasSync' => 'icon-font-size',
),
),
)
);
$css->add_item(
array(
'selector' => ' .wp-block-themeisle-blocks-font-awesome-icons-container',
'properties' => array(
array(
'property' => 'color',
'value' => 'textColor',
'hasSync' => 'icon-text-color',
),
array(
'property' => 'background',
'value' => 'backgroundColor',
'hasSync' => 'icon-background-color',
),
),
)
);
$css->add_item(
array(
'selector' => ' .wp-block-themeisle-blocks-font-awesome-icons-container:hover',
'properties' => array(
array(
'property' => 'color',
'value' => 'textColorHover',
'condition' => function ( $attrs ) {
return ! ( isset( $attrs['library'] ) && 'themeisle-icons' === $this->get_attr_value( $attrs['library'], 'fontawesome' ) );
},
'hasSync' => 'icon-text-color-hover',
),
array(
'property' => 'background',
'value' => 'backgroundColorHover',
'hasSync' => 'icon-background-color-hover',
),
array(
'property' => 'border-color',
'value' => 'borderColorHover',
'hasSync' => 'iconBorderColorHover',
),
),
)
);
$css->add_item(
array(
'selector' => ' .wp-block-themeisle-blocks-font-awesome-icons-container a',
'properties' => array(
array(
'property' => 'color',
'value' => 'textColor',
'condition' => function ( $attrs ) {
return ! ( isset( $attrs['library'] ) && 'themeisle-icons' === $this->get_attr_value( $attrs['library'], 'fontawesome' ) );
},
'hasSync' => 'icon-text-color',
),
),
)
);
$css->add_item(
array(
'selector' => ' .wp-block-themeisle-blocks-font-awesome-icons-container svg',
'properties' => array(
array(
'property' => 'fill',
'value' => 'textColor',
'condition' => function ( $attrs ) {
return isset( $attrs['library'] ) && 'themeisle-icons' === $this->get_attr_value( $attrs['library'], 'fontawesome' );
},
'hasSync' => 'icon-text-color',
),
),
)
);
$css->add_item(
array(
'selector' => ' .wp-block-themeisle-blocks-font-awesome-icons-container:hover svg',
'properties' => array(
array(
'property' => 'fill',
'value' => 'textColorHover',
'condition' => function ( $attrs ) {
return isset( $attrs['library'] ) && 'themeisle-icons' === $this->get_attr_value( $attrs['library'], 'fontawesome' );
},
'hasSync' => 'icon-text-color-hover',
),
),
)
);
$style = $css->generate();
return $style;
}
/**
* Generate Accordion Global CSS
*
* @return string|void
* @since 2.0.0
* @access public
*/
public function render_global_css() {
$defaults = get_option( 'themeisle_blocks_settings_global_defaults' );
$block = $this->library_prefix . '/' . $this->block_prefix;
if ( empty( $defaults ) ) {
return;
}
$defaults = json_decode( $defaults, true );
if ( ! isset( $defaults[ $block ] ) ) {
return;
}
$block = array(
'attrs' => $defaults[ $block ],
);
$css = new CSS_Utility( $block );
$css->add_item(
array(
'selector' => '.wp-block-themeisle-blocks-font-awesome-icons',
'properties' => array(
array(
'property' => '--icon-font-size',
'value' => 'fontSize',
'format' => function ( $value, $attrs ) {
return is_numeric( $value ) ? $value . 'px' : $value;
},
),
array(
'property' => '--icon-margin',
'value' => 'margin',
'unit' => 'px',
),
array(
'property' => '--icon-padding',
'value' => 'padding',
'unit' => 'px',
),
array(
'property' => '--icon-text-color-hover',
'value' => 'textColorHover',
),
array(
'property' => '--icon-background-color-hover',
'value' => 'backgroundColorHover',
),
array(
'property' => '--icon-text-color',
'value' => 'textColor',
),
array(
'property' => '--icon-background-color',
'value' => 'backgroundColor',
),
),
)
);
$style = $css->generate();
return $style;
}
}