diff --git a/skins/skin-made-in-heaven/assets/css/admin.css b/skins/skin-made-in-heaven/assets/css/admin.css index 4e9438cbd..2c7b19359 100644 --- a/skins/skin-made-in-heaven/assets/css/admin.css +++ b/skins/skin-made-in-heaven/assets/css/admin.css @@ -11,6 +11,7 @@ content: '\f487'; font-family: 'dashicons'; font-weight: normal; + vertical-align: middle; } .wp-customizer #_customize-input-entry_card_type, @@ -24,97 +25,69 @@ ** ラジオボタン *******************************************************************************/ -#customize-control-hvn_header_fade_setting, -#customize-control-hvn_header_animation_setting, -#customize-control-hvn_numeric_list_set2_setting, -#customize-control-hvn_icon_box_set1_setting, -#customize-control-hvn_tab_box_set1_setting, -#customize-control-hvn_faq_set1_setting { +[id*="section-hvn"] .wp-color-result-text, +[id*="section-hvn"] .color-picker-hex, +[id*="section-hvn"] select, +[id*="section-hvn"] input, +[id*="section-hvn"] button { + border-radius: 0!important; +} + +[id*="section-hvn"] .customize-control-radio { display: flex; flex-wrap: wrap; } -#customize-control-hvn_header_fade_setting .description, -#customize-control-hvn_header_animation_setting .description, -#customize-control-hvn_numeric_list_set2_setting .description, -#customize-control-hvn_icon_box_set1_setting .description, -#customize-control-hvn_tab_box_set1_setting .description, -#customize-control-hvn_faq_set1_setting .description { +[id*="section-hvn"] .customize-control-radio .description { width: 100%; } -#customize-control-hvn_header_fade_setting .customize-inside-control-row, -#customize-control-hvn_header_animation_setting .customize-inside-control-row, -#customize-control-hvn_numeric_list_set2_setting .customize-inside-control-row, -#customize-control-hvn_icon_box_set1_setting .customize-inside-control-row, -#customize-control-hvn_tab_box_set1_setting .customize-inside-control-row, -#customize-control-hvn_faq_set1_setting .customize-inside-control-row { +[id*="section-hvn"] .customize-control-radio .customize-inside-control-row { margin: 0; } -#customize-control-hvn_header_fade_setting input, -#customize-control-hvn_header_animation_setting input, -#customize-control-hvn_numeric_list_set2_setting input, -#customize-control-hvn_icon_box_set1_setting input, -#customize-control-hvn_tab_box_set1_setting input, -#customize-control-hvn_faq_set1_setting input { +[id*="section-hvn"] .customize-control-radio input { display: none; } -#customize-control-hvn_header_fade_setting label, -#customize-control-hvn_header_animation_setting label, -#customize-control-hvn_numeric_list_set2_setting label, -#customize-control-hvn_icon_box_set1_setting label, -#customize-control-hvn_tab_box_set1_setting label, -#customize-control-hvn_faq_set1_setting label { +[id*="section-hvn"] .customize-control-radio label { box-shadow: inset 1px 1px 0 0 #007cba, 1px 1px 0 0 #007cba, 1px 0 0 0 #007cba, 0 1px 0 0 #007cba; color: #007cba; padding: 5px 10px; } -#customize-control-hvn_header_fade_setting input:checked ~ label, -#customize-control-hvn_header_animation_setting input:checked ~ label, -#customize-control-hvn_numeric_list_set2_setting input:checked ~ label, -#customize-control-hvn_icon_box_set1_setting input:checked ~ label, -#customize-control-hvn_tab_box_set1_setting input:checked ~ label, -#customize-control-hvn_faq_set1_setting input:checked ~ label { +[id*="section-hvn"] .customize-control-radio input:checked ~ label { background-color: #007cba; color: #fff; } /******************************************************************************* -** エラー表示 +** アコーディオン表示項目 *******************************************************************************/ -/* スライドインメニュータイトル */ - -#_customize-input-hvn_mobile_text_setting:invalid, - -/* 「もっと見る」テキスト */ - -#_customize-input-hvn_button_more_setting:invalid, - -/* 「次のページ」テキスト */ - -#_customize-input-hvn_button_next_setting:invalid, - -/* パンくずリストテキスト */ +/* コメント */ -#_customize-input-hvn_breadcrumbs_setting:invalid, +body:not(:has(#_customize-input-hvn_comment_setting:checked)) [id*="customize-control-hvn_comment_img"] { + display: none; +} -/* NEWマーク表示日数 */ +/* タイトル */ +body:not(:has(#_customize-input-hvn_tcheck_option_setting:checked)) [id*="customize-control-hvn_title"] { + display: none; +} -#_customize-input-hvn_index_new_setting:invalid, +/******************************************************************************* +** エラー表示 +*******************************************************************************/ -/* テキストサイズ */ -#_customize-input-hvn_appea_font_size_setting:invalid, +/* カラーピッカー */ -/* 不透明度 */ +.wp-color-picker.iris-error, -#_customize-input-hvn_header_opacity_setting:invalid { +[id*="_customize-input-hvn_"]:invalid { animation: shake-x 1s; background-color: rgba(255 0 0 / 0.2); border-color: red; diff --git a/skins/skin-made-in-heaven/assets/css/h2/h2-13.css b/skins/skin-made-in-heaven/assets/css/h2/h2-13.css index 1781f4823..33214899a 100644 --- a/skins/skin-made-in-heaven/assets/css/h2/h2-13.css +++ b/skins/skin-made-in-heaven/assets/css/h2/h2-13.css @@ -22,7 +22,7 @@ } .hvn-dark .article h2 { - border-color: #696969; + --hover-color: var(--main-color); } .article h2::before { diff --git a/skins/skin-made-in-heaven/assets/css/h2/h2-14.css b/skins/skin-made-in-heaven/assets/css/h2/h2-14.css index b658ca490..622b05473 100644 --- a/skins/skin-made-in-heaven/assets/css/h2/h2-14.css +++ b/skins/skin-made-in-heaven/assets/css/h2/h2-14.css @@ -16,5 +16,7 @@ .hvn-dark .article h2, .hvn-dark .main .article .widget-title, .hvn-dark .main .under-entry-content h2 { + border-color: var(--main-color); + box-shadow: 6px 6px var(--main-color); color : var(--cocoon-text-color); } \ No newline at end of file diff --git a/skins/skin-made-in-heaven/functions.php b/skins/skin-made-in-heaven/functions.php index 4aa060f0a..42071e52b 100644 --- a/skins/skin-made-in-heaven/functions.php +++ b/skins/skin-made-in-heaven/functions.php @@ -6,6 +6,7 @@ global $_MOBILE_COPY_BUTTON; global $_HVN_EYECATCH; global $_HVN_NOTICE; +global $_HVN_OPTION; $skin_url = get_skin_url(); // ふわっと追加 diff --git a/skins/skin-made-in-heaven/lib/function.php b/skins/skin-made-in-heaven/lib/function.php index d259d8c93..19701eb01 100644 --- a/skins/skin-made-in-heaven/lib/function.php +++ b/skins/skin-made-in-heaven/lib/function.php @@ -42,7 +42,15 @@ function hvn_sanitize_number_range($number, $setting) { // テキスト if (!function_exists('hvn_sanitize_text')): function hvn_sanitize_text($text, $setting) { - return ($text ? $text : $setting->default); + return ($text ? strip_tags($text) : $setting->default); +} +endif; + + +// パレット +if (!function_exists('hvn_sanitize_color')): +function hvn_sanitize_color($color, $setting) { + return (sanitize_hex_color($color) ? $color : $setting->default); } endif; @@ -270,6 +278,7 @@ function hvn_add_header() { // タイトルテキスト $msg = get_theme_mod('hvn_header_message_setting'); if ($msg) { + $msg = do_shortcode($msg); $msg = "
{$msg}
"; } diff --git a/skins/skin-made-in-heaven/lib/hook-wp.php b/skins/skin-made-in-heaven/lib/hook-wp.php index 49f10c294..c8fb14833 100644 --- a/skins/skin-made-in-heaven/lib/hook-wp.php +++ b/skins/skin-made-in-heaven/lib/hook-wp.php @@ -6,10 +6,12 @@ // カスタマイザー追加 //****************************************************************************** add_action('customize_register', function($wp_customize) { + global $_HVN_OPTION; + $wp_customize->add_panel( 'hvn_cocoon', array( - 'title' => 'Cocoon拡張設定', + 'title' => 'メイド・イン・ヘブン設定', 'priority' => 300, ) ); @@ -19,6 +21,9 @@ hvn_main($wp_customize); hvn_header($wp_customize); hvn_editor($wp_customize); + if ($_HVN_OPTION) { + hvn_option($wp_customize); + } }); diff --git a/skins/skin-made-in-heaven/lib/panel-color.php b/skins/skin-made-in-heaven/lib/panel-color.php index 8fd7987ea..d7b54f255 100644 --- a/skins/skin-made-in-heaven/lib/panel-color.php +++ b/skins/skin-made-in-heaven/lib/panel-color.php @@ -35,7 +35,10 @@ function hvn_color($wp_customize) { ); - $wp_customize->add_setting('hvn_main_color_setting', array('default' => HVN_MAIN_COLOR)); + $wp_customize->add_setting('hvn_main_color_setting', array( + 'default' => HVN_MAIN_COLOR, + 'sanitize_callback' => 'hvn_sanitize_color', + )); $wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, @@ -49,7 +52,10 @@ function hvn_color($wp_customize) { ); - $wp_customize->add_setting('hvn_body_color_setting', array('default' => HVN_BODY_COLOR)); + $wp_customize->add_setting('hvn_body_color_setting', array( + 'default' => HVN_BODY_COLOR, + 'sanitize_callback' => 'hvn_sanitize_color', + )); $wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, @@ -63,7 +69,10 @@ function hvn_color($wp_customize) { ); - $wp_customize->add_setting('hvn_text_color_setting', array('default' => HVN_TEXT_COLOR)); + $wp_customize->add_setting('hvn_text_color_setting', array( + 'default' => HVN_TEXT_COLOR, + 'sanitize_callback' => 'hvn_sanitize_color', + )); $wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, diff --git a/skins/skin-made-in-heaven/lib/panel-option.php b/skins/skin-made-in-heaven/lib/panel-option.php new file mode 100644 index 000000000..25ff82066 --- /dev/null +++ b/skins/skin-made-in-heaven/lib/panel-option.php @@ -0,0 +1,304 @@ +add_section( + 'hvn_option_section', + array( + 'title' => 'オプション', + 'panel' => 'hvn_cocoon', + 'priority' => 5, + ) + ); + + + // コントロール + $wp_customize->add_setting('hvn_label1_option_section'); + $wp_customize->add_control( + new WP_Customize_Control( + $wp_customize, + 'hvn_label1_option_section', + array( + 'label' => '■ 全体', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_label1_option_section', + 'type' => 'hidden', + ) + ) + ); + + + $wp_customize->add_setting('hvn_margin_option_setting', array('default' => false)); + $wp_customize->add_control( + new WP_Customize_Control( + $wp_customize, + 'hvn_margin_option_setting', + array( + 'label' => '余白を変更', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_margin_option_setting', + 'type' => 'checkbox', + ) + ) + ); + + $wp_customize->add_setting('hvn_label2_option_section'); + $wp_customize->add_control( + new WP_Customize_Control( + $wp_customize, + 'hvn_label2_option_section', + array( + 'label' => '■ メインビジュアル', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_label2_option_section', + 'type' => 'hidden', + ) + ) + ); + + + $wp_customize->add_setting('hvn_scroll_color_option_setting', array( + 'default' => '#ffffff', + 'sanitize_callback' => 'hvn_sanitize_color', + )); + $wp_customize->add_control( + new WP_Customize_Color_Control( + $wp_customize, + 'hvn_scroll_color_option_setting', + array( + 'description' => 'テキストカラー', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_scroll_color_option_setting', + ) + ) + ); + + + $wp_customize->add_setting('hvn_wave_color_category_setting', array( + 'default' => get_theme_mod('hvn_main_color_setting', HVN_MAIN_COLOR), + 'sanitize_callback' => 'hvn_sanitize_color', + )); + $wp_customize->add_control( + new WP_Customize_Color_Control( + $wp_customize, + 'hvn_wave_color_category_setting', + array( + 'description' => 'カテゴリー波線カラー', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_wave_color_category_setting', + ) + ) + ); + + + $wp_customize->add_setting('hvn_main_wave_option_setting', array('default' => false)); + $wp_customize->add_control( + new WP_Customize_Control( + $wp_customize, + 'hvn_main_wave_option_setting', + array( + 'label' => 'メインビジュアル波線非表示', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_main_wave_option_setting', + 'type' => 'checkbox', + ) + ) + ); + + + $wp_customize->add_setting('hvn_category_wave_option_setting', array('default' => false)); + $wp_customize->add_control( + new WP_Customize_Control( + $wp_customize, + 'hvn_category_wave_option_setting', + array( + 'label' => 'カテゴリーごと波線非表示', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_category_wave_option_setting', + 'type' => 'checkbox', + ) + ) + ); + + + $wp_customize->add_setting('hvn_label3_option_section'); + $wp_customize->add_control( + new WP_Customize_Control( + $wp_customize, + 'hvn_label3_option_section', + array( + 'label' => '■ フロントページ', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_label3_option_section', + 'type' => 'hidden', + ) + ) + ); + + + $wp_customize->add_setting('hvn_header_option_setting', array('default' => false)); + $wp_customize->add_control( + new WP_Customize_Control( + $wp_customize, + 'hvn_header_option_setting', + array( + 'label' => 'ヘッダーロゴ非表示', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_header_option_setting', + 'type' => 'checkbox', + ) + ) + ); + + + $wp_customize->add_setting('hvn_title_new_option_setting', array( + 'default' => 'NewPost', + 'sanitize_callback' => 'hvn_sanitize_text', + )); + $wp_customize->add_control( + new WP_Customize_Control( + $wp_customize, + 'hvn_title_new_option_setting', + array( + 'label' => '新着記事', + 'description' => 'タイトル', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_title_new_option_setting', + 'type' => 'text', + 'input_attrs' => array( + 'required' => '', + ) + ) + ) + ); + + + $wp_customize->add_setting('hvn_title_new_sub_option_setting', array( + 'default' => '新着・更新された記事です', + 'sanitize_callback' => 'hvn_sanitize_text', + )); + $wp_customize->add_control( + new WP_Customize_Control( + $wp_customize, + 'hvn_title_new_sub_option_setting', + array( + 'description' => '説明文', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_title_new_sub_option_setting', + 'type' => 'text', + 'input_attrs' => array( + 'required' => '', + ) + ) + ) + ); + + + $wp_customize->add_setting('hvn_title_popular_option_setting', array( + 'default' => 'Popular', + 'sanitize_callback' => 'hvn_sanitize_text', + )); + $wp_customize->add_control( + new WP_Customize_Control( + $wp_customize, + 'hvn_title_popular_option_setting', + array( + 'label' => '人気記事', + 'description' => 'タイトル', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_title_popular_option_setting', + 'type' => 'text', + 'input_attrs' => array( + 'required' => '', + ) + ) + ) + ); + + + $wp_customize->add_setting('hvn_title_popular_sub_option_setting', array( + 'default' => '本日読まれている記事です', + 'sanitize_callback' => 'hvn_sanitize_text', + )); + $wp_customize->add_control( + new WP_Customize_Control( + $wp_customize, + 'hvn_title_popular_sub_option_setting', + array( + 'description' => '説明文', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_title_popular_sub_option_setting', + 'type' => 'text', + 'input_attrs' => array( + 'required' => '', + ) + ) + ) + ); + + + $wp_customize->add_setting('hvn_title_category_option_setting', array( + 'default' => 'Category', + 'sanitize_callback' => 'hvn_sanitize_text', + )); + $wp_customize->add_control( + new WP_Customize_Control( + $wp_customize, + 'hvn_title_category_option_setting', + array( + 'label' => 'カテゴリーごと', + 'description' => 'タイトル', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_title_category_option_setting', + 'type' => 'text', + 'input_attrs' => array( + 'required' => '', + ) + ) + ) + ); + + + $wp_customize->add_setting('hvn_title_category_sub_option_setting', array( + 'default' => 'カテゴリーから記事を探す', + 'sanitize_callback' => 'hvn_sanitize_text', + )); + $wp_customize->add_control( + new WP_Customize_Control( + $wp_customize, + 'hvn_title_category_sub_option_setting', + array( + 'description' => '説明文', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_title_category_sub_option_setting', + 'type' => 'text', + 'input_attrs' => array( + 'required' => '', + ) + ) + ) + ); + + + $wp_customize->add_setting('hvn_tcheck_option_setting', array('default' => false)); + $wp_customize->add_control( + new WP_Customize_Control( + $wp_customize, + 'hvn_tcheck_option_setting', + array( + 'label' => 'タイトル変更', + 'section' => 'hvn_option_section', + 'settings' => 'hvn_tcheck_option_setting', + 'type' => 'checkbox', + ) + ) + ); +} +endif; diff --git a/skins/skin-made-in-heaven/lib/panel-visual.php b/skins/skin-made-in-heaven/lib/panel-visual.php index e00214698..df14437e5 100644 --- a/skins/skin-made-in-heaven/lib/panel-visual.php +++ b/skins/skin-made-in-heaven/lib/panel-visual.php @@ -99,7 +99,10 @@ function hvn_header($wp_customize) { ); - $wp_customize->add_setting('hvn_header_message_setting'); + $wp_customize->add_setting('hvn_header_message_setting', array( + 'default' => '', + 'sanitize_callback' => 'hvn_sanitize_text', + )); $wp_customize->add_control( new WP_Customize_Control( $wp_customize, diff --git a/skins/skin-made-in-heaven/style.css b/skins/skin-made-in-heaven/style.css index e120b75a4..c51cc5002 100644 --- a/skins/skin-made-in-heaven/style.css +++ b/skins/skin-made-in-heaven/style.css @@ -7,7 +7,7 @@ Author: chu-ya Author URI: https://ss1.xrea.com/chuya.s239.xrea.com/temp/ Screenshot URI: https://im-cocoon.net/wp-content/uploads/skin-made-in-heaven.png - Version: 2.0.1 + Version: 2.1.0 Priority: 6900001000 */ @@ -77,6 +77,10 @@ ** コメントアイコンを追加 ** ブログカードのスタイル追加 ** 2.0.1 2023-04-24 スキン制御「画像の拡大効果」を廃止 +** 2.1.0 2023-04-27 カスタマイザーのCSS変更 +** ダークカラー見出しのCSS変更 +** カスタマイザーのサニタイズを追加 +** カスタマイザーオプションを追加 ** *******************************************************************************/ diff --git a/skins/skin-made-in-heaven/tmp/css-custom.php b/skins/skin-made-in-heaven/tmp/css-custom.php index 3c1e39a9f..5a2ec5545 100644 --- a/skins/skin-made-in-heaven/tmp/css-custom.php +++ b/skins/skin-made-in-heaven/tmp/css-custom.php @@ -301,9 +301,9 @@ } if (is_dark_hexcolor($color)) { - $color = '#fff'; + $color = '#ffffff'; } else { - $color = '#333'; + $color = '#333333'; } echo <<< EOF @@ -1090,6 +1090,169 @@ } + +//****************************************************************************** +// +// オプション +// +//****************************************************************************** + +if ($_HVN_OPTION) { + +//****************************************************************************** +// 余白を変更 +//****************************************************************************** + if (get_theme_mod('hvn_margin_option_setting')) { + echo <<< EOF +.body.error404 .main, +.body.page .main, +.body.single .main, +.archive .entry-content, +.menu-content .menu-drawer, +.body :where(.content, .sidebar, .footer) .widget { + --main-padding: 5px; +} + +EOF; + } + + +//****************************************************************************** +// カテゴリー波線カラー +//****************************************************************************** + $color = get_theme_mod('hvn_main_color_setting', HVN_MAIN_COLOR); + $color = get_theme_mod('hvn_wave_color_category_setting', $color); + $rgb = hvn_color_mix_rgb($color, 0.25); + + echo <<< EOF +:root { + --category-color: {$rgb['red']}, {$rgb['green']}, {$rgb['blue']}; +} + +EOF; + + +//****************************************************************************** +// メインビジュアル波線非表示 +//****************************************************************************** + if (get_theme_mod('hvn_main_wave_option_setting')) { + echo <<< EOF +.hvn .hvn-wave-main { + display: none; +} + +EOF; + } + + +//****************************************************************************** +// カテゴリーごと波線非表示 +//****************************************************************************** + if (get_theme_mod('hvn_category_wave_option_setting')) { + echo <<< EOF +.hvn .hvn-wave-category { + display: none; +} + +EOF; + } + + +//****************************************************************************** +// ヘッダーロゴ非表示 +//****************************************************************************** + if (get_theme_mod('hvn_header_option_setting')) { + echo <<< EOF +.front-top-page .header { + display: none; +} + +EOF; + } + + +//****************************************************************************** +// タイトル・説明文表示 +//****************************************************************************** + if (get_theme_mod('hvn_tcheck_option_setting')) { + $n_title= get_theme_mod('hvn_title_new_option_setting' ,'NewPost'); + $n_sub = get_theme_mod('hvn_title_new_sub_option_setting' ,'新着・更新された記事です'); + + $p_title= get_theme_mod('hvn_title_popular_option_setting' ,'Popular'); + $p_sub = get_theme_mod('hvn_title_popular_sub_option_setting' ,'本日読まれている記事です'); + + $c_title= get_theme_mod('hvn_title_category_option_setting' ,'カテゴリーごと'); + $c_sub = get_theme_mod('hvn_title_category_sub_option_setting' ,'カテゴリーから記事を探す'); + + echo <<< EOF +:root { + --main-font-size: 40px; + --sub-font-size: 14px; +} + +.hvn .list-new-entries-title, +.hvn .list-popular-title { + display: none; +} + +.hvn .list-new-entries:before, +.hvn .list-columns:before { + color: var(--title-color); + font-size: var(--main-font-size); + font-weight: bold; + position: absolute; + text-align: center; + top: 0; + width: 100%; + z-index: 1; +} + +.hvn .list-new-entries:before { + content: "{$n_title}"; +} + +.hvn .list-columns.list-popular:before { + content: "{$p_title}"; +} + +.hvn .list-columns:before { + content: "{$c_title}"; +} + +.hvn .list-new-entries:after, +.hvn .list-columns:after { + color: var(--title-color); + font-size: var(--sub-font-size); + display: block; + position: absolute; + text-align: center; + width: 100%; + top: calc(var(--main-font-size) * 1.8); +} + +.hvn .list-new-entries:after { + content: "{$n_sub}"; +} + +.hvn .list-columns.list-popular:after { + content: "{$p_sub}"; +} + +.hvn .list-columns:after { + content: "{$c_sub}"; +} + +.hvn .list-new-entries, +.hvn .list-columns { + padding-top: calc((var(--main-font-size) + var(--sub-font-size)) * 1.8 + var(--gap30))!important; +} + +EOF; + } + +} + + //****************************************************************************** // // メインビジュアル @@ -1153,6 +1316,8 @@ //****************************************************************************** if (get_theme_mod('hvn_header_setting', 'none') == 'none') return; +$color = get_theme_mod('hvn_scroll_color_option_setting', '#ffffff'); + echo <<< EOF :root { --height: calc(100svh - var(--ah)); @@ -1188,7 +1353,7 @@ } .hvn-header .message { - color: #fff; + color: {$color}; font-weight: bold; display: grid; inset: 0; @@ -1200,7 +1365,7 @@ } .scrolldown { - color: #fff; + color: {$color}; height: fit-content; inset: 0; letter-spacing: 0.05em; @@ -1225,9 +1390,9 @@ echo <<< EOF .scrolldown:after { animation: pathmove 1.4s ease-in-out infinite; - background-color: #fff; + background-color: {$color}; content: ''; - display:block; + display: block; height: 50px; left: 50%; opacity: 0; @@ -1287,7 +1452,7 @@ if (get_theme_mod('hvn_header_vertival_setting')) { echo <<< EOF .message div { - border: 1px solid #fff; + border: 1px solid {$color}; padding: 1em 0; text-align: center; text-orientation: upright;