_tooltips.scss 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. // From Bootstrap v3.0.0
  2. .tooltip {
  3. position: absolute;
  4. z-index: 1030;
  5. display: block;
  6. font-size: 12px;
  7. line-height: 1.4;
  8. opacity: 0;
  9. visibility: visible;
  10. }
  11. .tooltip.in {
  12. opacity: 0.9;
  13. }
  14. .tooltip.top {
  15. padding: 5px 0;
  16. }
  17. .tooltip.right {
  18. padding: 0 5px;
  19. }
  20. .tooltip.bottom {
  21. padding: 5px 0;
  22. }
  23. .tooltip.left {
  24. padding: 0 5px;
  25. }
  26. .tooltip-inner {
  27. max-width: 200px;
  28. padding: 3px 8px;
  29. color: #fff;
  30. text-align: center;
  31. text-decoration: none;
  32. background-color: #000;
  33. border-radius: 4px;
  34. }
  35. .tooltip-arrow {
  36. position: absolute;
  37. width: 0;
  38. height: 0;
  39. border-color: transparent;
  40. border-style: solid;
  41. }
  42. .tooltip.top .tooltip-arrow {
  43. bottom: 0;
  44. left: 50%;
  45. margin-left: -5px;
  46. border-top-color: #000;
  47. border-width: 5px 5px 0;
  48. }
  49. .tooltip.top-left .tooltip-arrow {
  50. bottom: 0;
  51. left: 5px;
  52. border-top-color: #000;
  53. border-width: 5px 5px 0;
  54. }
  55. .tooltip.top-right .tooltip-arrow {
  56. right: 5px;
  57. bottom: 0;
  58. border-top-color: #000;
  59. border-width: 5px 5px 0;
  60. }
  61. .tooltip.right .tooltip-arrow {
  62. top: 50%;
  63. left: 0;
  64. margin-top: -5px;
  65. border-right-color: #000;
  66. border-width: 5px 5px 5px 0;
  67. }
  68. .tooltip.left .tooltip-arrow {
  69. top: 50%;
  70. right: 0;
  71. margin-top: -5px;
  72. border-left-color: #000;
  73. border-width: 5px 0 5px 5px;
  74. }
  75. .tooltip.bottom .tooltip-arrow {
  76. top: 0;
  77. left: 50%;
  78. margin-left: -5px;
  79. border-bottom-color: #000;
  80. border-width: 0 5px 5px;
  81. }
  82. .tooltip.bottom-left .tooltip-arrow {
  83. top: 0;
  84. left: 5px;
  85. border-bottom-color: #000;
  86. border-width: 0 5px 5px;
  87. }
  88. .tooltip.bottom-right .tooltip-arrow {
  89. top: 0;
  90. right: 5px;
  91. border-bottom-color: #000;
  92. border-width: 0 5px 5px;
  93. }