Home | History | Annotate | Download | only in alt 
      1 /* Copyright (c) 2014 The Chromium Authors. All rights reserved.
      2  * Use of this source code is governed by a BSD-style license that can be
      3  * found in the LICENSE file. */
      4 
      5 body[show-alt] img {
      6     /* add some fake content to hang the ::before element off */
      7     content: "" !important;
      8     background-image: url('data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7')
      9 
     10     /* display non-floated and remove any background color */
     11     float: none !important;
     12     background-color: inherit !important;
     13 
     14     /* set height to contain the text content */
     15     height: 100% !important;
     16 }
     17 
     18 body[show-alt] img:not([alt]):not([aria-hidden=true]):not([role=presentation]):before {
     19     content: url('chrome-extension://__MSG_@@extension_id__/images/speech-missing-alt-16.png') " " attr(_repaired) !important;
     20     box-shadow: inset 0 -4px 0 rgba(230, 124, 115, 1) !important;
     21 }
     22 
     23 body[show-alt] img:not([aria-hidden=true]):not([role=presentation]):not([alt='']):before {
     24     content: url('chrome-extension://__MSG_@@extension_id__/images/speech-16.png') " " attr(alt) !important;
     25     box-shadow: inset 0 -4px 0 rgba(139, 195, 74, 1) !important;
     26     display: table;
     27     clear: both;
     28 }
     29 
     30 @-webkit-keyframes slideDown {
     31     from {
     32       -webkit-transform: translateY(-150%);
     33     }
     34     to {
     35       -webkit-transform: translateY(0px);
     36     }
     37 }
     38 
     39 @-webkit-keyframes slideUp {
     40     from {
     41       -webkit-transform: translateY(0%);
     42     }
     43     to {
     44       -webkit-transform: translateY(-150%);
     45     }
     46 }
     47 
     48 body[show-alt] .show-alt-infobar {
     49     -webkit-animation-name: slideDown;
     50     -webkit-animation-duration: 0.5s;
     51     -webkit-animation-delay: 0.5s;
     52     -webkit-animation-iteration-count: 1;
     53     -webkit-animation-timing-function: ease;
     54     -webkit-animation-direction: forwards;
     55     -webkit-transform: translateY(0%);
     56 }
     57 
     58 body:not([show-alt]) .show-alt-infobar {
     59     -webkit-animation-name: slideUp;
     60     -webkit-animation-duration: 0.5s;
     61     -webkit-animation-delay: 0.5s;
     62     -webkit-animation-iteration-count: 1;
     63     -webkit-animation-timing-function: ease;
     64     -webkit-animation-direction: forwards;
     65     -webkit-transform: translateY(-150%);
     66 }
     67 
     68 .show-alt-infobar {
     69     top: 0;
     70     left: 0;
     71     right: 0;
     72     z-index: 100000001;  /* :( */
     73     position: fixed !important;
     74     background: #fde073 !important;
     75     text-align: center !important;
     76     line-height: 2.0;
     77     overflow: hidden;
     78     box-shadow: 0 0 5px black;
     79     box-shadow:         0 0 5px black;
     80     font-family: Arial, sans-serif !important;
     81     font-size: 12pt !important;
     82     -webkit-animation-fill-mode: backwards;
     83 }
     84 
     85 .show-alt-infobar .content {
     86     display: inline-block !important;
     87 }
     88 
     89 .show-alt-infobar span {
     90     margin: 5px;
     91 }
     92 
     93 .show-alt-infobar button.link-button {
     94     -webkit-appearance: none !important;
     95     font: inherit !important;
     96     background: inherit !important;
     97     border: none !important;
     98     color: #1155CC !important;
     99     cursor: pointer !important;
    100     display: inline !important;
    101     margin: 0 !important;
    102     padding: 0 !important;
    103     text-decoration: none !important;
    104     box-shadow: none !important;
    105     text-transform: none !important;
    106     padding: none !important;
    107 }
    108 
    109 .show-alt-infobar button.link-button:hover,
    110 .show-alt-infobar button.link-button:focus {
    111     color: #1155CC;
    112     text-decoration: underline;
    113     outline: none;
    114 }
    115 
    116 .show-alt-infobar .controls {
    117     float: right !important;
    118     display: inline-block !important;
    119     padding-right: 5px !important;
    120 }
    121 
    122 .show-alt-infobar .close-button-gray:hover,
    123 .show-alt-infobar .close-button-gray:focus {
    124     background-position: -143px -96px !important;
    125     outline: none;
    126 }
    127 
    128 .show-alt-infobar .close-button-gray {
    129     -webkit-appearance: none !important;
    130     font: inherit !important;
    131     background: inherit !important;
    132     border: none !important;
    133     cursor: pointer !important;
    134     margin: 0 !important;
    135     padding: 0 !important;
    136     text-decoration: none !important;
    137     box-shadow: none !important;
    138     text-transform: none !important;
    139     padding: none !important;
    140     width: 13px !important;
    141     height: 13px !important;
    142     background-position: -175px -96px !important;
    143     background-image: url('chrome-extension://__MSG_@@extension_id__/images/statusbarButtonGlyphs.png') !important;
    144     background-size: 320px 144px !important;
    145     display: inline-block !important;
    146 }
    147