packages/optimise-ui/src/components/patientProfile/timeline.css
.react-calendar-timeline * {
box-sizing: border-box;
scroll-behavior: unset;
}
.react-calendar-timeline .rct-outer {
display: block;
overflow: hidden;
white-space: nowrap;
}
.react-calendar-timeline .rct-scroll {
display: inline-block;
white-space: normal;
vertical-align: top;
overflow-x: scroll;
overflow-y: hidden;
-ms-touch-action: none;
touch-action: none;
}
.react-calendar-timeline .rct-canvas {
position: relative;
}
.react-calendar-timeline .rct-item {
position: absolute;
box-sizing: border-box;
font-size: 12px;
color: white;
cursor: pointer;
z-index: 80;
}
.react-calendar-timeline .rct-item:hover {
z-index: 88;
}
.react-calendar-timeline .rct-calendar-header .rct-top-header,
.react-calendar-timeline .rct-calendar-header .rct-bottom-header {
position: relative;
}
.react-calendar-timeline .rct-calendar-header .rct-dateHeader {
position: absolute;
text-align: center;
cursor: pointer;
border-left: 1px solid #ddd;
color: #333333;
background: #f0f0f0;
border-bottom: 1px solid #ddd;
cursor: pointer;
height: 100%;
}
.react-calendar-timeline .rct-calendar-header .rct-dateHeader-primary {
color: var(--color-background);
background: hsl(var(--color-background-h), var(--color-background-s), 97%);
}
.react-calendar-timeline .rct-calendar-header .rct-dateHeader>span {
height: 100%;
line-height: 30px;
display: inline-block;
}
.react-calendar-timeline .rct-sidebar {
overflow: hidden;
white-space: normal;
display: inline-block;
vertical-align: top;
position: relative;
box-sizing: border-box;
border-right: 1px solid #ddd;
}
.react-calendar-timeline .rct-sidebar .rct-sidebar-row {
padding: 0 4px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
box-sizing: content-box;
margin: 0;
border-bottom: 1px solid #ddd;
}
.react-calendar-timeline .rct-sidebar .rct-sidebar-row.rct-sidebar-row-odd {
background: rgba(0, 0, 0, 0.04);
}
.react-calendar-timeline .rct-sidebar .rct-sidebar-row.rct-sidebar-row-even {
background: transparent;
}
.react-calendar-timeline .rct-vertical-lines .rct-vl {
position: absolute;
border-left: 1px solid #ddd;
z-index: 30;
}
.react-calendar-timeline .rct-vertical-lines .rct-vl.rct-vl-first {
border-left-width: 2px;
}
.react-calendar-timeline .rct-vertical-lines .rct-vl.rct-day-6,
.react-calendar-timeline .rct-vertical-lines .rct-vl.rct-day-0 {
background: rgba(225, 241, 250, 0.5);
}
.react-calendar-timeline .rct-horizontal-lines .rct-hl-even,
.react-calendar-timeline .rct-horizontal-lines .rct-hl-odd {
border-bottom: 1px solid #ddd;
box-sizing: content-box;
z-index: 40;
}
.react-calendar-timeline .rct-horizontal-lines .rct-hl-odd {
background: rgba(0, 0, 0, 0.04);
}
.react-calendar-timeline .rct-horizontal-lines .rct-hl-even {
background: transparent;
}