| /* Copyright (c) 2012 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. */ |
| |
| .expandable-bubble { |
| -webkit-border-image: url(chrome://theme/IDR_APP_NOTIFICATION_SMALL_BUBBLE) |
| 5 5 7 6 stretch; |
| -webkit-box-sizing: border-box; |
| border-width: 5px 5px 7px 6px; |
| color: #444; |
| cursor: pointer; |
| display: inline-block; |
| font-size: 12px; |
| position: absolute; |
| user-select: none; |
| z-index: 1; |
| } |
| |
| .expandable-bubble::after { |
| bottom: -1px; |
| content: url(chrome://theme/IDR_APP_NOTIFICATION_NUB); |
| display: block; |
| height: 7px; |
| position: absolute; |
| right: 5px; /* TODO(finnur): Need to handle RTL properly. */ |
| width: 9px; |
| } |
| |
| .expandable-bubble > .expandable-bubble-contents > .expandable-bubble-title { |
| display: inline-block; |
| margin-left: 1px; |
| margin-top : -3px; |
| overflow: hidden; |
| white-space: nowrap; |
| } |
| |
| .expandable-bubble[masked] > .expandable-bubble-contents > |
| .expandable-bubble-title::after { |
| content: url(chrome://theme/IDR_APP_NOTIFICATION_NUB_MASK); |
| display: block; |
| height: 15px; |
| overflow: hidden; |
| position: absolute; |
| right: 0; |
| top: 0; |
| width: 12px; |
| } |
| |
| .expandable-bubble[expanded] > .expandable-bubble-contents > |
| .expandable-bubble-title { |
| font-size: 13px; |
| margin-bottom: 3px; |
| margin-left: 0; |
| } |
| |
| .expandable-bubble-close { |
| height: 16px; |
| position: absolute; |
| right: 0; |
| top: 0; |
| width: 16px; |
| z-index: 2; |
| } |
| |
| .expandable-bubble[expanded] { |
| padding: 3px; |
| z-index: 3; /* One higher then the close button on an unexpanded bubble. */ |
| } |
| |
| .expandable-bubble[expanded] > .expandable-bubble-close { |
| z-index: 4; |
| } |
| |
| .expandable-bubble-close { |
| background-image: -webkit-image-set( |
| url(../../../resources/default_100_percent/close_2.png) 1x, |
| url(../../../resources/default_200_percent/close_2.png) 2x); |
| } |
| |
| .expandable-bubble-close:hover { |
| background-image: -webkit-image-set( |
| url(../../../resources/default_100_percent/close_2_hover.png) 1x, |
| url(../../../resources/default_200_percent/close_2_hover.png) 2x); |
| } |
| |
| .expandable-bubble-close:active { |
| background-image: -webkit-image-set( |
| url(../../../resources/default_100_percent/close_2_pressed.png) 1x, |
| url(../../../resources/default_200_percent/close_2_pressed.png) 2x); |
| } |