| OLD | NEW |
| (Empty) | |
| 1 <link rel="import" href="chrome://resources/html/polymer.html"> |
| 2 <link rel="import" href="/controls/settings_checkbox.html"> |
| 3 <link rel="import" href="/i18n_setup.html"> |
| 4 <link rel="import" href="/route.html"> |
| 5 <link rel="import" href="/settings_shared_css.html"> |
| 6 |
| 7 <dom-module id="settings-manage-a11y-page"> |
| 8 <template> |
| 9 <style include="settings-shared"> |
| 10 div.indented { |
| 11 -webkit-margin-start: 20px; |
| 12 } |
| 13 |
| 14 h3 { |
| 15 color: rgb(90, 90, 90); |
| 16 font-weight: 500; |
| 17 } |
| 18 |
| 19 .settings-box iron-icon { |
| 20 -webkit-margin-end: var(--iron-icon-spacing); |
| 21 } |
| 22 |
| 23 .settings-box settings-checkbox { |
| 24 flex-grow: 1; |
| 25 } |
| 26 </style> |
| 27 <div class="settings-box row first"> |
| 28 <span> |
| 29 $i18n{a11yExplanation} |
| 30 <a href="$i18nRaw{a11yLearnMoreUrl}" target="_blank"> |
| 31 $i18n{learnMore} |
| 32 </a> |
| 33 </span> |
| 34 </div> |
| 35 |
| 36 <div class="settings-box block"> |
| 37 <h3>$i18n{textToSpeechHeading}</h3> |
| 38 <div class="settings-box first indented"> |
| 39 <settings-checkbox pref="{{prefs.settings.accessibility}}" |
| 40 label="$i18n{chromeVoxLabel}"> |
| 41 </settings-checkbox> |
| 42 <paper-icon-button icon="cr:settings" on-tap="onChromeVoxSettingsTap_"> |
| 43 </paper-icon-button> |
| 44 </div> |
| 45 <template is="dom-if" if="[[showExperimentalFeatures_]]"> |
| 46 <div class="settings-box first indented"> |
| 47 <settings-checkbox pref="{{prefs.settings.a11y.select_to_speak}}" |
| 48 label="$i18n{selectToSpeakTitle}" |
| 49 sub-label="$i18n{selectToSpeakDescription}"> |
| 50 </settings-checkbox> |
| 51 </div> |
| 52 </template> |
| 53 |
| 54 <h3>$i18n{displayHeading}</h3> |
| 55 <div class="settings-box block first indented"> |
| 56 <settings-checkbox label="$i18n{highContrastLabel}" |
| 57 pref="{{prefs.settings.a11y.high_contrast_enabled}}"> |
| 58 </settings-checkbox> |
| 59 <settings-checkbox label="$i18n{screenMagnifierLabel}" |
| 60 pref="{{prefs.settings.a11y.screen_magnifier}}"> |
| 61 </settings-checkbox> |
| 62 </div> |
| 63 <div class="settings-box two-line indented" on-tap="onDisplayTap_" |
| 64 actionable> |
| 65 <iron-icon icon="settings:desktop-windows"></iron-icon> |
| 66 <div class="start"> |
| 67 <div>$i18n{displaySettingsTitle}</div> |
| 68 <div class="secondary">$i18n{displaySettingsDescription}</div> |
| 69 </div> |
| 70 </div> |
| 71 <div class="settings-box two-line indented" on-tap="onAppearanceTap_" |
| 72 actionable> |
| 73 <iron-icon icon="settings:text-format"></iron-icon> |
| 74 <div class="start"> |
| 75 <div>$i18n{appearanceSettingsTitle}</div> |
| 76 <div class="secondary">$i18n{appearanceSettingsDescription}</div> |
| 77 </div> |
| 78 </div> |
| 79 |
| 80 <h3>$i18n{keyboardHeading}</h3> |
| 81 <div class="settings-box block first indented"> |
| 82 <settings-checkbox |
| 83 pref="{{prefs.settings.a11y.sticky_keys_enabled}}" |
| 84 label="$i18n{stickyKeysLabel}"> |
| 85 </settings-checkbox> |
| 86 <settings-checkbox pref="{{prefs.settings.a11y.virtual_keyboard}}" |
| 87 label="$i18n{onScreenKeyboardLabel}"> |
| 88 </settings-checkbox> |
| 89 <settings-checkbox pref="{{prefs.settings.a11y.focus_highlight}}" |
| 90 label="$i18n{focusHighlightLabel}"> |
| 91 </settings-checkbox> |
| 92 <settings-checkbox pref="{{prefs.settings.a11y.caret_highlight}}" |
| 93 label="$i18n{caretHighlightLabel}"> |
| 94 </settings-checkbox> |
| 95 <template is="dom-if" if="[[showExperimentalFeatures_]]"> |
| 96 <settings-checkbox pref="{{prefs.settings.a11y.switch_access}}" |
| 97 label="$i18n{switchAccessLabel}"> |
| 98 </settings-checkbox> |
| 99 </template> |
| 100 </div> |
| 101 <div class="settings-box two-line indented" on-tap="onKeyboardTap_" |
| 102 actionable> |
| 103 <iron-icon icon="settings:keyboard"></iron-icon> |
| 104 <div class="start"> |
| 105 <div>$i18n{keyboardSettingsTitle}</div> |
| 106 <div class="secondary">$i18n{keyboardSettingsDescription}</div> |
| 107 </div> |
| 108 </div> |
| 109 |
| 110 <h3>$i18n{mouseAndTouchpadHeading}</h3> |
| 111 <div class="settings-box block first indented"> |
| 112 <settings-checkbox label="$i18n{clickOnStopLabel}" |
| 113 pref="{{prefs.settings.a11y.autoclick}}"> |
| 114 </settings-checkbox> |
| 115 <div class="list-item settings-checkbox-spacer"> |
| 116 <div>$i18n{delayBeforeClickLabel}</div> |
| 117 <settings-dropdown-menu |
| 118 pref="{{prefs.settings.a11y.autoclick_delay_ms}}" |
| 119 menu-options="[[autoClickDelayOptions_]]" no-label-float> |
| 120 </settings-dropdown-menu> |
| 121 </div> |
| 122 <settings-checkbox label="$i18n{tapDraggingLabel}" |
| 123 pref="{{prefs.settings.touchpad.enable_tap_dragging}}"> |
| 124 </settings-checkbox> |
| 125 <settings-checkbox label="$i18n{largeMouseCursorLabel}" |
| 126 pref="{{prefs.settings.a11y.large_cursor_enabled}}"> |
| 127 </settings-checkbox> |
| 128 <settings-checkbox pref="{{prefs.settings.a11y.cursor_highlight}}" |
| 129 label="$i18n{cursorHighlightLabel}"> |
| 130 </settings-checkbox> |
| 131 </div> |
| 132 <div class="settings-box two-line indented" on-tap="onMouseTap_" |
| 133 actionable> |
| 134 <iron-icon icon="settings:mouse"></iron-icon> |
| 135 <div class="start"> |
| 136 <div>$i18n{mouseSettingsTitle}</div> |
| 137 <div class="secondary">$i18n{mouseSettingsDescription}</div> |
| 138 </div> |
| 139 </div> |
| 140 |
| 141 <h3>$i18n{audioHeading}</h3> |
| 142 <div class="settings-box block first indented"> |
| 143 <settings-checkbox pref="{{prefs.settings.a11y.mono_audio}}" |
| 144 label="$i18n{monoAudioLabel}"> |
| 145 </settings-checkbox> |
| 146 </div> |
| 147 </div> |
| 148 |
| 149 <div class="settings-box two-line" on-tap="onMoreFeaturesTap_" actionable> |
| 150 <div class="start"> |
| 151 <div>$i18n{additionalFeaturesTitle}</div> |
| 152 <div class="secondary">$i18n{additionalFeaturesDescription}</div> |
| 153 </div> |
| 154 </div> |
| 155 </template> |
| 156 <script src="manage_a11y_page.js"></script> |
| 157 </dom-module> |
| OLD | NEW |