Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(271)

Unified Diff: ui/accessibility/extensions/caretbrowsing/options.html

Issue 593293002: Initial checkin of accessibility extensions. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Fix license issues Created 6 years, 3 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: ui/accessibility/extensions/caretbrowsing/options.html
diff --git a/ui/accessibility/extensions/caretbrowsing/options.html b/ui/accessibility/extensions/caretbrowsing/options.html
new file mode 100644
index 0000000000000000000000000000000000000000..6a463b8075c3d9938449cf38939abb0c8bec53a0
--- /dev/null
+++ b/ui/accessibility/extensions/caretbrowsing/options.html
@@ -0,0 +1,218 @@
+<html>
+<head>
+ <title>Caret Browsing Options</title>
+ <style>
+ body {
+ font-family: Lucida Grande, sans-serif, arial, helvetica;
+ width: 920px;
+ margin-left: auto;
+ margin-right: auto;
+ }
+ .banner {
+ width: 100%;
+ float: left;
+ }
+ .banner_left {
+ padding: 8px;
+ float: left;
+ }
+ .banner_right {
+ padding: 8px;
+ }
+ .body_wrapper {
+ width: 100%;
+ float: left;
+ }
+ .body_left {
+ border: 0;
+ padding: 0;
+ margin: 0;
+ width: 50%;
+ float: left;
+ }
+ .body_right {
+ border: 0;
+ padding: 0;
+ margin: 0;
+ width: 46%;
+ float: left;
+ }
+ .body_inner {
+ padding: 0 32px;
+ }
+ body.mac .nonmac {
+ display: none;
+ }
+ body.nonmac .mac {
+ display: none;
+ }
+ body.cros .noncros {
+ display: none;
+ }
+ body.noncros .cros {
+ display: none;
+ }
+ .key {
+ border: 1px solid #666;
+ color: #444;
+ padding: 0.2em 0.8em;
+ margin: 0 0.3em;
+ background: #eee;
+ }
+ p {
+ line-height: 1.6em;
+ }
+ fieldset {
+ margin-bottom: 1em;
+ }
+ fieldset div {
+ margin: 0.6em 0;
+ }
+ p.cros img {
+ vertical-align: middle;
+ }
+ </style>
+ <link href="caretbrowsing.css" rel="stylesheet" type="text/css">
+ <script src="accessibility_utils.js"></script>
+ <script src="traverse_util.js"></script>
+ <script src="caretbrowsing.js"></script>
+ <script src="options.js"></script>
+</head>
+<body caretbrowsing="on">
+
+<div class="banner">
+ <div class="banner_left">
+ <img src="caret_128.png" class="logo" alt="">
+ </div>
+ <div class="banner_right">
+ <h1 i18n-content="appName">Caret Browsing</h1>
+ <p i18n-content="subheading1">
+ This extension gives you a movable cursor in the web page,
+ allowing you to select text with the keyboard.
+ </p>
+ <p i18n-content="subheading2">
+ Try it out now - Caret Browsing is always enabled on this page!
+ </p>
+ </div>
+</div>
+
+<div class="body_wrapper">
+ <div class="body_left">
+ <div class="body_inner">
+ <h2 i18n-content="keyboardCommands">Keyboard Commands</h2>
+
+ <p class="noncros" i18n-content="enableDisableNonCros">
+ Press <span class="key">F7</span> to turn on Caret Browsing.
+ Press it again to turn it off.
+ </p>
+ <p class="cros" i18n-content="enableDisableCros">
+ Press <span class="key">Alt</span> + <img src="increase_brightness.png"> (the Increase Brightness key, or F7) to turn on Caret Browsing.
+ Press it again to turn it off.
+ </p>
+
+ <div i18n-content="navHelp">
+ <p>
+ Use arrow keys to move throughout the document.
+ </p>
+
+ <p>
+ Click anywhere to move the cursor to that location.
+ </p>
+
+ <p>
+ Press <span class="key">Shift</span> + arrows to select text.
+ </p>
+ </div>
+
+ <p class="nonmac" i18n-content="moveByWordsNonMac">
+ Hold down <span class="key">Control</span> to move by words.
+ </p>
+ <p class="mac" i18n-content="moveByWordsMac">
+ Hold down <span class="key">Option</span> to move by words.
+ </p>
+
+ <div i18n-content="focusHelp">
+ <p>
+ When you reach a link or control, it is automatically focused.
+ Press <span class="key">Enter</span> to click a link or button.
+ </p>
+
+ <p>
+ When a focused control (like a text box or a list box) is capturing
+ arrow keys, press <span class="key">Esc</span> followed by the
+ left or right arrow to continue Caret Browsing.
+ </p>
+
+ <p>
+ Alternatively, press <span class="key">Tab</span> to move to the
+ next focusable control.
+ </p>
+ </div>
+ </div>
+ </div>
+ <div class="body_right">
+ <div class="body_inner">
+ <h2>Visual Feedback</h2>
+
+ <fieldset>
+ <legend i18n-content="whenEnabled">
+ When Caret Browsing is enabled:
+ </legend>
+
+ <div>
+ <input type="radio" id="onenable_anim" name="onenable" value="anim">
+ <label for="onenable_anim" i18n-content="animation">
+ Highlight the cursor position with an animation.
+ </label>
+ </div>
+
+ <div>
+ <input type="radio" id="onenable_flash" name="onenable" value="flash">
+ <label for="onenable_flash" i18n-content="flash">
+ Highlight the cursor position with a quick flash.
+ </label>
+ </div>
+
+ <div>
+ <input type="radio" id="onenable_nothing" name="onenable" value="none">
+ <label for="onenable_nothing" i18n-content="noFeedback">
+ No feedback, just show the cursor.
+ </label>
+ </div>
+
+ </fieldset>
+
+ <fieldset>
+ <legend i18n-content="jump">
+ When the caret jumps by a large distance:
+ </legend>
+
+ <div>
+ <input type="radio" id="onjump_anim" name="onjump" value="anim">
+ <label for="onjump_anim" i18n-content="animation">
+ Highlight the cursor position with an animation.
+ </label>
+ </div>
+
+ <div>
+ <input type="radio" id="onjump_flash" name="onjump" value="flash">
+ <label for="onjump_flash" i18n-content="flash">
+ Highlight the cursor position with a quick flash.
+ </label>
+ </div>
+
+ <div>
+ <input type="radio" id="onjump_nothing" name="onjump" value="none">
+ <label for="onjump_nothing" i18n-content="noFeedback">
+ No feedback, just move the cursor.
+ </label>
+ </div>
+
+ </fieldset>
+
+ </div>
+ </div>
+</div>
+
+</body>
+</html>
« no previous file with comments | « ui/accessibility/extensions/caretbrowsing/manifest.json ('k') | ui/accessibility/extensions/caretbrowsing/options.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698