Files
brk/website/styles/chart.css
2024-11-23 16:17:06 +01:00

84 lines
1.7 KiB
CSS

#charts {
display: flex;
flex-direction: column;
flex: 1;
min-height: 0;
padding: var(--main-padding);
header {
flex-shrink: 0;
display: flex;
white-space: nowrap;
overflow-x: auto;
padding-bottom: 1rem;
margin-bottom: -1rem;
padding-left: var(--main-padding);
margin-left: var(--negative-main-padding);
padding-right: var(--main-padding);
margin-right: var(--negative-main-padding);
& > * {
flex: 1;
}
}
> #legend {
display: flex;
align-items: center;
gap: 1.5rem;
margin: 1rem var(--negative-main-padding);
padding: 1rem var(--main-padding);
overflow-x: auto;
min-width: 0;
> div {
flex: 0;
display: flex;
align-items: center;
> label {
margin: -0.375rem 0;
color: var(--color);
&:has(input:not(:checked)) {
color: var(--off-color);
> span.main > span.name {
text-decoration-thickness: 1.5px;
text-decoration-color: var(--color);
text-decoration-line: line-through;
}
&:hover {
* {
color: var(--off-color) !important;
}
> span.main > span.name {
text-decoration-color: var(--orange) !important;
}
}
}
}
> a {
padding: 0.375rem;
margin: -0.375rem;
> svg {
/* padding: 0.375rem; */
margin: 0rem;
width: 1rem;
height: 1rem;
}
}
}
}
.chart-list {
margin-left: var(--negative-main-padding);
margin-right: calc(var(--negative-main-padding) - 0.5rem);
}
}