Index: ui/accessibility/extensions/alt/hide-images.css |
diff --git a/ui/accessibility/extensions/alt/hide-images.css b/ui/accessibility/extensions/alt/hide-images.css |
new file mode 100644 |
index 0000000000000000000000000000000000000000..a9d30e333a958551e640521a240774ab3650f43c |
--- /dev/null |
+++ b/ui/accessibility/extensions/alt/hide-images.css |
@@ -0,0 +1,146 @@ |
+/* Copyright (c) 2014 The Chromium Authors. All rights reserved. |
+ * Use of this source code is governed by a BSD-style license that can be |
+ * found in the LICENSE file. */ |
+ |
+body[show-alt] img { |
+ /* add some fake content to hang the ::before element off */ |
+ content: "" !important; |
+ background-image: url('data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7') |
+ |
+ /* display non-floated and remove any background color */ |
+ float: none !important; |
+ background-color: inherit !important; |
+ |
+ /* set height to contain the text content */ |
+ height: 100% !important; |
+} |
+ |
+body[show-alt] img:not([alt]):not([aria-hidden=true]):not([role=presentation]):before { |
+ content: url('chrome-extension://__MSG_@@extension_id__/images/speech-missing-alt-16.png') " " attr(_repaired) !important; |
+ box-shadow: inset 0 -4px 0 rgba(230, 124, 115, 1) !important; |
+} |
+ |
+body[show-alt] img:not([aria-hidden=true]):not([role=presentation]):not([alt='']):before { |
+ content: url('chrome-extension://__MSG_@@extension_id__/images/speech-16.png') " " attr(alt) !important; |
+ box-shadow: inset 0 -4px 0 rgba(139, 195, 74, 1) !important; |
+ display: table; |
+ clear: both; |
+} |
+ |
+@-webkit-keyframes slideDown { |
+ from { |
+ -webkit-transform: translateY(-150%); |
+ } |
+ to { |
+ -webkit-transform: translateY(0px); |
+ } |
+} |
+ |
+@-webkit-keyframes slideUp { |
+ from { |
+ -webkit-transform: translateY(0%); |
+ } |
+ to { |
+ -webkit-transform: translateY(-150%); |
+ } |
+} |
+ |
+body[show-alt] .show-alt-infobar { |
+ -webkit-animation-name: slideDown; |
+ -webkit-animation-duration: 0.5s; |
+ -webkit-animation-delay: 0.5s; |
+ -webkit-animation-iteration-count: 1; |
+ -webkit-animation-timing-function: ease; |
+ -webkit-animation-direction: forwards; |
+ -webkit-transform: translateY(0%); |
+} |
+ |
+body:not([show-alt]) .show-alt-infobar { |
+ -webkit-animation-name: slideUp; |
+ -webkit-animation-duration: 0.5s; |
+ -webkit-animation-delay: 0.5s; |
+ -webkit-animation-iteration-count: 1; |
+ -webkit-animation-timing-function: ease; |
+ -webkit-animation-direction: forwards; |
+ -webkit-transform: translateY(-150%); |
+} |
+ |
+.show-alt-infobar { |
+ top: 0; |
+ left: 0; |
+ right: 0; |
+ z-index: 100000001; /* :( */ |
+ position: fixed !important; |
+ background: #fde073 !important; |
+ text-align: center !important; |
+ line-height: 2.0; |
+ overflow: hidden; |
+ box-shadow: 0 0 5px black; |
+ box-shadow: 0 0 5px black; |
+ font-family: Arial, sans-serif !important; |
+ font-size: 12pt !important; |
+ -webkit-animation-fill-mode: backwards; |
+} |
+ |
+.show-alt-infobar .content { |
+ display: inline-block !important; |
+} |
+ |
+.show-alt-infobar span { |
+ margin: 5px; |
+} |
+ |
+.show-alt-infobar button.link-button { |
+ -webkit-appearance: none !important; |
+ font: inherit !important; |
+ background: inherit !important; |
+ border: none !important; |
+ color: #1155CC !important; |
+ cursor: pointer !important; |
+ display: inline !important; |
+ margin: 0 !important; |
+ padding: 0 !important; |
+ text-decoration: none !important; |
+ box-shadow: none !important; |
+ text-transform: none !important; |
+ padding: none !important; |
+} |
+ |
+.show-alt-infobar button.link-button:hover, |
+.show-alt-infobar button.link-button:focus { |
+ color: #1155CC; |
+ text-decoration: underline; |
+ outline: none; |
+} |
+ |
+.show-alt-infobar .controls { |
+ float: right !important; |
+ display: inline-block !important; |
+ padding-right: 5px !important; |
+} |
+ |
+.show-alt-infobar .close-button-gray:hover, |
+.show-alt-infobar .close-button-gray:focus { |
+ background-position: -143px -96px !important; |
+ outline: none; |
+} |
+ |
+.show-alt-infobar .close-button-gray { |
+ -webkit-appearance: none !important; |
+ font: inherit !important; |
+ background: inherit !important; |
+ border: none !important; |
+ cursor: pointer !important; |
+ margin: 0 !important; |
+ padding: 0 !important; |
+ text-decoration: none !important; |
+ box-shadow: none !important; |
+ text-transform: none !important; |
+ padding: none !important; |
+ width: 13px !important; |
+ height: 13px !important; |
+ background-position: -175px -96px !important; |
+ background-image: url('chrome-extension://__MSG_@@extension_id__/images/statusbarButtonGlyphs.png') !important; |
+ background-size: 320px 144px !important; |
+ display: inline-block !important; |
+} |