Skip to content

Commit

Permalink
touchup: turn score into a square
Browse files Browse the repository at this point in the history
so that it's consistent with other indicators.
the score-pie is still a circle.
  • Loading branch information
keyserj committed Nov 1, 2024
1 parent c7a9fa1 commit 844877e
Show file tree
Hide file tree
Showing 2 changed files with 3 additions and 3 deletions.
5 changes: 3 additions & 2 deletions src/web/topic/components/Score/PieChart.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -49,8 +49,9 @@ export const PieChart = ({ onClick, customData, startAngle, type = "regular" }:
data={data}
// Radius is relative to viewbox size [100, 100]; so 50 means diameter 100 means take up the whole svg space.
// Radius should be 45 if we want to scale(1.1) so that there's space within the svg to scale
// Radius should be 50 if we don't need to scale, and want the pie to take the whole svg space
radius={type === "regular" ? 45 : 50}
// Radius should be 63 if we don't need to scale, and want the pie to actually be a square
// -> 50 makes it a circle, 70+ makes a square, 63 makes for a square with roughly ~4px border radius, trying to match a button's radius
radius={type === "regular" ? 45 : 63}
label={({ dataEntry }) => (type === "regular" ? dataEntry.key : undefined)}
labelStyle={() => ({
fontSize: "14", // is relative to viewbox size [100, 100]
Expand Down
1 change: 0 additions & 1 deletion src/web/topic/components/Score/ScoreButton.styles.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -23,5 +23,4 @@ export const StyledButton = styled(Button, buttonOptions)<StyledButtonProps>`
}}
padding: 0px;
border-radius: 50%;
`;

0 comments on commit 844877e

Please sign in to comment.