react-timelane 0.0.1 → 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Timelane.d.ts +15 -0
- package/dist/components/TimelaneAside.d.ts +13 -0
- package/dist/components/TimelaneBackground.d.ts +5 -0
- package/dist/components/TimelaneBody.d.ts +6 -0
- package/dist/components/{TimelineBody.d.ts → TimelaneBodyInner.d.ts} +5 -2
- package/dist/components/{TimelineHeader/TimelineHeader.d.ts → TimelaneHeader/TimelaneHeader.d.ts} +2 -2
- package/dist/components/{TimelineHeader → TimelaneHeader}/index.d.ts +1 -1
- package/dist/components/TimelaneSelectionLayer.d.ts +6 -0
- package/dist/components/TimelaneSettingsContext.d.ts +7 -0
- package/dist/components/TimelaneSettingsProvider.d.ts +7 -0
- package/dist/components/{TimelineWrapper.d.ts → TimelaneWrapper.d.ts} +5 -2
- package/dist/components/core/CoreItem/CoreItemComponent.d.ts +2 -2
- package/dist/components/core/CoreSwimlane/CoreSwimlane.d.ts +1 -1
- package/dist/components/layout/TimelaneLayout.d.ts +23 -0
- package/dist/hooks/useTimelaneContext.d.ts +1 -0
- package/dist/index.d.ts +9 -9
- package/dist/react-timelane.css +1 -1
- package/dist/react-timelane.js +959 -1002
- package/dist/types/{TimelineSettings.d.ts → TimelaneSettings.d.ts} +1 -1
- package/dist/types/index.d.ts +1 -1
- package/package.json +1 -1
- package/vite.config.ts +1 -1
- package/dist/components/TimelineAside.d.ts +0 -13
- package/dist/components/TimelineBackground.d.ts +0 -5
- package/dist/components/TimelineSelectionLayer.d.ts +0 -6
- package/dist/components/TimelineSettingsContext.d.ts +0 -7
- package/dist/components/TimelineSettingsProvider.d.ts +0 -7
- package/dist/components/layout/TimelineLayout.d.ts +0 -23
- package/dist/hooks/useTimelineContext.d.ts +0 -1
- /package/dist/components/{TimelineHeader → TimelaneHeader}/DaysHeader.d.ts +0 -0
- /package/dist/components/{TimelineHeader → TimelaneHeader}/MonthsHeader.d.ts +0 -0
- /package/dist/components/{TimelineHeader → TimelaneHeader}/WeeksHeader.d.ts +0 -0
- /package/dist/components/{TimelineHeader → TimelaneHeader}/renderingUtils.d.ts +0 -0
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { PropsWithChildren } from 'react';
|
|
2
|
+
import { CoreSwimlane, TimelaneBody, TimelaneLayout } from '..';
|
|
3
|
+
import { TimelaneHeader } from './TimelaneHeader/TimelaneHeader';
|
|
4
|
+
import { TimelaneBackground } from './TimelaneBackground';
|
|
5
|
+
import { TimelaneAside } from './TimelaneAside';
|
|
6
|
+
export declare function Timelane({ children }: PropsWithChildren): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export declare namespace Timelane {
|
|
8
|
+
var Container: typeof Timelane;
|
|
9
|
+
var Header: typeof TimelaneHeader;
|
|
10
|
+
var Body: typeof TimelaneBody;
|
|
11
|
+
var Background: typeof TimelaneBackground;
|
|
12
|
+
var Aside: typeof TimelaneAside;
|
|
13
|
+
var Lane: typeof CoreSwimlane;
|
|
14
|
+
var Layout: typeof TimelaneLayout;
|
|
15
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { MouseEvent, ReactElement } from 'react';
|
|
2
|
+
import { SwimlaneT } from '../types';
|
|
3
|
+
interface TimelaneAsideProps {
|
|
4
|
+
lanes: SwimlaneT[];
|
|
5
|
+
focusedLane?: SwimlaneT | null;
|
|
6
|
+
setFocusedLane?: (lane: SwimlaneT | null) => void;
|
|
7
|
+
onLaneHeaderClick?: (lane: SwimlaneT, e: MouseEvent) => void;
|
|
8
|
+
onLaneHeaderDoubleClick?: (lane: SwimlaneT, e: MouseEvent) => void;
|
|
9
|
+
onLaneHeaderContextMenu?: (lane: SwimlaneT, e: MouseEvent) => void;
|
|
10
|
+
renderLaneHeader?: (lane: SwimlaneT) => ReactElement;
|
|
11
|
+
}
|
|
12
|
+
export declare function TimelaneAside({ lanes, focusedLane, setFocusedLane, onLaneHeaderClick, onLaneHeaderDoubleClick, onLaneHeaderContextMenu, renderLaneHeader, }: TimelaneAsideProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export {};
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { PropsWithChildren } from 'react';
|
|
2
|
+
interface TimelaneBodyProps {
|
|
3
|
+
onSelect?: (selection: number[]) => void;
|
|
4
|
+
}
|
|
5
|
+
export declare function TimelaneBody({ onSelect, children, }: PropsWithChildren<TimelaneBodyProps>): import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export {};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { MouseEvent, ReactElement } from 'react';
|
|
2
2
|
import { AvailableSpace, CoreItem, SwimlaneT } from '../types';
|
|
3
|
-
interface
|
|
3
|
+
interface TimelaneBodyInnerProps<T> {
|
|
4
4
|
lanes: SwimlaneT[];
|
|
5
5
|
items: CoreItem<T>[];
|
|
6
6
|
renderItem?: (item: CoreItem<T>, isDragged: boolean) => ReactElement;
|
|
@@ -9,5 +9,8 @@ interface TimelineBodyProps<T> {
|
|
|
9
9
|
onLaneDoubleClick?: (lane: SwimlaneT, when: Date, availableSpace: AvailableSpace | null, e: MouseEvent) => void;
|
|
10
10
|
onLaneContextMenu?: (lane: SwimlaneT, when: Date, e: MouseEvent) => void;
|
|
11
11
|
}
|
|
12
|
-
|
|
12
|
+
/**
|
|
13
|
+
* @deprecated The component should not be used
|
|
14
|
+
*/
|
|
15
|
+
export declare function TimelaneBodyInner<T>({ lanes, items, renderItem, onItemUpdate, onLaneClick, onLaneDoubleClick, onLaneContextMenu, }: TimelaneBodyInnerProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
13
16
|
export {};
|
package/dist/components/{TimelineHeader/TimelineHeader.d.ts → TimelaneHeader/TimelaneHeader.d.ts}
RENAMED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { MouseEvent, ReactElement } from 'react';
|
|
2
|
-
interface
|
|
2
|
+
interface TimelaneHeaderProps {
|
|
3
3
|
focusedDay?: Date | null;
|
|
4
4
|
setFocusedDay?: (day: Date | null) => void;
|
|
5
5
|
renderMonthHeader?: (firstDay: Date, lastDay: Date) => ReactElement;
|
|
@@ -20,5 +20,5 @@ interface TimelineHeaderProps {
|
|
|
20
20
|
e: MouseEvent;
|
|
21
21
|
}) => void;
|
|
22
22
|
}
|
|
23
|
-
export declare function
|
|
23
|
+
export declare function TimelaneHeader({ focusedDay, setFocusedDay, renderMonthHeader, renderWeekHeader, renderDayHeader, onMonthClick, onDayClick, onWeekClick, }: TimelaneHeaderProps): import("react/jsx-runtime").JSX.Element;
|
|
24
24
|
export {};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export { DaysHeader } from './DaysHeader';
|
|
2
2
|
export { WeeksHeader } from './WeeksHeader';
|
|
3
3
|
export { MonthsHeader } from './MonthsHeader';
|
|
4
|
-
export {
|
|
4
|
+
export { TimelaneHeader } from './TimelaneHeader';
|
|
5
5
|
export { renderDayHeader, renderMonthHeader, renderWeekHeader, } from './renderingUtils';
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { PropsWithChildren } from 'react';
|
|
2
|
+
interface TimelaneSelectionLayerProps {
|
|
3
|
+
onSelect: (selection: number[]) => void;
|
|
4
|
+
}
|
|
5
|
+
export declare function TimelaneSelectionLayer({ children, onSelect, }: PropsWithChildren<TimelaneSelectionLayerProps>): import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export {};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Dispatch, SetStateAction } from 'react';
|
|
2
|
+
import { TimelaneSettings } from '../types/TimelaneSettings';
|
|
3
|
+
export interface TimelaneContextOuter {
|
|
4
|
+
settings: TimelaneSettings;
|
|
5
|
+
setSettings: Dispatch<SetStateAction<TimelaneSettings>>;
|
|
6
|
+
}
|
|
7
|
+
export declare const TimelaneSettingsContext: import('react').Context<TimelaneContextOuter>;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { PropsWithChildren } from 'react';
|
|
2
|
+
import { TimelaneSettings } from '../types/TimelaneSettings';
|
|
3
|
+
interface TimelaneSettingsProviderProps {
|
|
4
|
+
settings: TimelaneSettings;
|
|
5
|
+
}
|
|
6
|
+
export declare const TimelaneSettingsProvider: ({ settings: _settings, children, }: PropsWithChildren<TimelaneSettingsProviderProps>) => import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export {};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { PropsWithChildren } from 'react';
|
|
2
2
|
import { SwimlaneT } from '../types';
|
|
3
|
-
interface
|
|
3
|
+
interface TimelaneWrapperProps {
|
|
4
4
|
focusedDay?: Date | null;
|
|
5
5
|
focusedSwimlane?: SwimlaneT | null;
|
|
6
6
|
start?: Date;
|
|
@@ -13,5 +13,8 @@ interface TimelineWrapperProps {
|
|
|
13
13
|
allowOverlaps?: boolean;
|
|
14
14
|
focusedDate?: Date | null;
|
|
15
15
|
}
|
|
16
|
-
|
|
16
|
+
/**
|
|
17
|
+
* @deprecated The component should not be used
|
|
18
|
+
*/
|
|
19
|
+
export default function TimelaneWrapper({ children, start, end, pixelsPerDay, pixelsPerResource, showMonths, showWeeks, showDays, allowOverlaps, focusedDate, }: PropsWithChildren<TimelaneWrapperProps>): import("react/jsx-runtime").JSX.Element;
|
|
17
20
|
export {};
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { PropsWithChildren } from 'react';
|
|
2
|
-
import { CoreItem, Position, SwimlaneT,
|
|
2
|
+
import { CoreItem, Position, SwimlaneT, TimelaneSettings } from '../../../types';
|
|
3
3
|
interface CoreItemComponentProps<T> {
|
|
4
4
|
item: CoreItem<T>;
|
|
5
5
|
swimlane: SwimlaneT;
|
|
6
|
-
settings:
|
|
6
|
+
settings: TimelaneSettings;
|
|
7
7
|
onDragStart: (grabPosition: Position, relativeGrabPosition: Position) => void;
|
|
8
8
|
onDrop: () => void;
|
|
9
9
|
onDrag: () => void;
|
|
@@ -12,5 +12,5 @@ interface CoreSwimlaneProps<T> {
|
|
|
12
12
|
renderItem?: (item: CoreItem<T>, isDragged: boolean) => ReactElement;
|
|
13
13
|
onResizeStart?: (data: T) => void;
|
|
14
14
|
}
|
|
15
|
-
export
|
|
15
|
+
export declare function CoreSwimlane<T>({ swimlane, items, focused, onItemUpdate, onMouseUp, onClick, onDoubleClick, onContextMenu, renderItem, onResizeStart, }: CoreSwimlaneProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
16
16
|
export {};
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { PropsWithChildren } from 'react';
|
|
2
|
+
export declare function TimelaneLayout({ children }: PropsWithChildren<{}>): import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
export declare namespace TimelaneLayout {
|
|
4
|
+
var Header: typeof TimelaneLayoutHeader;
|
|
5
|
+
var Body: typeof TimelaneLayoutBody;
|
|
6
|
+
var Background: typeof TimelaneLayoutBackground;
|
|
7
|
+
var Footer: typeof TimelaneLayoutFooter;
|
|
8
|
+
var Aside: typeof TimelaneLayoutAside;
|
|
9
|
+
var Corner: typeof TimelaneLayoutCorner;
|
|
10
|
+
}
|
|
11
|
+
declare function TimelaneLayoutHeader({ children }: PropsWithChildren<{}>): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
declare function TimelaneLayoutBackground({ children }: PropsWithChildren<{}>): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
declare function TimelaneLayoutBody({ children }: PropsWithChildren<{}>): import("react/jsx-runtime").JSX.Element;
|
|
14
|
+
declare function TimelaneLayoutFooter({ children }: PropsWithChildren<{}>): import("react/jsx-runtime").JSX.Element;
|
|
15
|
+
interface TimelaneLayoutAsideProps {
|
|
16
|
+
side?: "left" | "right";
|
|
17
|
+
}
|
|
18
|
+
declare function TimelaneLayoutAside({ side, children, }: PropsWithChildren<TimelaneLayoutAsideProps>): import("react/jsx-runtime").JSX.Element;
|
|
19
|
+
interface TimelaneLayoutCornerProps {
|
|
20
|
+
corner?: "top left" | "top right" | "bottom left" | "bottom right";
|
|
21
|
+
}
|
|
22
|
+
declare function TimelaneLayoutCorner({ corner, children, }: PropsWithChildren<TimelaneLayoutCornerProps>): import("react/jsx-runtime").JSX.Element;
|
|
23
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const useTimelaneContext: () => import('../components/TimelaneSettingsContext').TimelaneContextOuter;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
export {
|
|
2
|
-
export {
|
|
3
|
-
export {
|
|
4
|
-
export
|
|
5
|
-
export {
|
|
6
|
-
export {
|
|
7
|
-
export {
|
|
8
|
-
export
|
|
1
|
+
export { TimelaneLayout } from './components/layout/TimelaneLayout';
|
|
2
|
+
export { TimelaneAside } from './components/TimelaneAside';
|
|
3
|
+
export { TimelaneBackground } from './components/TimelaneBackground';
|
|
4
|
+
export { CoreSwimlane } from './components/core/CoreSwimlane/CoreSwimlane';
|
|
5
|
+
export { TimelaneBody } from './components/TimelaneBody';
|
|
6
|
+
export { Timelane } from './components/Timelane';
|
|
7
|
+
export { TimelaneSettingsProvider } from './components/TimelaneSettingsProvider';
|
|
8
|
+
export * from './components/TimelaneHeader';
|
|
9
9
|
export * from './types';
|
|
10
10
|
export * from './components/core/utils';
|
|
11
11
|
export * from './components/core/CoreSwimlane/utils';
|
|
12
12
|
export { useScroll } from './hooks/useScroll';
|
|
13
|
-
export {
|
|
13
|
+
export { useTimelaneContext } from './hooks/useTimelaneContext';
|
package/dist/react-timelane.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
.timelane-layout{position:relative;width:100%;height:100%;overflow:auto}.timelane-layout .timelane-layout-inner{position:relative;width:fit-content;height:fit-content;display:grid;grid-template-areas:"corner-tl header corner-tr" "aside-l body aside-r" "corner-bl footer corner-br"}.timelane-layout .timelane-layout-inner .timelane-layout-header,.timelane-layout .timelane-layout-inner .timelane-layout-footer,.timelane-layout .timelane-layout-inner .timelane-layout-aside,.timelane-layout .timelane-layout-inner .timelane-layout-corner{background:#fff}.timelane-layout .timelane-layout-inner .timelane-layout-header{grid-area:header;position:sticky;position:-webkit-sticky;top:0;z-index:101;overflow:hidden}.timelane-layout .timelane-layout-inner .timelane-layout-body{grid-area:body;z-index:100}.timelane-layout .timelane-layout-inner .timelane-layout-background{grid-area:body;z-index:-1}.timelane-layout .timelane-layout-inner .timelane-layout-footer{grid-area:footer;position:sticky;position:-webkit-sticky;bottom:0;z-index:101;border-top:1px solid lightgray}.timelane-layout .timelane-layout-inner .timelane-layout-aside{grid-area:aside-l;position:sticky;position:-webkit-sticky;left:0;z-index:101}.timelane-layout .timelane-layout-inner .timelane-layout-aside.timelane-layout-aside-right{grid-area:aside-r;right:0;left:initial;border-left:1px solid lightgray}.timelane-layout .timelane-layout-inner .timelane-layout-corner{position:sticky;position:-webkit-sticky;z-index:102}.timelane-layout .timelane-layout-inner .timelane-layout-corner.timelane-layout-corner-top-left{grid-area:corner-tl;top:0;left:0;border-bottom:1px solid lightgray;border-right:1px solid lightgray}.timelane-layout .timelane-layout-inner .timelane-layout-corner.timelane-layout-corner-top-right{grid-area:corner-tr;top:0;right:0;border-bottom:1px solid lightgray;border-left:1px solid lightgray}.timelane-layout .timelane-layout-inner .timelane-layout-corner.timelane-layout-corner-bottom-left{grid-area:corner-bl;bottom:0;left:0;border-top:1px solid lightgray;border-right:1px solid lightgray}.timelane-layout .timelane-layout-inner .timelane-layout-corner.timelane-layout-corner-bottom-right{grid-area:corner-br;bottom:0;right:0;border-top:1px solid lightgray;border-left:1px solid lightgray}*{box-sizing:border-box}.timelane{--timelane-aside-width: 150px;--timelane-border-color-light: #f0f0f0;--timelane-border-color-normal: lightgray;--timelane-border-color-dark: gray;--timelane-highlight-color: #f8f8f8;--timelane-focused-color: rgba(0, 0, 255, .1);--timelane-hover-color: rgba(0, 0, 0, .05);overflow:auto;position:relative;width:100%;height:100%;border-left:1px solid var(--timelane-border-color-normal)}.timelane .timelane-header{top:0;z-index:101;background:#fff}.timelane .timelane-header .timelane-header-months{display:flex;flex-flow:row nowrap}.timelane .timelane-header .timelane-header-months .timelane-header-month-label{border-right:1px solid var(--timelane-border-color-normal);border-bottom:1px solid var(--timelane-border-color-normal);overflow:hidden;font-size:1em;height:30px;line-height:30px;text-align:center;cursor:pointer}.timelane .timelane-header .timelane-header-months .timelane-header-month-label:hover{background:var(--timelane-hover-color)}.timelane .timelane-header .timelane-header-weeks{display:flex;flex-flow:row nowrap}.timelane .timelane-header .timelane-header-weeks .timelane-header-week-label{border-right:1px solid var(--timelane-border-color-normal);border-bottom:1px solid var(--timelane-border-color-normal);overflow:hidden;font-size:1em;height:30px;line-height:30px;text-align:center;cursor:pointer}.timelane .timelane-header .timelane-header-weeks .timelane-header-week-label:hover{background:var(--timelane-hover-color)}.timelane .timelane-header .timelane-header-days{display:flex;flex-flow:row nowrap}.timelane .timelane-header .timelane-header-days .timelane-header-day-label{border-right:1px solid var(--timelane-border-color-normal);border-bottom:1px solid var(--timelane-border-color-normal);overflow:hidden;font-size:.8em;height:20px;line-height:20px;text-align:center;cursor:pointer}.timelane .timelane-header .timelane-header-days .timelane-header-day-label:hover{background:var(--timelane-hover-color)}.timelane .timelane-header .timelane-header-days .timelane-header-day-label.timelane-header-day-label-focused{background:var(--timelane-focused-color)}.timelane .timelane-header-corner{z-index:102;background:#fff;border-right:1px solid var(--timelane-border-color-normal);border-bottom:1px solid var(--timelane-border-color-normal)}.timelane .timelane-body{z-index:99;position:relative;width:fit-content}.timelane .timelane-body .timelane-swimlane{border-color:var(--timelane-border-color-normal)!important;border-top:1px solid gray;border-bottom:1px solid gray;margin-top:-1px;overflow:hidden}.timelane .timelane-body .timelane-swimlane .timelane-drop-target{position:relative;width:100%;height:100%}.timelane .timelane-body .timelane-swimlane .timelane-drop-target .timelane-item{position:absolute;cursor:pointer;border-radius:3px;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.timelane .timelane-body .timelane-swimlane .timelane-drop-target .timelane-item.timelane-item-marked .timelane-allocation{border:2px dashed rgba(0,0,0,.5)}.timelane .timelane-body .timelane-swimlane .timelane-drop-target .timelane-item .timelane-item-drag-handle{height:100%}.timelane .timelane-body .timelane-swimlane .timelane-drop-target .timelane-item .timelane-item-resize-handle{background:#bed7dc;border-radius:5px;top:4px!important;bottom:4px!important;height:auto!important;width:6px!important;z-index:2;background:transparent!important;transition:.2s}.timelane .timelane-body .timelane-swimlane .timelane-drop-target .timelane-item .timelane-item-resize-handle:hover{background:#0000001a!important}.timelane .timelane-body .timelane-swimlane .timelane-drop-target .timelane-item .timelane-item-resize-handle.timelane-item-resize-handle-left{left:0!important;margin-left:1px}.timelane .timelane-body .timelane-swimlane .timelane-drop-target .timelane-item .timelane-item-resize-handle.timelane-item-resize-handle-right{right:0!important}.timelane .timelane-body .timelane-swimlane .timelane-drop-target .timelane-item .timelane-allocation{background:#92a8d1;border-radius:2px;border:2px solid transparent;height:calc(100% - 1px);overflow:hidden;cursor:pointer;padding:0 4px;margin-left:1px;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;container-type:size;container-name:timelane-allocation}.timelane .timelane-body .timelane-swimlane .timelane-drop-target .timelane-item .timelane-allocation .timelane-allocation-title{font-weight:700;transform-origin:top left;line-height:30px;white-space:nowrap}@container timelane-allocation (max-height: 30px){.timelane .timelane-body .timelane-swimlane .timelane-drop-target .timelane-item .timelane-allocation .timelane-allocation-title{margin:0}}.timelane .timelane-body .timelane-swimlane .timelane-drop-target .timelane-item .timelane-allocation.timelane-allocation-selected{border:2px dashed rgba(0,0,0,.5)}.timelane .timelane-body .timelane-swimlane .timelane-drop-target .timelane-item.dragging{opacity:0}.timelane .timelane-body .timelane-swimlane .timelane-drop-target .timelane-drop-preview{background:#00f;position:absolute;border-radius:2px;color:#fff}.timelane .timelane-body .timelane-swimlane.timelane-row-focused{background:var(--timelane-focused-color)}.timelane .timelane-aside{border-right:1px solid var(--timelane-border-color-normal);width:var(--timelane-aside-width);background:#fff}.timelane .timelane-aside .timelane-aside-swimlane-header{border:1px solid var(--timelane-border-color-normal);border-right:none;border-left:none;margin-top:-1px;padding:10px;overflow:hidden;position:relative;cursor:pointer}.timelane .timelane-aside .timelane-aside-swimlane-header.timelane-aside-swimlane-header-focused{background:var(--timelane-focused-color)}.timelane .timelane-aside .timelane-aside-swimlane-header:hover .timelane-aside-resource-menu{opacity:1}.timelane .timelane-aside .timelane-aside-swimlane-header .timelane-aside-resource-menu{position:absolute;top:5px;right:5px;opacity:0;transition:.15s}.timelane .timelane-aside .timelane-aside-swimlane-header .timelane-aside-resource-menu.timelane-aside-resource-menu-open{opacity:1}.timelane .timelane-background{position:relative;width:100%;height:100%}.timelane .timelane-background .timelane-background-inner{display:flex;flex-flow:row nowrap;height:100%}.timelane .timelane-background .timelane-background-inner .timelane-background-day-label{border-right:1px solid var(--timelane-border-color-light);overflow:hidden;font-size:.8em;height:100%;z-index:-100}.timelane .timelane-background .timelane-background-inner .timelane-background-day-label.timelane-background-day-label-sunday{border-right:1px solid var(--timelane-border-color-normal)}.timelane .timelane-background .timelane-background-inner .timelane-background-day-label.timelane-background-day-label-focused{background:var(--timelane-focused-color)}.timelane .timelane-background .timelane-background-inner .timelane-background-focused-day-position{position:absolute;height:100%;background:var(--timelane-focused-color);z-index:-101}.timelane-header-tooltip,.timelane-header-day-tooltip{font-size:2em}
|