PluginProbe
Darkify – Dark Mode & Night Mode for Website & Admin (Dark Theme Included) / 1.4.0
Darkify – Dark Mode & Night Mode for Website & Admin (Dark Theme Included) v1.4.0
2.1.3 2.1.2 2.1.1 2.1.0 2.0.4 2.0.3 2.0.2 2.0.1 2.0.0 1.5.5 1.5.4 1.5.3 1.5.2 1.5.1 1.5.0 trunk 1.0.1 1.1.0 1.2.0 1.2.1 1.2.2 1.2.3 1.2.4 1.2.5 1.3.0 All 57 releases
darkify / src / Admin / Views / SwitcherStyle.php

SwitcherStyle.php in Darkify – Dark Mode & Night Mode for Website & Admin (Dark Theme Included) 1.4.0, at src/Admin/Views/SwitcherStyle.php

471 lines 34.0 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2
3 /**
4 * Views class for Shortcode generator options.
5 *
6 * @link https://themeatelier.net
7 * @since 1.0.0
8 *
9 * @package darkify
10 * @subpackage darkify/src/Admin/Views/SwitcherStyle
11 * @author ThemeAtelier<themeatelierbd@gmail.com>
12 */
13
14 namespace ThemeAtelier\Darkify\Admin\Views;
15
16 use ThemeAtelier\Darkify\Admin\Framework\Classes\Darkify;
17
18 class SwitcherStyle
19 {
20 /**
21 * Create Option fields for the setting options.
22 *
23 * @param string $prefix Option setting key prefix.
24 * @return void
25 */
26 public static function options($prefix)
27 {
28 Darkify::createSection(
29 $prefix,
30 array(
31 'title' => esc_html__('SWITCHER', 'darkify'),
32 'icon' => 'icofont-toggle-on',
33 'fields' => array(
34
35 array(
36 'type' => 'section_tab',
37 'tabs' => array(
38 array(
39 'title' => esc_html__('Customization', 'darkify'),
40 'icon' => 'icofont-ui-theme',
41 'fields' => array(
42 array(
43 'id' => 'enable_dark_switcher',
44 'type' => 'image_select',
45 'title' => esc_html__('Switch Toggler', 'darkify'),
46 'title_help' => '<div class="darkify-info-label">' . __( 'Choose default floating switch toggler.', 'darkify' ) . '</div><a class="tooltip_btn_primary" href="https://darkifywp.com/switcher/#switchers" target="_blank">' . __( 'Live Demo', 'darkify' ) . '</a><a class="tooltip_btn_secondary" href="https://docs.themeatelier.net/docs/darkify-pro/darkify-settings/switcher/" target="_blank">' . __( 'Open Docs', 'darkify' ) . '</a>',
47 'class' => 'icon_select ',
48 'options' => array(
49 'classic' => array(
50 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/classic.svg',
51 'text' => esc_html__('Classic', 'darkify'),
52 'option_demo_url' => '',
53 ),
54
55 'expand' => array(
56 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/expand.svg',
57 'text' => esc_html__('Expand', 'darkify'),
58 'option_demo_url' => '',
59 ),
60
61 'inner-moon' => array(
62 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/inner-moon.svg',
63 'text' => esc_html__('Inner Moon', 'darkify'),
64 'option_demo_url' => '',
65 ),
66
67 'within' => array(
68 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/within.svg',
69 'text' => esc_html__('Within', 'darkify'),
70 'option_demo_url' => '',
71 ),
72
73 'around' => array(
74 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/around.svg',
75 'text' => esc_html__('Around', 'darkify'),
76 'option_demo_url' => '',
77 'pro_only' => true,
78 ),
79
80 'dark-side' => array(
81 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/dark-side.svg',
82 'text' => esc_html__('Dark Side', 'darkify'),
83 'option_demo_url' => '',
84 'pro_only' => true,
85 ),
86
87 'horizon' => array(
88 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/horizon.svg',
89 'text' => esc_html__('Horizon', 'darkify'),
90 'option_demo_url' => '',
91 'pro_only' => true,
92 ),
93
94 'eclipse' => array(
95 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/eclipse.svg',
96 'text' => esc_html__('Eclipse', 'darkify'),
97 'option_demo_url' => '',
98 'pro_only' => true,
99 ),
100
101 'lightbulb' => array(
102 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/lightbulb.svg',
103 'text' => esc_html__('Lightbulb', 'darkify'),
104 'option_demo_url' => '',
105 'pro_only' => true,
106 ),
107
108 'dark-inner' => array(
109 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/dark-inner.svg',
110 'text' => esc_html__('Dark Inner', 'darkify'),
111 'option_demo_url' => '',
112 'pro_only' => true,
113 ),
114
115 'half-sun' => array(
116 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/half-sun.svg',
117 'text' => esc_html__('Half Sun', 'darkify'),
118 'option_demo_url' => '',
119 'pro_only' => true,
120 ),
121
122 'simple' => array(
123 'image' => DARKIFY_DIR_URL . 'src/Admin/Framework/assets/images/simple.svg',
124 'text' => esc_html__('Simple', 'darkify'),
125 'option_demo_url' => '',
126 'pro_only' => true,
127 ),
128
129 ),
130 'default' => 'classic',
131 ),
132 array(
133 'id' => 'switch_background',
134 'type' => 'color_group',
135 'title' => esc_html__('Switch Background', 'darkify'),
136 'title_help' => '<div class="darkify-info-label">' . __('Customize the Floating Switch background as you need.', 'darkify') . '</div>',
137 'options' => array(
138 'switch_light_mode_bg' => esc_html__('Light Mode', 'darkify'),
139 'switch_dark_mode_bg' => esc_html__('Dark Mode', 'darkify'),
140 ),
141 'default' => array(
142 'switch_light_mode_bg' => '#121116',
143 'switch_dark_mode_bg' => '#ffffff',
144 )
145 ),
146
147 array(
148 'id' => 'switch_width_height',
149 'type' => 'dimensions',
150 'title' => esc_html__('Switch Size', 'darkify'),
151 'title_help' => '<div class="darkify-info-label">' . __('Customize the Floating Switch width & height as you need.', 'darkify') . '</div>',
152 'units' => ['px'],
153 'width_text' => __( 'Width', 'darkify' ),
154 'height_text' => __( 'Height', 'darkify' ),
155 'default' => array(
156 'width' => '60',
157 'height' => '60',
158 ),
159 'attributes' => array(
160 'min' => 0,
161 ),
162 ),
163
164 array(
165 'id' => 'switch_icon_color',
166 'type' => 'color_group',
167 'title' => esc_html__('Switch Icon Color', 'darkify'),
168 'title_help' => '<div class="darkify-info-label">' . __('Customize the Floating Switch icon color as you need.', 'darkify') . '</div>',
169 'options' => array(
170 'switch_light_mode_color' => esc_html__('Light Mode', 'darkify'),
171 'switch_dark_mode_color' => esc_html__('Dark Mode', 'darkify'),
172 ),
173 'default' => array(
174 'switch_light_mode_color' => '#ffffff',
175 'switch_dark_mode_color' => '#121116',
176 )
177 ),
178 array(
179 'id' => 'switch_icon_size',
180 'type' => 'dimensions',
181 'title' => esc_html__('Switch Icon Size', 'darkify'),
182 'title_help' => '<div class="darkify-info-label">' . __('Customize the Selected Switch Icon Size.', 'darkify') . '</div>',
183 'height' => false,
184 'units' => ['px'],
185 'default' => array(
186 'width' => '40',
187 )
188 ),
189 array(
190 'id' => 'switch_border',
191 'type' => 'border',
192 'title' => __( 'Switch Border', 'darkify' ),
193 'title_help' => '<div class="darkify-info-label">' . __('Customize the Floating Switch border & border radius as you need.', 'darkify') . '</div>',
194 'color' => true,
195 'style' => false,
196 'color2' => false,
197 'all' => true,
198 'radius' => true,
199 'default' => array(
200 'color' => '#121116',
201 'color3' => '#ffffff',
202 'all' => 0,
203 'radius' => 7,
204 ),
205 ),
206 array(
207 'id' => 'tooltip_on_floating_switch',
208 'type' => 'fieldset',
209 'fields' => array(
210 array(
211 'id' => 'floating_switch_width',
212 'type' => 'switcher',
213 'title' => esc_html__('Tooltip On Floating Switch', 'darkify'),
214 'title_help' => '<div class="darkify-info-label">' . __('Want to show a hint on dark mode floating switch as tooltip?', 'darkify') . '</div>',
215 'text_on' => esc_html__('Enabled', 'darkify'),
216 'text_off' => esc_html__('Disabled', 'darkify'),
217 'text_width' => 100,
218 'default' => false,
219 ),
220 array(
221 'id' => 'tooltip_position',
222 'type' => 'button_set',
223 'title' => esc_html__('Tooltip Position', 'darkify'),
224 'title_help' => '<div class="darkify-info-label">' . __('Choose the position where the tooltip should be displaed relative to the floating switch.', 'darkify') . '</div>',
225 'options' => array(
226 'left' => esc_html__('Left', 'darkify'),
227 'right' => esc_html__('Right', 'darkify'),
228 'top' => esc_html__('Top', 'darkify'),
229 'bottom' => esc_html__('Bottom', 'darkify'),
230 ),
231 'default' => 'left',
232 'dependency' => array('floating_switch_width', '==', 'true'),
233 ),
234 array(
235 'id' => 'tooltip_text',
236 'type' => 'text',
237 'title' => esc_html__('Tooltip Text', 'darkify'),
238 'title_help' => '<div class="darkify-info-label">' . __('Customize text to be displayed on the tooltip.', 'darkify') . '</div>',
239 'default' => esc_html__('Toggle Dark Mode', 'darkify'),
240 'dependency' => array('floating_switch_width', '==', 'true'),
241 ),
242
243 array(
244 'id' => 'tooltip_color',
245 'type' => 'color_group',
246 'title' => esc_html__('Tooltip Color', 'darkify'),
247 'title_help' => '<div class="darkify-info-label">' . __('Customize tooltip design in your way.', 'darkify') . '</div>',
248 'options' => array(
249 'tooltip_background_color' => esc_html__('Background', 'darkify'),
250 'tooltip_text_color' => esc_html__('Color', 'darkify'),
251 ),
252 'default' => array(
253 'tooltip_background_color' => '#142434',
254 'tooltip_text_color' => '#B0CBE7',
255 ),
256 'dependency' => array('floating_switch_width', '==', 'true'),
257 ),
258
259 ),
260 ),
261 array(
262 'id' => 'alternative_dark_mode_switcher',
263 'type' => 'text',
264 'title' => esc_html__('Alternative Dark Mode Switch', 'darkify'),
265 'title_help' => '<div class="darkify-info-label">' . __('Enter comma-separated CSS class or ID selectors to treat them as dark mode switch.', 'darkify') . '</div>',
266 ),
267 array(
268 'id' => 'switcher_shortcode',
269 'type' => 'switcher_shortcode',
270 'title' => esc_html__('Switcher Shortcode', 'darkify'),
271 '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'),
272 ),
273 )
274 ),
275 array(
276 'title' => esc_html__('Positioning', 'darkify'),
277 'icon' => 'icofont-hand-drag',
278 'fields' => array(
279
280 // Switch Position
281 array(
282 'id' => 'switcher_button_position',
283 'type' => 'fieldset',
284 'fields' => array(
285 array(
286 'id' => 'dark_mode_switch_position',
287 'type' => 'button_set',
288 'title' => esc_html__('Switch Position', 'darkify'),
289 'title_help' => '<div class="darkify-info-label">' . __('Choose the screen position where the Floating Switch should be displayed.', 'darkify') . '</div>',
290 'options' => array(
291 'bottom_right' => esc_html__('Bottom Right', 'darkify'),
292 'bottom_left' => esc_html__('Bottom Left', 'darkify'),
293 'top_right' => esc_html__('Top Right', 'darkify'),
294 'top_left' => esc_html__('Top Left', 'darkify'),
295 ),
296 'default' => 'bottom_right',
297 ),
298 array(
299 'id' => 'switch_position_top_right',
300 'type' => 'spacing',
301 'title' => esc_html__('Margin From Top Right', 'darkify'),
302 'title_help' => '<div class="darkify-info-label">' . __('Customize default margin from the top right of the Floating Switch.', 'darkify') . '</div>',
303 'left' => false,
304 'bottom' => false,
305 'units' => ['px'],
306 'default' => array(
307 'top' => '40',
308 'right' => '40',
309 ),
310 'dependency' => array('dark_mode_switch_position', '==', 'top_right'),
311 ),
312 array(
313 'id' => 'switch_position_top_left',
314 'type' => 'spacing',
315 'title' => esc_html__('Margin From Top Left', 'darkify'),
316 'title_help' => '<div class="darkify-info-label">' . __('Customize default margin from the top left of the Floating Switch.', 'darkify') . '</div>',
317 'right' => false,
318 'bottom' => false,
319 'units' => ['px'],
320 'default' => array(
321 'top' => '40',
322 'left' => '40',
323 ),
324 'dependency' => array('dark_mode_switch_position', '==', 'top_left'),
325 ),
326 array(
327 'id' => 'switch_position_bottom_right',
328 'type' => 'spacing',
329 'title' => esc_html__('Margin From Bottom Right', 'darkify'),
330 'title_help' => '<div class="darkify-info-label">' . __('Customize default margin from the bottom right of the Floating Switch.', 'darkify') . '</div>',
331 'left' => false,
332 'top' => false,
333 'units' => ['px'],
334 'default' => array(
335 'bottom' => '40',
336 'right' => '40',
337 ),
338 'dependency' => array('dark_mode_switch_position', '==', 'bottom_right'),
339 ),
340 array(
341 'id' => 'switch_position_bottom_left',
342 'type' => 'spacing',
343 'title' => esc_html__('Margin From Bottom Left', 'darkify'),
344 'title_help' => '<div class="darkify-info-label">' . __('Customize default margin from the bottom left of the Floating Switch.', 'darkify') . '</div>',
345 'right' => false,
346 'top' => false,
347 'units' => ['px'],
348 'default' => array(
349 'bottom' => '40',
350 'left' => '40',
351 ),
352 'dependency' => array('dark_mode_switch_position', '==', 'bottom_left'),
353 ),
354 ),
355 ),
356
357 // Different Switch Position in Mobile
358 array(
359 'id' => 'different_switch_in_mobile',
360 'type' => 'fieldset',
361 'fields' => array(
362 array(
363 'id' => 'switch_position_different_in_mobile',
364 'type' => 'switcher',
365 'title' => esc_html__('Different Switch Position in Mobile', 'darkify'),
366 'title_help' => '<div class="darkify-info-label">' . __('CShould the Floating Switch be displayed on different position in mobile?', 'darkify') . '</div>',
367 'text_on' => esc_html__('Yes', 'darkify'),
368 'text_off' => esc_html__('No', 'darkify'),
369
370 ),
371 array(
372 'id' => 'switch_position_in_mobile',
373 'type' => 'button_set',
374 'title' => esc_html__('Switch Position in Mobile', 'darkify'),
375 'title_help' => '<div class="darkify-info-label">' . __('Choose the screen position where the Floating Switch should be displayed in mobile.', 'darkify') . '</div>',
376 'options' => array(
377 'bottom_right' => esc_html__('Bottom Right', 'darkify'),
378 'bottom_left' => esc_html__('Bottom Left', 'darkify'),
379 'top_right' => esc_html__('Top Right', 'darkify'),
380 'top_left' => esc_html__('Top Left', 'darkify'),
381 ),
382 'default' => 'bottom_right',
383 'dependency' => array('switch_position_different_in_mobile', '==', 'true'),
384 ),
385 array(
386 'id' => 'switch_position_top_right_in_mobile',
387 'type' => 'spacing',
388 'title' => esc_html__('Margin From Top Right in Mobile', 'darkify'),
389 'title_help' => '<div class="darkify-info-label">' . __('Customize default margin from the top right of the Floating Switch.', 'darkify') . '</div>',
390 'left' => false,
391 'bottom' => false,
392 'units' => ['px'],
393 'default' => array(
394 'top' => '40',
395 'right' => '40',
396 ),
397 'dependency' => array('switch_position_different_in_mobile|switch_position_in_mobile', '==|==', 'true|top_right'),
398 ),
399 array(
400 'id' => 'switch_position_top_left_in_mobile',
401 'type' => 'spacing',
402 'title' => esc_html__('Margin From Top Left in Mobile', 'darkify'),
403 'title_help' => '<div class="darkify-info-label">' . __('Customize default margin from the top left of the Floating Switch.', 'darkify') . '</div>',
404 'right' => false,
405 'bottom' => false,
406 'units' => ['px'],
407 'default' => array(
408 'top' => '40',
409 'left' => '40',
410 ),
411 'dependency' => array('switch_position_different_in_mobile|switch_position_in_mobile', '==|==', 'true|top_left'),
412 ),
413 array(
414 'id' => 'switch_position_bottom_right_in_mobile',
415 'type' => 'spacing',
416 'title' => esc_html__('Margin From Bottom Right in Mobile', 'darkify'),
417 'title_help' => '<div class="darkify-info-label">' . __('Customize default margin from the bottom right of the Floating Switch.', 'darkify') . '</div>',
418 'left' => false,
419 'top' => false,
420 'units' => ['px'],
421 'default' => array(
422 'bottom' => '40',
423 'right' => '40',
424 ),
425 'dependency' => array('switch_position_different_in_mobile|switch_position_in_mobile', '==|==', 'true|bottom_right'),
426 ),
427 array(
428 'id' => 'switch_position_bottom_left_in_mobile',
429 'type' => 'spacing',
430 'title' => esc_html__('Margin From Bottom Left in Mobile', 'darkify'),
431 'title_help' => '<div class="darkify-info-label">' . __('Customize default margin from the bottom left of the Floating Switch.', 'darkify') . '</div>',
432 'right' => false,
433 'top' => false,
434 'units' => ['px'],
435 'default' => array(
436 'bottom' => '40',
437 'left' => '40',
438 ),
439 'dependency' => array('switch_position_different_in_mobile|switch_position_in_mobile', '==|==', 'true|bottom_left'),
440 ),
441 ),
442 ),
443 array(
444 'id' => 'enable_absolute_position',
445 'type' => 'switcher',
446 'title' => esc_html__('Absolute Switch Position', 'darkify'),
447 'text_on' => esc_html__('Enabled', 'darkify'),
448 'text_off' => esc_html__('Disabled', 'darkify'),
449 'text_width' => '100',
450 'title_help' => '<div class="darkify-info-label">' . __('Enable to make the floating switch scroll from its position with page scrolling.', 'darkify') . '</div>',
451 ),
452 array(
453 'id' => 'enable_switch_dragging',
454 'type' => 'switcher',
455 'title' => esc_html__('Draggable Position Change', 'darkify'),
456 'text_on' => esc_html__('Enabled', 'darkify'),
457 'text_off' => esc_html__('Disabled', 'darkify'),
458 'text_width' => '100',
459 'title_help' => '<div class="darkify-info-label">' . __('Allow/Disallow users to change the floating switch position by dragging to where they want.', 'darkify') . '</div>',
460 'class' => 'switcher_pro_only',
461 ),
462 )
463 ),
464 )
465 ),
466 )
467 )
468 );
469 }
470 }
471