Browse Source

Rework pointing / basic label for more accurate arrows

pull/2850/head
Jack Lukic 9 years ago
parent
commit
b7667cfa5c
2 changed files with 34 additions and 2 deletions
  1. 28
      src/definitions/elements/label.less
  2. 8
      src/themes/default/elements/label.variables

28
src/definitions/elements/label.less

@ -1171,6 +1171,34 @@ a.ui.basic.label:hover {
left: auto; left: auto;
} }
/* Basic Pointing */
/*--- Above ---*/
.ui.basic.pointing.label:before,
.ui.basic.pointing.above.label:before {
top: @basicPointingTriangleOffset;
}
/*--- Below ---*/
.ui.basic.pointing.bottom.label:before,
.ui.basic.pointing.below.label:before {
top: auto;
margin-left: @basicPointingTriangleOffset;
bottom: @basicPointingTriangleOffset;
}
/*--- Left ---*/
.ui.basic.pointing.left.label:before {
top: 50%;
margin-top: @basicPointingTriangleOffset;
}
/*--- Right ---*/
.ui.basic.pointing.right.label:before {
top: 50%;
margin-top: @basicPointingTriangleOffset;
right: @basicPointingTriangleOffset;
}
/*------------------ /*------------------
Floating Label Floating Label
-------------------*/ -------------------*/

8
src/themes/default/elements/label.variables

@ -218,14 +218,18 @@
/* Pointing */ /* Pointing */
@pointingBorderColor: inherit; @pointingBorderColor: inherit;
@pointingBorderWidth: @borderWidth;
@pointingVerticalDistance: 1em; @pointingVerticalDistance: 1em;
@pointingTriangleSize: 0.6em;
@pointingTriangleSize: 0.6666em;
@pointingHorizontalDistance: @pointingTriangleSize; @pointingHorizontalDistance: @pointingTriangleSize;
@pointingTriangleOffset: ~"calc("(-@pointingTriangleSize / 2)~" - "@borderWidth~")";
@pointingTriangleOffset: -@pointingTriangleSize / 2;
@pointingTriangleTransition: background @labelTransitionDuration @labelTransitionEasing; @pointingTriangleTransition: background @labelTransitionDuration @labelTransitionEasing;
@pointingTriangleZIndex: 2; @pointingTriangleZIndex: 2;
/* Basic Pointing */
@basicPointingTriangleOffset: ~"calc("(-@pointingTriangleSize / 2)~" - "@pointingBorderWidth~")";
/* Floating */ /* Floating */
@floatingTopOffset: -1em; @floatingTopOffset: -1em;
@floatingLeftOffset: -1.5em; @floatingLeftOffset: -1.5em;

Loading…
Cancel
Save