• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
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.bubble {
6  position: absolute;
7  white-space: normal;
8  /* Height is dynamic, width fixed. */
9  width: 300px;
10  z-index: 9999;
11}
12
13.bubble-content {
14  color: black;
15  line-height: 150%;
16  margin: 1px;
17  padding: 8px 11px 12px;
18  position: relative;
19  z-index: 3;
20}
21
22/* When the close button is there, we need more padding on the right of the
23 * bubble. */
24.bubble-close:not([hidden]) ~ .bubble-content {
25  -webkit-padding-end: 22px;
26}
27
28.bubble-close {
29  height: 16px;
30  position: absolute;
31  right: 6px;
32  top: 6px;
33  width: 16px;
34  z-index: 4;
35}
36
37html[dir='rtl'] .bubble-close {
38  left: 6px;
39  right: auto;
40}
41
42.bubble-close {
43  background-image: -webkit-image-set(
44      url('../../../resources/default_100_percent/close_2.png') 1x,
45      url('../../../resources/default_200_percent/close_2.png') 2x);
46}
47
48.bubble-close:hover {
49  background-image: -webkit-image-set(
50      url('../../../resources/default_100_percent/close_2_hover.png') 1x,
51      url('../../../resources/default_200_percent/close_2_hover.png') 2x);
52}
53
54.bubble-close:active {
55  background-image: -webkit-image-set(
56      url('../../../resources/default_100_percent/close_2_pressed.png') 1x,
57      url('../../../resources/default_200_percent/close_2_pressed.png') 2x);
58}
59
60.bubble-shadow {
61  bottom: 0;
62  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
63  left: 0;
64  position: absolute;
65  right: 0;
66  top: 0;
67  z-index: 1;
68}
69
70.bubble-arrow {
71  -webkit-transform: rotate(45deg);
72  box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.15);
73  height: 15px;
74  position: absolute;
75  width: 15px;
76  z-index: 2;
77}
78
79.bubble-content,
80.bubble-arrow {
81  background: white;
82}
83
84.bubble-shadow,
85.bubble-arrow {
86  border: 1px solid rgba(0, 0, 0, 0.3);
87}
88
89.bubble-shadow,
90.bubble-content {
91  border-radius: 6px;
92  box-sizing: border-box;
93}
94
95.auto-close-bubble {
96  position: fixed;
97}
98