tools/side_chain_tool/web/node_modules/bootstrap/less/popovers.less

   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
  19   background-color: @popover-bg;
  20   background-clip: padding-box;
  21   border: 1px solid @popover-fallback-border-color;
  22   border: 1px solid @popover-border-color;
  23   border-radius: @border-radius-large;
  24   .box-shadow(0 5px 10px rgba(0,0,0,.2));
  25
  26   // Offset the popover to account for the popover arrow
  27   &.top     { margin-top: -@popover-arrow-width; }
  28   &.right   { margin-left: @popover-arrow-width; }
  29   &.bottom  { margin-top: @popover-arrow-width; }
  30   &.left    { margin-left: -@popover-arrow-width; }
  31 }
  32
  33 .popover-title {
  34   margin: 0; // reset heading margin
  35   padding: 8px 14px;
  36   font-size: @font-size-base;
  37   background-color: @popover-title-bg;
  38   border-bottom: 1px solid darken(@popover-title-bg, 5%);
  39   border-radius: (@border-radius-large - 1) (@border-radius-large - 1) 0 0;
  40 }
  41
  42 .popover-content {
  43   padding: 9px 14px;
  44 }
  45
  46 // Arrows
  47 //
  48 // .arrow is outer, .arrow:after is inner
  49
  50 .popover > .arrow {
  51   &,
  52   &:after {
  53     position: absolute;
  54     display: block;
  55     width: 0;
  56     height: 0;
  57     border-color: transparent;
  58     border-style: solid;
  59   }
  60 }
  61 .popover > .arrow {
  62   border-width: @popover-arrow-outer-width;
  63 }
  64 .popover > .arrow:after {
  65   border-width: @popover-arrow-width;
  66   content: "";
  67 }
  68
  69 .popover {
  70   &.top > .arrow {
  71     left: 50%;
  72     margin-left: -@popover-arrow-outer-width;
  73     border-bottom-width: 0;
  74     border-top-color: @popover-arrow-outer-fallback-color; // IE8 fallback
  75     border-top-color: @popover-arrow-outer-color;
  76     bottom: -@popover-arrow-outer-width;
  77     &:after {
  78       content: " ";
  79       bottom: 1px;
  80       margin-left: -@popover-arrow-width;
  81       border-bottom-width: 0;
  82       border-top-color: @popover-arrow-color;
  83     }
  84   }
  85   &.right > .arrow {
  86     top: 50%;
  87     left: -@popover-arrow-outer-width;
  88     margin-top: -@popover-arrow-outer-width;
  89     border-left-width: 0;
  90     border-right-color: @popover-arrow-outer-fallback-color; // IE8 fallback
  91     border-right-color: @popover-arrow-outer-color;
  92     &:after {
  93       content: " ";
  94       left: 1px;
  95       bottom: -@popover-arrow-width;
  96       border-left-width: 0;
  97       border-right-color: @popover-arrow-color;
  98     }
  99   }
 100   &.bottom > .arrow {
 101     left: 50%;
 102     margin-left: -@popover-arrow-outer-width;
 103     border-top-width: 0;
 104     border-bottom-color: @popover-arrow-outer-fallback-color; // IE8 fallback
 105     border-bottom-color: @popover-arrow-outer-color;
 106     top: -@popover-arrow-outer-width;
 107     &:after {
 108       content: " ";
 109       top: 1px;
 110       margin-left: -@popover-arrow-width;
 111       border-top-width: 0;
 112       border-bottom-color: @popover-arrow-color;
 113     }
 114   }
 115
 116   &.left > .arrow {
 117     top: 50%;
 118     right: -@popover-arrow-outer-width;
 119     margin-top: -@popover-arrow-outer-width;
 120     border-right-width: 0;
 121     border-left-color: @popover-arrow-outer-fallback-color; // IE8 fallback
 122     border-left-color: @popover-arrow-outer-color;
 123     &:after {
 124       content: " ";
 125       right: 1px;
 126       border-right-width: 0;
 127       border-left-color: @popover-arrow-color;
 128       bottom: -@popover-arrow-width;
 129     }
 130   }
 131 }