fix visual nits

pull/37/head
e26chiu 3 months ago
parent 9e6f1e86d0
commit e346069421
  1. 12
      components/StackedBarGraph.module.css
  2. 14
      components/StackedBarGraph.tsx
  3. 4574
      package-lock.json

@ -14,11 +14,21 @@
}
.toolTip {
padding: 10px 0;
font-family: "Inconsolata", monospace;
font-weight: bold;
top: 0;
left: 0;
position: absolute;
background-color: var(--label);
color: var(--primary-background);
pointer-events: none;
border-radius: calc(10rem / 16);
padding: calc(10rem / 16);
}
.toolTip p {
margin: 0 5px;
font-size: calc(16rem / 16);
}
.key {

@ -59,13 +59,6 @@ export type StackedBarProps = {
itemMargin?: string;
};
const tooltipStyles = {
...defaultStyles,
minWidth: 60,
backgroundColor: Color.primaryAccentLighter,
color: Color.primaryBackground,
};
let tooltipTimeout: number;
export function StackedBarGraph({
@ -151,7 +144,7 @@ export function StackedBarGraph({
<GridColumns
scale={xScale}
height={yMax}
left={valueAxisLeftOffset}
left={xScale.bandwidth() / 2}
offset={xScale.bandwidth() / 2}
stroke={Color.tertiaryBackground}
strokeWidth={strokeWidth}
@ -211,7 +204,7 @@ export function StackedBarGraph({
<AxisBottom
top={yMax}
scale={xScale}
left={valueAxisLeftOffset / 5}
left={xScale.bandwidth() / 6}
hideTicks
hideAxisLine
labelProps={{
@ -224,6 +217,7 @@ export function StackedBarGraph({
/>
<AxisLeft
scale={yScale}
top={5}
numTicks={numTicksLeftAxis}
hideAxisLine
labelProps={{
@ -254,7 +248,7 @@ export function StackedBarGraph({
className={styles.toolTip}
top={tooltipTop}
left={tooltipLeft}
style={tooltipStyles}
unstyled
>
<p className={styles.key}>{tooltipData.key}</p>
<p>{tooltipData.bar.data[tooltipData.key]}</p>

4574
package-lock.json generated

File diff suppressed because it is too large Load Diff
Loading…
Cancel
Save