<style include="settings-shared"></style>
<settings-animated-pages id="pages" current-route="{{currentRoute}}"
section="a11y" focus-config="[[focusConfig_]]">
<div route-path="default">
<if expr="is_chromeos">
<cr-link-row
label="$i18n{manageAccessibilityFeatures}"
on-click="onManageSystemAccessibilityFeaturesClick_"
sub-label="$i18n{moreFeaturesLinkDescription}" external>
</cr-link-row>
</if>
<if expr="not is_chromeos">
<template is="dom-if" if="[[captionSettingsOpensExternally_]]">
<template is="dom-if" if="[[enableLiveCaption_]]">
<settings-live-caption prefs="{{prefs}}"
languages="[[languages]]"
language-helper="[[languageHelper]]">
</settings-live-caption>
</template>
<cr-link-row id="captions"
class="hr"
label="$i18n{captionsPreferencesTitle}"
sub-label="$i18n{captionsPreferencesSubtitle}"
on-click="onCaptionsClick_"
button-aria-description="$i18n{opensInNewTab}"
external$="[[captionSettingsOpensExternally_]]">
</cr-link-row>
</template>
<template is="dom-if" if="[[!captionSettingsOpensExternally_]]">
<cr-link-row id="captions"
class="hr"
label="$i18n{captionsTitle}"
on-click="onCaptionsClick_"
role-description="$i18n{subpageArrowRoleDescription}">
</cr-link-row>
</template>
<settings-toggle-button
class="hr"
pref="{{prefs.settings.a11y.focus_highlight}}"
on-setting-boolean-control-change="onFocusHighlightChange_"
label="$i18n{focusHighlightLabel}">
</settings-toggle-button>
<settings-toggle-button
class="hr"
pref="{{prefs.settings.a11y.caretbrowsing.enabled}}"
on-change="onA11yCaretBrowsingChange_"
label="$i18n{caretBrowsingTitle}"
sub-label="$i18n{caretBrowsingSubtitle}">
</settings-toggle-button>
</if>
<settings-toggle-button
class="hr"
hidden$="[[!hasScreenReader_]]"
pref="{{prefs.settings.a11y.enable_accessibility_image_labels}}"
on-change="onA11yImageLabelsChange_"
label="$i18n{accessibleImageLabelsTitle}"
sub-label="$i18n{accessibleImageLabelsSubtitle}">
</settings-toggle-button>
<if expr="is_win or is_linux or is_macosx">
<template is="dom-if" if="[[showAxAnnotationsSection_]]">
<settings-ax-annotations-section
id="AxAnnotationsSection"
prefs="{{prefs}}">
</settings-ax-annotations-section>
</template>
</if>
<if expr="is_win or is_linux">
<settings-toggle-button
class="hr"
hidden$="[[!showOverscrollHistoryNavigationToggle_]]"
pref="{{prefs.settings.a11y.overscroll_history_navigation}}"
on-change="onOverscrollHistoryNavigationChange_"
label="$i18n{overscrollHistoryNavigationTitle}"
sub-label="$i18n{overscrollHistoryNavigationSubtitle}">
</settings-toggle-button>
</if>
<if expr="is_macosx">
<cr-link-row
class="hr"
hidden$="[[!showOverscrollHistoryNavigationToggle_]]"
on-click="onMacTrackpadGesturesLinkClick_"
button-aria-description="$i18n{opensInNewTab}"
label="$i18n{overscrollHistoryNavigationTitle}"
sub-label="$i18n{overscrollHistoryNavigationSubtitle}"
external>
</cr-link-row>
</if>
<cr-link-row class="hr" label="$i18n{moreFeaturesLink}"
on-click="onMoreFeaturesLinkClick_" sub-label="$i18n{a11yWebStore}"
button-aria-description="$i18n{opensInNewTab}"
external>
</cr-link-row>
</div>
<if expr="not is_chromeos">
<template is="dom-if" if="[[!captionSettingsOpensExternally_]]">
<template is="dom-if" route-path="/captions">
<settings-subpage
associated-control="[[$$('#captions')]]"
page-title="$i18n{captionsTitle}">
<settings-captions prefs="{{prefs}}"
languages="[[languages]]"
language-helper="[[languageHelper]]">
</settings-captions>
</settings-subpage>
</template>
</template>
</if>
</settings-animated-pages>