OLD | NEW |
(Empty) | |
| 1 /* Copyright (c) 2011 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 |
| 6 .expandable-bubble { |
| 7 position: absolute; |
| 8 } |
| 9 |
| 10 .expandable-bubble[expanded] { |
| 11 width: 300px; |
| 12 } |
| 13 |
| 14 .expandable-bubble-contents { |
| 15 color: black; |
| 16 left: 1px; |
| 17 line-height: 150%; |
| 18 padding: 6px 3px 5px 6px; |
| 19 position: relative; |
| 20 right: 1px; |
| 21 top: 1px; |
| 22 z-index: 3; |
| 23 } |
| 24 |
| 25 .expandable-bubble[expanded] > .expandable-bubble-close { |
| 26 z-index : 8; |
| 27 } |
| 28 .expandable-bubble[expanded] > .expandable-bubble-contents { |
| 29 z-index : 7; |
| 30 } |
| 31 .expandable-bubble[expanded] > .expandable-bubble-arrow { |
| 32 z-index : 6; |
| 33 } |
| 34 .expandable-bubble[expanded] > .expandable-bubble-shadow { |
| 35 z-index : 5; /* One higher then the close button on an unexpanded bubble. */ |
| 36 } |
| 37 |
| 38 .expandable-bubble-title { |
| 39 text-align: center; |
| 40 text-overflow: ellipsis; |
| 41 white-space: nowrap; |
| 42 } |
| 43 |
| 44 .expandable-bubble[expanded] > .expandable-bubble-contents > .expandable-bubble-
title { |
| 45 text-align: left; |
| 46 } |
| 47 |
| 48 .expandable-bubble-close { |
| 49 background-image: no-repeat 50% 50%; |
| 50 height: 16px; |
| 51 position: absolute; |
| 52 right: 6px; |
| 53 top: 6px; |
| 54 width: 16px; |
| 55 z-index: 4; |
| 56 } |
| 57 |
| 58 .expandable-bubble-close { |
| 59 background-image: url('chrome://theme/IDR_CLOSE_BAR'); |
| 60 } |
| 61 |
| 62 .expandable-bubble-close:hover { |
| 63 background-image: url('chrome://theme/IDR_CLOSE_BAR_H'); |
| 64 } |
| 65 |
| 66 .expandable-bubble-close:active { |
| 67 background-image: url('chrome://theme/IDR_CLOSE_BAR_P'); |
| 68 } |
| 69 |
| 70 .expandable-bubble-shadow { |
| 71 bottom: -2px; |
| 72 left: 0; |
| 73 position: absolute; |
| 74 right: 0; |
| 75 top: 0; |
| 76 z-index: 1; |
| 77 } |
| 78 |
| 79 .expandable-bubble-arrow { |
| 80 /* The tip of the arrow. */ |
| 81 border-bottom-right-radius: 1px; |
| 82 /* No border on the right or top (inner sides of the rotated square) because |
| 83 * it would overlap/darken the content shadow. */ |
| 84 border-right: none; |
| 85 border-top: none; |
| 86 bottom: -9px; |
| 87 height: 15px; |
| 88 position: absolute; |
| 89 right: 15px; |
| 90 width: 15px; |
| 91 z-index: 2; |
| 92 -webkit-transform: rotate(45deg); |
| 93 } |
| 94 |
| 95 .expandable-bubble-contents, |
| 96 .expandable-bubble-arrow { |
| 97 background: white; |
| 98 } |
| 99 |
| 100 .expandable-bubble-shadow, |
| 101 .expandable-bubble-arrow { |
| 102 border: 1px solid rgba(0, 0, 0, 0.3); |
| 103 -webkit-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.15); |
| 104 } |
| 105 |
| 106 .expandable-bubble-shadow, |
| 107 .expandable-bubble-contents { |
| 108 border-radius: 6px; |
| 109 box-sizing: border-box; |
| 110 } |
OLD | NEW |