Adds option to use light scheme on the media component gallery.

This commit is contained in:
mateuswetah 2021-09-06 11:59:15 -03:00
parent 2335fd1187
commit 92fdb57171
2 changed files with 109 additions and 6 deletions

View File

@ -44,22 +44,22 @@ body{
h6:not(.has-text-color) { h6:not(.has-text-color) {
color: #1d1d1d; color: #1d1d1d;
} }
h1:not(.has-huge-font-size):not(.has-large-font-size):not(.has-medium-font-size):not(.has-normal-font-size):not(.has-small-font-size):not(.metadata-label) { h1:not(.has-huge-font-size):not(.has-large-font-size):not(.has-medium-font-size):not(.has-normal-font-size):not(.has-small-font-size):not(.metadata-label):not(.label) {
font-size: 1.802rem; font-size: 1.802rem;
} }
h2:not(.has-huge-font-size):not(.has-large-font-size):not(.has-medium-font-size):not(.has-normal-font-size):not(.has-small-font-size):not(.metadata-label) { h2:not(.has-huge-font-size):not(.has-large-font-size):not(.has-medium-font-size):not(.has-normal-font-size):not(.has-small-font-size):not(.metadata-label):not(.label) {
font-size: 1.602rem; font-size: 1.602rem;
} }
h3:not(.has-huge-font-size):not(.has-large-font-size):not(.has-medium-font-size):not(.has-normal-font-size):not(.has-small-font-size):not(.metadata-label) { h3:not(.has-huge-font-size):not(.has-large-font-size):not(.has-medium-font-size):not(.has-normal-font-size):not(.has-small-font-size):not(.metadata-label):not(.label) {
font-size: 1.424rem; font-size: 1.424rem;
} }
h4:not(.has-huge-font-size):not(.has-large-font-size):not(.has-medium-font-size):not(.has-normal-font-size):not(.has-small-font-size):not(.metadata-label) { h4:not(.has-huge-font-size):not(.has-large-font-size):not(.has-medium-font-size):not(.has-normal-font-size):not(.has-small-font-size):not(.metadata-label):not(.label) {
font-size: 1.266rem; font-size: 1.266rem;
} }
h5:not(.has-huge-font-size):not(.has-large-font-size):not(.has-medium-font-size):not(.has-normal-font-size):not(.has-small-font-size):not(.metadata-label) { h5:not(.has-huge-font-size):not(.has-large-font-size):not(.has-medium-font-size):not(.has-normal-font-size):not(.has-small-font-size):not(.metadata-label):not(.label) {
font-size: 1.125rem; font-size: 1.125rem;
} }
h6:not(.has-huge-font-size):not(.has-large-font-size):not(.has-medium-font-size):not(.has-normal-font-size):not(.has-small-font-size):not(.metadata-label) { h6:not(.has-huge-font-size):not(.has-large-font-size):not(.has-medium-font-size):not(.has-normal-font-size):not(.has-small-font-size):not(.metadata-label):not(.label) {
font-size: 1rem; font-size: 1rem;
} }
pre:not(.wp-block-code) { pre:not(.wp-block-code) {

View File

@ -1051,6 +1051,24 @@ function tainacan_customize_register( $wp_customize ) {
'label' => __( 'Hide the attachments description (on the main slider)', 'tainacan-interface' ), 'label' => __( 'Hide the attachments description (on the main slider)', 'tainacan-interface' ),
'description' => __( 'Toggle to not display the document and attachments description.', 'tainacan-interface' ) 'description' => __( 'Toggle to not display the document and attachments description.', 'tainacan-interface' )
) ); ) );
/**
* Light color palette to the media component gallery
*/
$wp_customize->add_setting( 'tainacan_single_item_gallery_color_scheme', array(
'type' => 'theme_mod',
'capability' => 'edit_theme_options',
'default' => 'dark',
'transport' => 'refresh',
'sanitize_callback' => 'tainacan_sanitize_single_item_gallery_color_scheme_options',
) );
$wp_customize->add_control( 'tainacan_single_item_gallery_color_scheme', array(
'type' => 'select',
'priority' => 4, // Within the section.
'section' => 'tainacan_single_item_page_document',
'label' => __( 'Color scheme of the media gallery modal', 'tainacan-interface' ),
'choices' => tainacan_get_single_item_gallery_color_scheme_options()
) );
} }
@ -2237,6 +2255,52 @@ endif; // tainacan_sanitize_single_item_navigation_links_options
if ( ! function_exists( 'tainacan_get_single_item_gallery_color_scheme_options' ) ) :
/**
* Retrieves an array of options for single item page gallery color scheme options for Tainacan Theme.
*
* Create your own tainacan_get_single_item_gallery_color_scheme_options() function to override
* in a child theme.
*
* @since Tainacan Theme
*
* @return array $option - a string with options for the color scheme.
*/
function tainacan_get_single_item_gallery_color_scheme_options() {
$color_scheme = array(
'dark' => __('Dark', 'tainacan-interface'),
'light' => __('Light', 'tainacan-interface')
);
return $color_scheme;
}
endif; // tainacan_get_single_item_gallery_color_scheme_options
if ( ! function_exists( 'tainacan_sanitize_single_item_gallery_color_scheme_options' ) ) :
/**
* Handles sanitization for Tainacan Theme item page gallery color scheme options for Tainacan Theme
*
* Create your own tainacan_sanitize_single_item_gallery_color_scheme_options() function to override
* in a child theme.
*
* @since Tainacan Theme
*
* @param string $option - a string with options for the color scheme.
* @return string the selected option.
*/
function tainacan_sanitize_single_item_gallery_color_scheme_options( $option ) {
$color_scheme = tainacan_get_single_item_gallery_color_scheme_options();
if ( ! array_key_exists( $option, $color_scheme ) ) {
return 'dark';
}
return $option;
}
endif; // tainacan_sanitize_single_item_gallery_color_scheme_options
if ( ! function_exists( 'tainacan_get_header_alignment_options' ) ) : if ( ! function_exists( 'tainacan_get_header_alignment_options' ) ) :
/** /**
* Retrieves an array of options for header alignment options for Tainacan Theme. * Retrieves an array of options for header alignment options for Tainacan Theme.
@ -3071,3 +3135,42 @@ function tainacan_items_page_filters_fixed_on_scroll_output() {
} }
add_action( 'wp_head', 'tainacan_items_page_filters_fixed_on_scroll_output'); add_action( 'wp_head', 'tainacan_items_page_filters_fixed_on_scroll_output');
/**
* Enqueues front-end CSS for the light scheme of the photoswipe layer
*/
if ( !function_exists('tainacan_blocksy_gallery_light_color_scheme') ) {
function tainacan_blocksy_gallery_light_color_scheme() {
$has_light_dark_color_scheme = get_theme_mod( 'tainacan_single_item_gallery_color_scheme', 'dark' ) == 'light';
if (!$has_light_dark_color_scheme)
return;
$css = '
/* Photoswipe layer for the gallery dark */
.tainacan-photoswipe-layer .pswp__bg {
background-color: rgba(255, 255, 255, 0.85) !important;
}
.tainacan-photoswipe-layer .pswp__ui--fit .pswp__top-bar,
.tainacan-photoswipe-layer .pswp__ui--fit .pswp__caption {
background-color: rgba(255, 255, 255, 0.7) !important;
}
.tainacan-photoswipe-layer .pswp__top-bar .pswp__name,
.tainacan-photoswipe-layer .pswp__caption__center {
color: black !important;
}
.tainacan-photoswipe-layer .pswp__button,
.tainacan-photoswipe-layer .pswp__button--arrow--left::before,
.tainacan-photoswipe-layer .pswp__button--arrow--right::before {
filter: invert(100) !important;
}
.tainacan-photoswipe-layer .pswp--css_animation .pswp__preloader__donut {
border: 2px solid #000000 !important;
}
';
echo '<style type="text/css" id="tainacan-gallery-color-scheme">' . sprintf( $css ) . '</style>';
}
}
add_action( 'wp_head', 'tainacan_blocksy_gallery_light_color_scheme');