Home | History | Annotate | Download | only in css
      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