Odyssey styleguide

Tool tip

Toggle example guides Toggle HTML markup

<insert-markup>components.tooltip-</insert-markup>

The average number of touchpoints within a customer journey of which the respective traffic source is a part of.

.odyssey-tooltip--bottom-left

bottom left

<insert-markup>components.tooltip-0</insert-markup>

The average number of touchpoints within a customer journey of which the respective traffic source is a part of.

.odyssey-tooltip--bottom-middle

bottom middle

<insert-markup>components.tooltip-1</insert-markup>

The average number of touchpoints within a customer journey of which the respective traffic source is a part of.

.odyssey-tooltip--bottom-right

bottom right

<insert-markup>components.tooltip-2</insert-markup>

The average number of touchpoints within a customer journey of which the respective traffic source is a part of.

.odyssey-tooltip--top-left

top left

<insert-markup>components.tooltip-3</insert-markup>

The average number of touchpoints within a customer journey of which the respective traffic source is a part of.

.odyssey-tooltip--top-middle

top middle

<insert-markup>components.tooltip-4</insert-markup>

The average number of touchpoints within a customer journey of which the respective traffic source is a part of.

.odyssey-tooltip--top-right

top right

<insert-markup>components.tooltip-5</insert-markup>

The average number of touchpoints within a customer journey of which the respective traffic source is a part of.

.odyssey-tooltip--left-top

left top

<insert-markup>components.tooltip-6</insert-markup>

The average number of touchpoints within a customer journey of which the respective traffic source is a part of.

.odyssey-tooltip--left-middle

left middle

<insert-markup>components.tooltip-7</insert-markup>

The average number of touchpoints within a customer journey of which the respective traffic source is a part of.

.odyssey-tooltip--left-bottom

left bottom

<insert-markup>components.tooltip-8</insert-markup>

The average number of touchpoints within a customer journey of which the respective traffic source is a part of.

.odyssey-tooltip--right-top

right top

<insert-markup>components.tooltip-9</insert-markup>

The average number of touchpoints within a customer journey of which the respective traffic source is a part of.

.odyssey-tooltip--right-middle

right middle

<insert-markup>components.tooltip-10</insert-markup>

The average number of touchpoints within a customer journey of which the respective traffic source is a part of.

.odyssey-tooltip--right-bottom

right bottom

<insert-markup>components.tooltip-11</insert-markup>

The average number of touchpoints within a customer journey of which the respective traffic source is a part of.

Markup

<div class="odyssey-tooltip [modifier class]">
	<p>The average number of touchpoints within a customer journey of which the respective traffic source is a part of. </p>
</div>

Source: src/components/tooltip.less, line 4