← Back to branch summary

~bac/charmworld/readme-mega

« back to all changes in this revision

Viewing changes to charmworld/static/css/bootstrap/tooltip.less

  • Committer: Brad Crittenden
  • Date: 2013-09-09 19:01:30 UTC
  • mfrom: (386.1.7 readme)
  • Revision ID: bac@canonical.com-20130909190130-2javw980984xnjo6
Charmworld redesign.  Support bundle README files.

Show diffs side-by-side

added added

removed removed

Lines of Context:
charmworld/static/css/bootstrap/tooltip.less
1
 
//
2
 
// Tooltips
3
 
// --------------------------------------------------
4
 
 
5
 
 
6
 
// Base class
7
 
.tooltip {
8
 
  position: absolute;
9
 
  z-index: @zindexTooltip;
10
 
  display: block;
11
 
  visibility: visible;
12
 
  padding: 5px;
13
 
  font-size: 11px;
14
 
  .opacity(0);
15
 
  &.in     { .opacity(80); }
16
 
  &.top    { margin-top:  -3px; }
17
 
  &.right  { margin-left:  3px; }
18
 
  &.bottom { margin-top:   3px; }
19
 
  &.left   { margin-left: -3px; }
20
 
}
21
 
 
22
 
// Wrapper for the tooltip content
23
 
.tooltip-inner {
24
 
  max-width: 200px;
25
 
  padding: 3px 8px;
26
 
  color: @tooltipColor;
27
 
  text-align: center;
28
 
  text-decoration: none;
29
 
  background-color: @tooltipBackground;
30
 
  .border-radius(@baseBorderRadius);
31
 
}
32
 
 
33
 
// Arrows
34
 
.tooltip-arrow {
35
 
  position: absolute;
36
 
  width: 0;
37
 
  height: 0;
38
 
  border-color: transparent;
39
 
  border-style: solid;
40
 
}
41
 
.tooltip {
42
 
  &.top .tooltip-arrow {
43
 
    bottom: 0;
44
 
    left: 50%;
45
 
    margin-left: -@tooltipArrowWidth;
46
 
    border-width: @tooltipArrowWidth @tooltipArrowWidth 0;
47
 
    border-top-color: @tooltipArrowColor;
48
 
  }
49
 
  &.right .tooltip-arrow {
50
 
    top: 50%;
51
 
    left: 0;
52
 
    margin-top: -@tooltipArrowWidth;
53
 
    border-width: @tooltipArrowWidth @tooltipArrowWidth @tooltipArrowWidth 0;
54
 
    border-right-color: @tooltipArrowColor;
55
 
  }
56
 
  &.left .tooltip-arrow {
57
 
    top: 50%;
58
 
    right: 0;
59
 
    margin-top: -@tooltipArrowWidth;
60
 
    border-width: @tooltipArrowWidth 0 @tooltipArrowWidth @tooltipArrowWidth;
61
 
    border-left-color: @tooltipArrowColor;
62
 
  }
63
 
  &.bottom .tooltip-arrow {
64
 
    top: 0;
65
 
    left: 50%;
66
 
    margin-left: -@tooltipArrowWidth;
67
 
    border-width: 0 @tooltipArrowWidth @tooltipArrowWidth;
68
 
    border-bottom-color: @tooltipArrowColor;
69
 
  }
70
 
}