vue-timeline-chart/dist/style.css

Vue3 Timeline Chart component

[data-v-2779bce4]{box-sizing:border-box}.timeline-wrapper[data-v-2779bce4]{touch-action:pan-y;overflow:hidden;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;font-family:var(--font-family, inherit)}@media print{.timeline-wrapper[data-v-2779bce4]{color:#000;-webkit-print-color-adjust:exact;print-color-adjust:exact}}.item[data-v-2779bce4],.background[data-v-2779bce4],.marker[data-v-2779bce4]{contain:strict}.timestamp[data-v-2779bce4]{contain:layout paint style}.item[data-v-2779bce4],.background[data-v-2779bce4],.timestamp[data-v-2779bce4],.marker[data-v-2779bce4]{translate:var(--_left) 0;width:var(--_width);position:absolute;top:0;bottom:0}.marker[data-v-2779bce4]{background:var(--item-background, red);width:var(--item-marker-width, 1px);transform:translate(-50%)}.timestamps[data-v-2779bce4]{--_padding-block: var(--timestamp-padding-block, .2em);--_padding-inline: var(--timestamp-padding-inline, .4em);--_lineheight: var(--timestamp-line-height, 1.5em);height:calc(var(--_padding-block) * 2 + var(--_lineheight));line-height:var(--_lineheight);background:var(--timestamps-background, color-mix(in srgb, currentColor 5%, transparent));color:var(--timestamps-color, inherit)}.timestamps .timestamp[data-v-2779bce4]{padding:var(--_padding-block) var(--_padding-inline);position:absolute;height:100%;border-left:var(--gridline-border-left, 1px dashed color-mix(in srgb, currentColor 15%, transparent));z-index:0;font-size:.85em;white-space:nowrap}.timestamps .marker[data-v-2779bce4]{height:calc(var(--_lineheight) + var(--_padding-block) * 2)}.groups[data-v-2779bce4]{position:relative}.group[data-v-2779bce4]{border-top:var(--group-border-top, 1px solid color-mix(in srgb, currentColor 15%, transparent));padding-top:var(--group-padding-top, 0);padding-bottom:var(--group-padding-bottom, .4em);z-index:1;position:relative}.group .group-label[data-v-2779bce4]{padding:var(--label-padding, .2em .4em .4em);line-height:var(--label-line-height, 1em);font-size:.85em;color:var(--label-color, currentColor);background:var(--label-background, transparent);width:var(--label-width, auto)}.group .group-label.fixed[data-v-2779bce4]{position:absolute;top:0;bottom:0;z-index:1}.group .group-items[data-v-2779bce4]{position:relative;height:var(--group-items-height, 2em)}.item[data-v-2779bce4]{cursor:pointer;height:100%;background:var(--item-background, #007bff);opacity:.7}.item[data-v-2779bce4]:hover,.item.active[data-v-2779bce4]{opacity:1}.item.point[data-v-2779bce4]{--_size: var(--item-point-size, 1rem);height:var(--_size);width:var(--_size);border-radius:50%;top:50%;transform:translate(-50%,-50%)}.item.range[data-v-2779bce4]{border-radius:var(--item-range-border-radius, .5em)}.background[data-v-2779bce4]{background:var(--item-background, rgba(0, 0, 0, .1))}