chrome/browser/resources/chromeos/chromevox/cvox2/background/panel.html - Issue 1282593002: Add ChromeVox panel and implement caption display functionality.

Unified Diff: chrome/browser/resources/chromeos/chromevox/cvox2/background/panel.html

Issue 1282593002: Add ChromeVox panel and implement caption display functionality. (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master

Patch Set: Revert changes to accessibility_manager in this change Created 5 years, 4 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

« no previous file with comments | « chrome/browser/resources/chromeos/chromevox/chromevox_vars.gypi ('k') | chrome/browser/resources/chromeos/chromevox/cvox2/background/panel.js » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

Index: chrome/browser/resources/chromeos/chromevox/cvox2/background/panel.html

diff --git a/chrome/browser/resources/chromeos/chromevox/cvox2/background/panel.html b/chrome/browser/resources/chromeos/chromevox/cvox2/background/panel.html

new file mode 100644

index 0000000000000000000000000000000000000000..4d8d18ca3e94d45fa7fed146d4b220e0835a4971

--- /dev/null

+++ b/chrome/browser/resources/chromeos/chromevox/cvox2/background/panel.html

@@ -0,0 +1,128 @@

+ Use of this source code is governed by a BSD-style license that can be

+ found in the LICENSE file. -->

+<html>

+<head>

+<meta charset="utf-8">

+<title class="i18n" msgid="panel_title">ChromeVox Panel</title>

+<link href='http://fonts.googleapis.com/css?family=Droid+Sans+Mono|Roboto:400,700,700italic' rel='stylesheet' type='text/css'>

+<script type="text/javascript" src="../../closure/base.js"></script>

+<script type="text/javascript" src="../../deps.js"></script>

+<script type="text/javascript" src="panel_loader.js"></script>

+<script type="text/javascript" src="../../chromeVoxPanelScript.js">

+</script>

+<style>

+ body {

+ overflow: hidden;

+ padding: 0;

+ border: 0;

+ margin: 0;

+ }

+ #main {

+ position: fixed;

+ left: 0;

+ top: 0;

+ right: 0;

+ bottom: 0;

+ background-color: #000;

+ display: flex;

+ }

+ button {

+ border: 0;

+ padding: 0;

+ margin: 0;

+ background-color: #000;

+ }

+ #menu {

+ width: 80px;

+ height: 48px;

+ }

+ #chromevox {

+ width: 48px;

+ height: 48px;

+ }

+ #triangle {

+ width: 22px;

+ height: 22px;

+ margin: 13px 0;

+ }

+ #options {

+ background-image: url('/chromevox/options.png');

+ width: 48px;

+ height: 48px;

+ }

+ #close {

+ background-image: url('/chromevox/close-white.png');

+ width: 48px;

+ height: 48px;

+ }

+ #close:hover {

+ background-image: url('/chromevox/close-white-hover.png');

+ }

+ #caption {

+ color: #fff;

+ margin-left: 12px;

+ flex-grow: 1;

+ }

+ #speech-container {

+ height: 48px;

+ margin-left: 12px;

+ }

+ #speech {

+ height: 48px;

+ line-height: 48px;

+ font-family: 'Roboto', sans-serif;

+ font-size: 16pt;

+ }

+ .usertext {

+ font-family: 'Roboto', sans-serif;

+ font-weight: 700;

+ font-style: italic;

+ font-size: 16pt;

+ }

+ #braille-container {

+ position: relative;

+ top: -48px;

+ height: 48px;

+ }

+ #braille-text {

+ height: 24px;

+ line-height: 24px;

+ font-family: 'Droid Sans Mono', Courier, monospace;

+ font-size: 12pt;

+ letter-spacing: 3.13px;

+ }

+ #braille-cells {

+ height: 24px;

+ line-height: 24px;

+ font-family: 'Droid Sans Mono', Courier, monospace;

+ font-size: 13pt;

+ }

+</style>

+</head>

+<html>

+<body>

+<div id="main">

+ <button id="menu" aria-label="ChromeVox Menu">

+ <img id="chromevox" src="/chromevox/chromevox-48.png">

+ <img id="triangle" src="/chromevox/triangle.png">

+ </button>

+ <div id="caption">

+ <div id="speech-container">

+ <div id="speech">Speech</div>

+ </div>

+ <div id="braille-container">

+ <div id="braille-text">Braille text</div>

+ <div id="braille-cells">Braille cells</div>

+ </div>

+ <button id="options" aria-label="ChromeVox Options"></button>

+ <button id="close" aria-label="Close ChromeVox"></button>

+</div>

+</body>

+</html>