1/* Copyright (c) 2012 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.expandable-bubble { 6 -webkit-border-image: url('chrome://theme/IDR_APP_NOTIFICATION_SMALL_BUBBLE') 7 5 5 7 6 stretch; 8 -webkit-box-sizing: border-box; 9 -webkit-user-select: none; 10 border-width: 5px 5px 7px 6px; 11 color: #444; 12 cursor: pointer; 13 display: inline-block; 14 font-size: 12px; 15 position: absolute; 16 z-index: 1; 17} 18 19.expandable-bubble::after { 20 bottom: -1px; 21 content: url('chrome://theme/IDR_APP_NOTIFICATION_NUB'); 22 display: block; 23 height: 7px; 24 position: absolute; 25 right: 5px; /* TODO(finnur): Need to handle RTL properly. */ 26 width: 9px; 27} 28 29.expandable-bubble > .expandable-bubble-contents > .expandable-bubble-title { 30 display: inline-block; 31 margin-left: 1px; 32 margin-top : -3px; 33 overflow: hidden; 34 white-space: nowrap; 35} 36 37.expandable-bubble[masked] > .expandable-bubble-contents > 38 .expandable-bubble-title::after { 39 content: url('chrome://theme/IDR_APP_NOTIFICATION_NUB_MASK'); 40 display: block; 41 height: 15px; 42 overflow: hidden; 43 position: absolute; 44 right: 0; 45 top: 0; 46 width: 12px; 47} 48 49.expandable-bubble[expanded] > .expandable-bubble-contents > 50 .expandable-bubble-title { 51 font-size: 13px; 52 margin-bottom: 3px; 53 margin-left: 0; 54} 55 56.expandable-bubble-close { 57 height: 16px; 58 position: absolute; 59 right: 0; 60 top: 0; 61 width: 16px; 62 z-index: 2; 63} 64 65.expandable-bubble[expanded] { 66 padding: 3px; 67 z-index: 3; /* One higher then the close button on an unexpanded bubble. */ 68} 69 70.expandable-bubble[expanded] > .expandable-bubble-close { 71 z-index: 4; 72} 73 74.expandable-bubble-close { 75 background-image: -webkit-image-set( 76 url('../../../resources/default_100_percent/close_2.png') 1x, 77 url('../../../resources/default_200_percent/close_2.png') 2x); 78} 79 80.expandable-bubble-close:hover { 81 background-image: -webkit-image-set( 82 url('../../../resources/default_100_percent/close_2_hover.png') 1x, 83 url('../../../resources/default_200_percent/close_2_hover.png') 2x); 84} 85 86.expandable-bubble-close:active { 87 background-image: -webkit-image-set( 88 url('../../../resources/default_100_percent/close_2_pressed.png') 1x, 89 url('../../../resources/default_200_percent/close_2_pressed.png') 2x); 90} 91