| 1 |
<?php |
| 2 |
/** |
| 3 |
* The dynamic CSS for Carousel layout. |
| 4 |
* |
| 5 |
* @package Smart_Post_Show |
| 6 |
*/ |
| 7 |
|
| 8 |
if ( ! defined( 'ABSPATH' ) ) { |
| 9 |
exit; // Exit if accessed directly. |
| 10 |
} |
| 11 |
|
| 12 |
$carousel_nav_position = SP_PC_Functions::pcp_metabox_value( 'pcp_carousel_nav_position', $view_options ); |
| 13 |
if ( 'vertically_center_outer' === $carousel_nav_position ) { |
| 14 |
$custom_css .= '.pcp-wrapper-{$pcp_id} .swiper-container{ position: static; }'; |
| 15 |
} |
| 16 |
|
| 17 |
// Pagination options. |
| 18 |
$_pagination_data = isset( $view_options['carousel_pagination_group'] ) ? $view_options['carousel_pagination_group'] : array(); |
| 19 |
$_pagination = isset( $_pagination_data['pcp_pagination'] ) ? $_pagination_data['pcp_pagination'] : true; |
| 20 |
$_pagination_on_mobile = isset( $_pagination_data['pagination_hide_on_mobile'] ) ? $_pagination_data['pagination_hide_on_mobile'] : false; |
| 21 |
$_pagination_color_set = $view_options['pcp_pagination_color_set']; |
| 22 |
$_pagination_colors = $_pagination_color_set['pcp_pagination_color']; |
| 23 |
$pagination_color = $_pagination_colors['color']; |
| 24 |
$pagination_color_active = $_pagination_colors['active-color']; |
| 25 |
if ( $_pagination_on_mobile ) { |
| 26 |
$custom_css .= "@media (max-width: 480px) { #pcp_wrapper-{$pcp_id} .pcp-pagination{ display: none; } }"; |
| 27 |
} $custom_css .= "#pcp_wrapper-{$pcp_id} .dots .swiper-pagination-bullet{ background: {$pagination_color}; } #pcp_wrapper-{$pcp_id} .dots .swiper-pagination-bullet-active { background: {$pagination_color_active}; }"; |
| 28 |
|
| 29 |
$carousel_nav_position = SP_PC_Functions::pcp_metabox_value( 'pcp_carousel_nav_position', $view_options ); |
| 30 |
if ( 'vertically_center_outer' === $carousel_nav_position ) { |
| 31 |
$custom_css .= '.pcp-wrapper-{$pcp_id} .swiper-container{ position: static; }'; |
| 32 |
} |
| 33 |
// Navigation options. |
| 34 |
$_nav_colors = SP_PC_Functions::pcp_metabox_value( 'pcp_nav_colors', $view_options ); |
| 35 |
$nav_color = SP_PC_Functions::pcp_metabox_value( 'color', $_nav_colors ); |
| 36 |
$nav_color_hover = SP_PC_Functions::pcp_metabox_value( 'hover-color', $_nav_colors ); |
| 37 |
$nav_color_bg = SP_PC_Functions::pcp_metabox_value( 'bg', $_nav_colors ); |
| 38 |
$nav_color_bg_hover = SP_PC_Functions::pcp_metabox_value( 'hover-bg', $_nav_colors ); |
| 39 |
$_nav_border = SP_PC_Functions::pcp_metabox_value( |
| 40 |
'pcp_nav_border', |
| 41 |
$view_options, |
| 42 |
array( |
| 43 |
'all' => '1', |
| 44 |
'style' => 'solid', |
| 45 |
'color' => '#aaa', |
| 46 |
'hover_color' => '#e1624b', |
| 47 |
'border_radius' => '0', |
| 48 |
'unit' => 'px', |
| 49 |
) |
| 50 |
); |
| 51 |
// Navigation options. |
| 52 |
$_navigation_data = isset( $view_options['pcp_navigation_data'] ) ? $view_options['pcp_navigation_data'] : array(); |
| 53 |
$_navigation = isset( $_navigation_data['pcp_navigation'] ) ? $_navigation_data['pcp_navigation'] : true; |
| 54 |
$_navigation_on_mobile = isset( $_navigation_data['nev_hide_on_mobile'] ) ? $_navigation_data['nev_hide_on_mobile'] : false; |
| 55 |
|
| 56 |
if ( $_navigation_on_mobile ) { |
| 57 |
$custom_css .= "@media (max-width: 480px) { #pcp_wrapper-{$pcp_id} .pcp-button-prev, #pcp_wrapper-{$pcp_id} .pcp-button-next{ display: none; } }"; |
| 58 |
} |
| 59 |
$custom_css .= "#pcp_wrapper-{$pcp_id} .pcp-button-prev, |
| 60 |
#pcp_wrapper-{$pcp_id} .pcp-button-next{ background-image: none; background-size: auto; background-color: {$nav_color_bg}; height: 33px; width: 33px; margin-top: 8px; border: {$_nav_border['all']}px {$_nav_border['style']} {$_nav_border['color']}; text-align: center; line-height: 30px; -webkit-transition: 0.3s; border-radius: {$_nav_border['border_radius']}{$_nav_border['unit']}; }"; |
| 61 |
$custom_css .= "#pcp_wrapper-{$pcp_id} .pcp-button-prev:hover, #pcp_wrapper-{$pcp_id} .pcp-button-next:hover{ background-color: {$nav_color_bg_hover}; border-color: {$_nav_border['hover_color']}; } #pcp_wrapper-{$pcp_id} .pcp-button-prev .fa, #pcp_wrapper-{$pcp_id} .pcp-button-next .fa { color: {$nav_color}; } #pcp_wrapper-{$pcp_id} .pcp-button-prev:hover .fa, #pcp_wrapper-{$pcp_id} .pcp-button-next:hover .fa { color: {$nav_color_hover}; } #pcp_wrapper-{$pcp_id}.pcp-carousel-wrapper .sp-pcp-post{ margin-top: 0; }"; |
| 62 |
|
