| @@ -3,16 +3,27 @@ | ||
| 3 | 3 | defined('ABSPATH') or die; |
| 4 | 4 | |
| 5 | 5 | // phpcs:disable WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound -- Template variables in view files |
| 6 | 6 | use FluentForm\Framework\Helpers\ArrayHelper; |
| 7 | + | |
| 8 | +$settings_menu_icons = [ | |
| 9 | + 'form_settings' => 'ff-icon-setting', | |
| 10 | + 'email_notifications' => 'ff-icon-email', | |
| 11 | + 'conditional_confirmations' => 'ff-icon-checkmark-square', | |
| 12 | + 'all_integrations' => 'ff-icon-puzzle', | |
| 13 | + 'slack' => 'ff-icon-promotion', | |
| 14 | + 'custom_css_js' => 'ff-icon-code', | |
| 15 | + 'landing_pages' => 'ff-icon-web-development', | |
| 16 | + 'quiz_settings' => 'ff-icon-task', | |
| 17 | + 'pdf_feeds' => 'ff-icon-document', | |
| 18 | + 'post_feeds' => 'ff-icon-file-add', | |
| 19 | + 'payment_settings' => 'ff-icon-payment', | |
| 20 | +]; | |
| 7 | 21 | ?> |
| 8 | 22 | |
| 9 | 23 | <div class="ff_settings_wrapper ff_layout_section"> |
| 10 | - <div class="ff_settings_sidebar_wrap"> | |
| 11 | - <span class="ff_sidebar_toggle" title="Toggle Setting"> | |
| 12 | - <i class="ff-icon ff-icon-arrow-right"></i> | |
| 13 | - </span> | |
| 14 | - <div class="ff_settings_sidebar ff_layout_section_sidebar"> | |
| 24 | + <div id="ff_form_settings_sidebar" class="ff_settings_sidebar_wrap"> | |
| 25 | + <div class="ff_settings_sidebar ff_layout_section_sidebar" role="navigation" aria-label="<?php echo esc_attr(__('Form settings menu', 'fluentform')); ?>"> | |
| 15 | 26 | <ul class="ff_settings_list ff_list_button"> |
| 16 | 27 | <?php |
| 17 | 28 | $settings_base_url = admin_url('admin.php?page=fluent_forms&form_id='.$form_id.'&route=settings&sub_route=form_settings'); |
| 18 | 29 | $form_settings_route = $settings_menus['form_settings']['route']; |
| @@ -20,10 +31,13 @@ | ||
| 20 | 31 | <li class="ff_list_button_item has_sub_menu"> |
| 21 | 32 | <a |
| 22 | 33 | class="ff_list_button_link ff-page-scroll" |
| 23 | 34 | data-route_key="<?php echo esc_attr($form_settings_route); ?>" |
| 35 | + aria-label="<?php echo esc_attr(__('Settings', 'fluentform')); ?>" | |
| 36 | + title="<?php echo esc_attr(__('Settings', 'fluentform')); ?>" | |
| 24 | 37 | href="#confirmation-settings"> |
| 25 | - <?php echo esc_html(__('Settings', 'fluentform')); ?> | |
| 38 | + <i class="ff_settings_menu_icon ff-icon <?php echo esc_attr($settings_menu_icons['form_settings']); ?>" aria-hidden="true"></i> | |
| 39 | + <span class="ff_settings_menu_label"><?php echo esc_html(__('Settings', 'fluentform')); ?></span> | |
| 26 | 40 | </a> |
| 27 | 41 | <ul class="ff_list_submenu"> |
| 28 | 42 | <li> |
| 29 | 43 | <a class="ff-page-scroll" href="#confirmation-settings"> |
| @@ -83,9 +97,9 @@ | ||
| 83 | 97 | </li> |
| 84 | 98 | </ul> |
| 85 | 99 | </li> |
| 86 | 100 | |
| 87 | - <?php foreach ($settings_menus as $settings_menu): ?> | |
| 101 | + <?php foreach ($settings_menus as $settings_menu_key => $settings_menu): ?> | |
| 88 | 102 | <?php if (ArrayHelper::get($settings_menu, 'hash') != 'basic_settings') : ?> |
| 89 | 103 | |
| 90 | 104 | <li class="ff_list_button_item"> |
| 91 | 105 | <?php if(isset($settings_menu['route'])): ?> |
| @@ -91,19 +105,23 @@ | ||
| 91 | 105 | <?php if(isset($settings_menu['route'])): ?> |
| 92 | 106 | <?php |
| 93 | 107 | $route = $settings_menu['route']; |
| 94 | 108 | ?> |
| 95 | - <a class="ff_list_button_link" data-route_key="<?php echo esc_attr($route); ?>" href="<?php echo esc_url($settings_base_url); ?>#<?php echo esc_attr($route); ?>"> | |
| 96 | - <?php echo esc_html($settings_menu['title']); ?> | |
| 109 | + <a class="ff_list_button_link" data-route_key="<?php echo esc_attr($route); ?>" aria-label="<?php echo esc_attr($settings_menu['title']); ?>" title="<?php echo esc_attr($settings_menu['title']); ?>" href="<?php echo esc_url($settings_base_url); ?>#<?php echo esc_attr($route); ?>"> | |
| 110 | + <i class="ff_settings_menu_icon ff-icon <?php echo esc_attr(ArrayHelper::get($settings_menu_icons, $settings_menu_key, 'ff-icon-setting')); ?>" aria-hidden="true"></i> | |
| 111 | + <span class="ff_settings_menu_label"><?php echo esc_html($settings_menu['title']); ?></span> | |
| 97 | 112 | </a> |
| 98 | 113 | <?php else: ?> |
| 99 | 114 | <a |
| 100 | - class="ff_list_button_link" <?php if(isset($settings_menu['class'])) { echo 'class="'. esc_attr($settings_menu['class']).'"'; } ?> | |
| 115 | + class="ff_list_button_link <?php if(isset($settings_menu['class'])) { echo esc_attr($settings_menu['class']); } ?>" | |
| 101 | 116 | data-settings_key="<?php echo (isset($settings_menu['settings_key'])) ? esc_attr($settings_menu['settings_key']) : '';?>" |
| 102 | 117 | data-component="<?php echo (isset($settings_menu['component'])) ? esc_attr($settings_menu['component']) : '';?>" |
| 103 | 118 | data-hash="<?php echo (isset($settings_menu['hash'])) ? esc_attr($settings_menu['hash']) : '';?>" |
| 119 | + aria-label="<?php echo esc_attr($settings_menu['title']); ?>" | |
| 120 | + title="<?php echo esc_attr($settings_menu['title']); ?>" | |
| 104 | 121 | href="<?php echo esc_url($settings_base_url).'&sub_route='. esc_attr($settings_menu['slug']); ?><?php if(isset($settings_menu['hash'])) { echo '#'. esc_attr($settings_menu['hash']); } ?>"> |
| 105 | - <?php echo esc_html($settings_menu['title']); ?> | |
| 122 | + <i class="ff_settings_menu_icon ff-icon <?php echo esc_attr(ArrayHelper::get($settings_menu_icons, $settings_menu_key, 'ff-icon-setting')); ?>" aria-hidden="true"></i> | |
| 123 | + <span class="ff_settings_menu_label"><?php echo esc_html($settings_menu['title']); ?></span> | |
| 106 | 124 | </a> |
| 107 | 125 | <?php endif; ?> |
| 108 | 126 | </li> |
| 109 | 127 | |
| @@ -110,8 +128,12 @@ | ||
| 110 | 128 | <?php endif;?> |
| 111 | 129 | <?php endforeach; ?> |
| 112 | 130 | </ul> |
| 113 | 131 | </div> |
| 132 | + <button type="button" class="ff_sidebar_toggle" title="<?php echo esc_attr(__('Collapse settings menu', 'fluentform')); ?>" aria-label="<?php echo esc_attr(__('Collapse settings menu', 'fluentform')); ?>" aria-controls="ff_form_settings_sidebar" aria-expanded="true" data-collapse-label="<?php echo esc_attr(__('Collapse settings menu', 'fluentform')); ?>" data-expand-label="<?php echo esc_attr(__('Expand settings menu', 'fluentform')); ?>"> | |
| 133 | + <i class="ff-icon ff-icon-arrow-right" aria-hidden="true"></i> | |
| 134 | + <span class="ff_sidebar_toggle_text"><?php echo esc_html(__('Collapse menu', 'fluentform')); ?></span> | |
| 135 | + </button> | |
| 114 | 136 | </div><!-- .ff_settings_sidebar_wrap --> |
| 115 | 137 | |
| 116 | 138 | <div class="ff_settings_container ff_layout_section_container"> |
| 117 | 139 | <?php |