*/ namespace ThemeAtelier\Darkify\Admin\Views; use ThemeAtelier\Darkify\Admin\Framework\Classes\Darkify; class SwitcherStyle { /** * Create Option fields for the setting options. * * @param string $prefix Option setting key prefix. * @return void */ public static function options($prefix) { Darkify::createSection( $prefix, array( 'title' => esc_html__('SWITCHES', 'darkify'), 'icon' => 'icofont-toggle-on', 'fields' => array( array( 'type' => 'section_tab', 'tabs' => array( array( 'title' => esc_html__('Customization', 'darkify'), 'icon' => 'icofont-ui-theme', 'fields' => array( array( 'id' => 'enable_dark_switcher', 'type' => 'image_select', 'title' => esc_html__('Switch Toggler', 'darkify'), 'title_help' => '
' . __( 'Choose default floating switch toggler.', 'darkify' ) . '
' . __( 'Live Demo', 'darkify' ) . '' . __( 'Open Docs', 'darkify' ) . '', 'class' => 'icon_select ', 'options' => array( 'classic' => array( 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/classic.svg', 'text' => esc_html__('Classic', 'darkify'), 'option_demo_url' => '', ), 'expand' => array( 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/expand.svg', 'text' => esc_html__('Expand', 'darkify'), 'option_demo_url' => '', ), 'inner-moon' => array( 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/inner-moon.svg', 'text' => esc_html__('Inner Moon', 'darkify'), 'option_demo_url' => '', ), 'within' => array( 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/within.svg', 'text' => esc_html__('Within', 'darkify'), 'option_demo_url' => '', ), 'around' => array( 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/around.svg', 'text' => esc_html__('Around', 'darkify'), 'option_demo_url' => '', 'pro_only' => true, ), 'dark-side' => array( 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/dark-side.svg', 'text' => esc_html__('Dark Side', 'darkify'), 'option_demo_url' => '', 'pro_only' => true, ), 'horizon' => array( 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/horizon.svg', 'text' => esc_html__('Horizon', 'darkify'), 'option_demo_url' => '', 'pro_only' => true, ), 'eclipse' => array( 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/eclipse.svg', 'text' => esc_html__('Eclipse', 'darkify'), 'option_demo_url' => '', 'pro_only' => true, ), 'lightbulb' => array( 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/lightbulb.svg', 'text' => esc_html__('Lightbulb', 'darkify'), 'option_demo_url' => '', 'pro_only' => true, ), 'dark-inner' => array( 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/dark-inner.svg', 'text' => esc_html__('Dark Inner', 'darkify'), 'option_demo_url' => '', 'pro_only' => true, ), 'half-sun' => array( 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/half-sun.svg', 'text' => esc_html__('Half Sun', 'darkify'), 'option_demo_url' => '', 'pro_only' => true, ), 'simple' => array( 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/simple.svg', 'text' => esc_html__('Simple', 'darkify'), 'option_demo_url' => '', 'pro_only' => true, ), ), 'default' => 'classic', ), array( 'id' => 'switch_background', 'type' => 'color_group', 'title' => esc_html__('Switch Background', 'darkify'), 'title_help' => '
' . __('Customize the Floating Switch background as you need.', 'darkify') . '
', 'options' => array( 'switch_light_mode_bg' => esc_html__('Light Mode', 'darkify'), 'switch_dark_mode_bg' => esc_html__('Dark Mode', 'darkify'), ), 'default' => array( 'switch_light_mode_bg' => '#121116', 'switch_dark_mode_bg' => '#ffffff', ) ), array( 'id' => 'switch_width_height', 'type' => 'dimensions', 'title' => esc_html__('Switch Size', 'darkify'), 'title_help' => '
' . __('Customize the Floating Switch width & height as you need.', 'darkify') . '
', 'units' => ['px'], 'width_text' => __( 'Width', 'darkify' ), 'height_text' => __( 'Height', 'darkify' ), 'default' => array( 'width' => '60', 'height' => '60', ), 'attributes' => array( 'min' => 0, ), ), array( 'id' => 'switch_icon_color', 'type' => 'color_group', 'title' => esc_html__('Switch Icon Color', 'darkify'), 'title_help' => '
' . __('Customize the Floating Switch icon color as you need.', 'darkify') . '
', 'options' => array( 'switch_light_mode_color' => esc_html__('Light Mode', 'darkify'), 'switch_dark_mode_color' => esc_html__('Dark Mode', 'darkify'), ), 'default' => array( 'switch_light_mode_color' => '#ffffff', 'switch_dark_mode_color' => '#121116', ) ), array( 'id' => 'switch_icon_size', 'type' => 'dimensions', 'title' => esc_html__('Switch Icon Size', 'darkify'), 'title_help' => '
' . __('Customize the Selected Switch Icon Size.', 'darkify') . '
', 'height' => false, 'units' => ['px'], 'default' => array( 'width' => '40', ) ), array( 'id' => 'switch_border', 'type' => 'border', 'title' => __( 'Switch Border', 'darkify' ), 'title_help' => '
' . __('Customize the Floating Switch border & border radius as you need.', 'darkify') . '
', 'color' => true, 'style' => false, 'color2' => false, 'all' => true, 'radius' => true, 'default' => array( 'color' => '#121116', 'color3' => '#ffffff', 'all' => 0, 'radius' => 7, ), ), array( 'id' => 'tooltip_on_floating_switch', 'type' => 'fieldset', 'fields' => array( array( 'id' => 'floating_switch_width', 'type' => 'switcher', 'title' => esc_html__('Tooltip On Floating Switch', 'darkify'), 'title_help' => '
' . __('Want to show a hint on dark mode floating switch as tooltip?', 'darkify') . '
', 'text_on' => esc_html__('Enabled', 'darkify'), 'text_off' => esc_html__('Disabled', 'darkify'), 'text_width' => 100, 'default' => false, ), array( 'id' => 'tooltip_position', 'type' => 'button_set', 'title' => esc_html__('Tooltip Position', 'darkify'), 'title_help' => '
' . __('Choose the position where the tooltip should be displaed relative to the floating switch.', 'darkify') . '
', 'options' => array( 'left' => esc_html__('Left', 'darkify'), 'right' => esc_html__('Right', 'darkify'), 'top' => esc_html__('Top', 'darkify'), 'bottom' => esc_html__('Bottom', 'darkify'), ), 'default' => 'left', 'dependency' => array('floating_switch_width', '==', 'true'), ), array( 'id' => 'tooltip_text', 'type' => 'text', 'title' => esc_html__('Tooltip Text', 'darkify'), 'title_help' => '
' . __('Customize text to be displayed on the tooltip.', 'darkify') . '
', 'default' => esc_html__('Toggle Dark Mode', 'darkify'), 'dependency' => array('floating_switch_width', '==', 'true'), ), array( 'id' => 'tooltip_color', 'type' => 'color_group', 'title' => esc_html__('Tooltip Color', 'darkify'), 'title_help' => '
' . __('Customize tooltip design in your way.', 'darkify') . '
', 'options' => array( 'tooltip_background_color' => esc_html__('Background', 'darkify'), 'tooltip_text_color' => esc_html__('Color', 'darkify'), ), 'default' => array( 'tooltip_background_color' => '#142434', 'tooltip_text_color' => '#B0CBE7', ), 'dependency' => array('floating_switch_width', '==', 'true'), ), ), ), array( 'id' => 'alternative_dark_mode_switcher', 'type' => 'text', 'title' => esc_html__('Alternative Dark Mode Switch', 'darkify'), 'title_help' => '
' . __('Enter comma-separated CSS class or ID selectors to treat them as dark mode switch.', 'darkify') . '
', ), array( 'id' => 'switcher_shortcode', 'type' => 'switcher_shortcode', 'title' => esc_html__('Switcher Shortcode', 'darkify'), 'title_help' => esc_html__('Copy this shortcode and put any page or post to show switcher. You will able to customize all value including swtich 1-4 currently available in this version of plugin.', 'darkify'), ), ) ), array( 'title' => esc_html__('Positioning', 'darkify'), 'icon' => 'icofont-hand-drag', 'fields' => array( // Switch Position array( 'id' => 'switcher_button_position', 'type' => 'fieldset', 'fields' => array( array( 'id' => 'dark_mode_switch_position', 'type' => 'button_set', 'title' => esc_html__('Switch Position', 'darkify'), 'title_help' => '
' . __('Choose the screen position where the Floating Switch should be displayed.', 'darkify') . '
', 'options' => array( 'bottom_right' => esc_html__('Bottom Right', 'darkify'), 'bottom_left' => esc_html__('Bottom Left', 'darkify'), 'top_right' => esc_html__('Top Right', 'darkify'), 'top_left' => esc_html__('Top Left', 'darkify'), ), 'default' => 'bottom_right', ), array( 'id' => 'switch_position_top_right', 'type' => 'spacing', 'title' => esc_html__('Margin From Top Right', 'darkify'), 'title_help' => '
' . __('Customize default margin from the top right of the Floating Switch.', 'darkify') . '
', 'left' => false, 'bottom' => false, 'units' => ['px'], 'default' => array( 'top' => '40', 'right' => '40', ), 'dependency' => array('dark_mode_switch_position', '==', 'top_right'), ), array( 'id' => 'switch_position_top_left', 'type' => 'spacing', 'title' => esc_html__('Margin From Top Left', 'darkify'), 'title_help' => '
' . __('Customize default margin from the top left of the Floating Switch.', 'darkify') . '
', 'right' => false, 'bottom' => false, 'units' => ['px'], 'default' => array( 'top' => '40', 'left' => '40', ), 'dependency' => array('dark_mode_switch_position', '==', 'top_left'), ), array( 'id' => 'switch_position_bottom_right', 'type' => 'spacing', 'title' => esc_html__('Margin From Bottom Right', 'darkify'), 'title_help' => '
' . __('Customize default margin from the bottom right of the Floating Switch.', 'darkify') . '
', 'left' => false, 'top' => false, 'units' => ['px'], 'default' => array( 'bottom' => '40', 'right' => '40', ), 'dependency' => array('dark_mode_switch_position', '==', 'bottom_right'), ), array( 'id' => 'switch_position_bottom_left', 'type' => 'spacing', 'title' => esc_html__('Margin From Bottom Left', 'darkify'), 'title_help' => '
' . __('Customize default margin from the bottom left of the Floating Switch.', 'darkify') . '
', 'right' => false, 'top' => false, 'units' => ['px'], 'default' => array( 'bottom' => '40', 'left' => '40', ), 'dependency' => array('dark_mode_switch_position', '==', 'bottom_left'), ), ), ), // Different Switch Position in Mobile array( 'id' => 'different_switch_in_mobile', 'type' => 'fieldset', 'fields' => array( array( 'id' => 'switch_position_different_in_mobile', 'type' => 'switcher', 'title' => esc_html__('Different Switch Position in Mobile', 'darkify'), 'title_help' => '
' . __('CShould the Floating Switch be displayed on different position in mobile?', 'darkify') . '
', 'text_on' => esc_html__('Yes', 'darkify'), 'text_off' => esc_html__('No', 'darkify'), ), array( 'id' => 'switch_position_in_mobile', 'type' => 'button_set', 'title' => esc_html__('Switch Position in Mobile', 'darkify'), 'title_help' => '
' . __('Choose the screen position where the Floating Switch should be displayed in mobile.', 'darkify') . '
', 'options' => array( 'bottom_right' => esc_html__('Bottom Right', 'darkify'), 'bottom_left' => esc_html__('Bottom Left', 'darkify'), 'top_right' => esc_html__('Top Right', 'darkify'), 'top_left' => esc_html__('Top Left', 'darkify'), ), 'default' => 'bottom_right', 'dependency' => array('switch_position_different_in_mobile', '==', 'true'), ), array( 'id' => 'switch_position_top_right_in_mobile', 'type' => 'spacing', 'title' => esc_html__('Margin From Top Right in Mobile', 'darkify'), 'title_help' => '
' . __('Customize default margin from the top right of the Floating Switch.', 'darkify') . '
', 'left' => false, 'bottom' => false, 'units' => ['px'], 'default' => array( 'top' => '40', 'right' => '40', ), 'dependency' => array('switch_position_different_in_mobile|switch_position_in_mobile', '==|==', 'true|top_right'), ), array( 'id' => 'switch_position_top_left_in_mobile', 'type' => 'spacing', 'title' => esc_html__('Margin From Top Left in Mobile', 'darkify'), 'title_help' => '
' . __('Customize default margin from the top left of the Floating Switch.', 'darkify') . '
', 'right' => false, 'bottom' => false, 'units' => ['px'], 'default' => array( 'top' => '40', 'left' => '40', ), 'dependency' => array('switch_position_different_in_mobile|switch_position_in_mobile', '==|==', 'true|top_left'), ), array( 'id' => 'switch_position_bottom_right_in_mobile', 'type' => 'spacing', 'title' => esc_html__('Margin From Bottom Right in Mobile', 'darkify'), 'title_help' => '
' . __('Customize default margin from the bottom right of the Floating Switch.', 'darkify') . '
', 'left' => false, 'top' => false, 'units' => ['px'], 'default' => array( 'bottom' => '40', 'right' => '40', ), 'dependency' => array('switch_position_different_in_mobile|switch_position_in_mobile', '==|==', 'true|bottom_right'), ), array( 'id' => 'switch_position_bottom_left_in_mobile', 'type' => 'spacing', 'title' => esc_html__('Margin From Bottom Left in Mobile', 'darkify'), 'title_help' => '
' . __('Customize default margin from the bottom left of the Floating Switch.', 'darkify') . '
', 'right' => false, 'top' => false, 'units' => ['px'], 'default' => array( 'bottom' => '40', 'left' => '40', ), 'dependency' => array('switch_position_different_in_mobile|switch_position_in_mobile', '==|==', 'true|bottom_left'), ), ), ), array( 'id' => 'enable_absolute_position', 'type' => 'switcher', 'title' => esc_html__('Absolute Switch Position', 'darkify'), 'text_on' => esc_html__('Enabled', 'darkify'), 'text_off' => esc_html__('Disabled', 'darkify'), 'text_width' => '100', 'title_help' => '
' . __('Enable to make the floating switch scroll from its position with page scrolling.', 'darkify') . '
', ), array( 'id' => 'enable_switch_dragging', 'type' => 'switcher', 'title' => esc_html__('Draggable Position Change', 'darkify'), 'text_on' => esc_html__('Enabled', 'darkify'), 'text_off' => esc_html__('Disabled', 'darkify'), 'text_width' => '100', 'title_help' => '
' . __('Allow/Disallow users to change the floating switch position by dragging to where they want.', 'darkify') . '
', 'class' => 'switcher_pro_only', ), ) ), ) ), ) ) ); } }