source: trip-planner-front/node_modules/bootstrap/less/popovers.less@ eed0bf8

Last change on this file since eed0bf8 was fa375fe, checked in by Ema <ema_spirova@…>, 3 years ago

adding new components

  • Property mode set to 100644
File size: 3.4 KB
Line 
1//
2// Popovers
3// --------------------------------------------------
4
5
6.popover {
7 position: absolute;
8 top: 0;
9 left: 0;
10 z-index: @zindex-popover;
11 display: none;
12 max-width: @popover-max-width;
13 padding: 1px;
14 // Our parent element can be arbitrary since popovers are by default inserted as a sibling of their target element.
15 // So reset our font and text properties to avoid inheriting weird values.
16 .reset-text();
17 font-size: @font-size-base;
18 background-color: @popover-bg;
19 background-clip: padding-box;
20 border: 1px solid @popover-fallback-border-color;
21 border: 1px solid @popover-border-color;
22 border-radius: @border-radius-large;
23 .box-shadow(0 5px 10px rgba(0, 0, 0, .2));
24
25 // Offset the popover to account for the popover arrow
26 &.top { margin-top: -@popover-arrow-width; }
27 &.right { margin-left: @popover-arrow-width; }
28 &.bottom { margin-top: @popover-arrow-width; }
29 &.left { margin-left: -@popover-arrow-width; }
30
31 // Arrows
32 // .arrow is outer, .arrow:after is inner
33 > .arrow {
34 border-width: @popover-arrow-outer-width;
35
36 &,
37 &:after {
38 position: absolute;
39 display: block;
40 width: 0;
41 height: 0;
42 border-color: transparent;
43 border-style: solid;
44 }
45
46 &:after {
47 content: "";
48 border-width: @popover-arrow-width;
49 }
50 }
51
52 &.top > .arrow {
53 bottom: -@popover-arrow-outer-width;
54 left: 50%;
55 margin-left: -@popover-arrow-outer-width;
56 border-top-color: @popover-arrow-outer-fallback-color; // IE8 fallback
57 border-top-color: @popover-arrow-outer-color;
58 border-bottom-width: 0;
59 &:after {
60 bottom: 1px;
61 margin-left: -@popover-arrow-width;
62 content: " ";
63 border-top-color: @popover-arrow-color;
64 border-bottom-width: 0;
65 }
66 }
67 &.right > .arrow {
68 top: 50%;
69 left: -@popover-arrow-outer-width;
70 margin-top: -@popover-arrow-outer-width;
71 border-right-color: @popover-arrow-outer-fallback-color; // IE8 fallback
72 border-right-color: @popover-arrow-outer-color;
73 border-left-width: 0;
74 &:after {
75 bottom: -@popover-arrow-width;
76 left: 1px;
77 content: " ";
78 border-right-color: @popover-arrow-color;
79 border-left-width: 0;
80 }
81 }
82 &.bottom > .arrow {
83 top: -@popover-arrow-outer-width;
84 left: 50%;
85 margin-left: -@popover-arrow-outer-width;
86 border-top-width: 0;
87 border-bottom-color: @popover-arrow-outer-fallback-color; // IE8 fallback
88 border-bottom-color: @popover-arrow-outer-color;
89 &:after {
90 top: 1px;
91 margin-left: -@popover-arrow-width;
92 content: " ";
93 border-top-width: 0;
94 border-bottom-color: @popover-arrow-color;
95 }
96 }
97
98 &.left > .arrow {
99 top: 50%;
100 right: -@popover-arrow-outer-width;
101 margin-top: -@popover-arrow-outer-width;
102 border-right-width: 0;
103 border-left-color: @popover-arrow-outer-fallback-color; // IE8 fallback
104 border-left-color: @popover-arrow-outer-color;
105 &:after {
106 right: 1px;
107 bottom: -@popover-arrow-width;
108 content: " ";
109 border-right-width: 0;
110 border-left-color: @popover-arrow-color;
111 }
112 }
113}
114
115.popover-title {
116 padding: 8px 14px;
117 margin: 0; // reset heading margin
118 font-size: @font-size-base;
119 background-color: @popover-title-bg;
120 border-bottom: 1px solid darken(@popover-title-bg, 5%);
121 border-radius: (@border-radius-large - 1) (@border-radius-large - 1) 0 0;
122}
123
124.popover-content {
125 padding: 9px 14px;
126}
Note: See TracBrowser for help on using the repository browser.