Events_Bar::get_css_template( string $css_template )

Grab the CSS rules template


Parameters

$css_template

(string) (Required) The Customizer CSS string/template.


Top ↑

Return

(string) The Customizer CSS string/template, with v2 Month View styles added.


Top ↑

Source

File: src/Tribe/Views/V2/Customizer/Section/Events_Bar.php

	public function get_css_template( $css_template ) {
		if ( ! tribe_events_views_v2_is_enabled() ) {
			return $css_template;
		}

		$new_styles   = [];

		// It's all custom props now, baby...
		if ( $this->should_include_setting_css( 'events_bar_text_color' ) ) {
			$text_color = $this->get_option( 'events_bar_text_color' );
			// Text color.

			if ( ! empty( $text_color ) ) {
				$new_styles[] = "--tec-color-text-events-bar-input: {$text_color};";
				$new_styles[] = "--tec-color-text-events-bar-input-placeholder: {$text_color};";
				$new_styles[] = "--tec-opacity-events-bar-input-placeholder: 0.6;";
				$new_styles[] = "--tec-color-text-view-selector-list-item: {$text_color};";
				$new_styles[] = "--tec-color-text-view-selector-list-item-hover: {$text_color};";
			}

			// Hover background follows text color
			$text_color_rgb = $this->get_rgb_color( 'events_bar_text_color' );
			if ( ! empty( $text_color_rgb ) ) {
				$new_styles[]   = "--tec-color-background-view-selector-list-item-hover: rgba({$text_color_rgb}, 0.12);";
			}
		}

		if ( $this->should_include_setting_css( 'find_events_button_text_color' ) ) {
			$button_text_color     = $this->get_option( 'find_events_button_text_color' );
			$button_text_color_rgb = $this->get_rgb_color( 'find_events_button_text_color' );
		}

		if ( ! empty( $button_text_color ) ) {
			$new_styles[] = "--tec-color-text-events-bar-submit-button: {$button_text_color};";
		}
		if ( ! empty( $button_text_color_rgb ) ) {
			$new_styles[] = "--tec-color-text-events-bar-submit-button-active: rgba({$button_text_color_rgb}, 0.5);";
			$new_styles[] = "--tec-color-text-events-bar-submit-button-hover: rgba({$button_text_color_rgb}, 0.6);";
		}

		if ( $this->should_include_setting_css( 'events_bar_icon_color_choice' ) ) {
			if ( 'custom' === $this->get_option( 'events_bar_icon_color_choice' ) ) {
				$icon_color = $this->get_option( 'events_bar_icon_color' );
			} elseif (
				'accent' === $this->get_option( 'events_bar_icon_color_choice' )
				&& $this->should_include_setting_css( 'accent_color', 'global_elements' )
			) {
				$icon_color = tribe( 'customizer' )->get_option( [ 'global_elements', 'accent_color' ] );
			}

			if ( ! empty( $icon_color ) ) {
				$new_styles[] = "--tec-color-icon-events-bar: {$icon_color};";
				$new_styles[] = "--tec-color-icon-events-bar-hover: {$icon_color};";
				$new_styles[] = "--tec-color-icon-events-bar-active: {$icon_color};";
			}
		}

		if ( $this->should_include_setting_css( 'find_events_button_color_choice' ) ) {
			$button_color     = $this->get_option( 'find_events_button_color' );
			$button_color_rgb = $this->get_rgb_color( 'find_events_button_color' );
		} elseif ( $this->should_include_setting_css( 'accent_color', 'global_elements' ) ) {
			$button_color     = tribe( 'customizer' )->get_option( [ 'global_elements', 'accent_color' ] );
			$button_color_rgb = $this->get_rgb_color( 'accent_color', 'global_elements' );
		}

		if ( ! empty( $button_color ) ) {
			$new_styles[] = "--tec-color-background-events-bar-submit-button: {$button_color};";
		}

		if ( ! empty( $button_color_rgb ) ) {
			$new_styles[] = "--tec-color-background-events-bar-submit-button-hover: rgba({$button_color_rgb}, 0.8);";
			$new_styles[] = "--tec-color-background-events-bar-submit-button-active: rgba({$button_color_rgb}, 0.9);";

		}

		if ( $this->should_include_setting_css( 'events_bar_background_color_choice' ) ) {
			if ( $this->should_include_setting_css( 'events_bar_background_color' ) ) {
				if ( 'custom' == $this->get_option( 'events_bar_background_color_choice' ) ) {
					$background_color = $this->get_option( 'events_bar_background_color' );
				} elseif (
					'global_background' == $this->get_option( 'events_bar_background_color_choice' )
					&& $this->should_include_setting_css( 'background_color', 'global_elements' )
				) {
					$background_color = tribe('customizer')->get_option( [ 'global_elements', 'background_color' ] );
				}
			}

			if ( ! empty( $background_color ) ) {
				$new_styles[] = "--tec-color-background-events-bar: {$background_color};";
				$new_styles[] = "--tec-color-background-events-bar-tabs: {$background_color};";
			}
		}

		if ( $this->should_include_setting_css( 'events_bar_border_color_choice' ) ) {
			$border_color = $this->get_option( 'events_bar_border_color' );

			if ( ! empty( $border_color ) ) {
				$new_styles[] = "--tec-color-border-events-bar: {$border_color};";
			}
		}

		if ( empty( $new_styles ) ) {
			return $css_template;
		}

		$new_css = sprintf(
			':root {
				/* Customizer-added Events Bar styles */
				%1$s
			}',
			implode( "\n", $new_styles )
		);

		return $css_template . $new_css;
	}