Code review fixes
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
This commit is contained in:
parent
22af99d7ff
commit
4b3829894a
|
@ -12,7 +12,6 @@
|
|||
|
||||
.timelineSections {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
|
|
|
@ -9,8 +9,6 @@ interface TimelineData {
|
|||
|
||||
interface TimelineProps {
|
||||
data: TimelineData[];
|
||||
/** Width of the entire timeline, in pixels. */
|
||||
width: number;
|
||||
/** Whether the time is transformed to uppercase. */
|
||||
isTimeUppercase?: boolean;
|
||||
/** Width of the middle timeline line, in pixels */
|
||||
|
@ -30,7 +28,6 @@ interface TimelineProps {
|
|||
|
||||
export default function Timeline({
|
||||
data,
|
||||
width,
|
||||
isTimeUppercase = true,
|
||||
lineWidth = 5,
|
||||
outerCircleWidth = 30,
|
||||
|
@ -40,17 +37,9 @@ export default function Timeline({
|
|||
gap = 50,
|
||||
className,
|
||||
}: TimelineProps) {
|
||||
const largerMiddleElemeent =
|
||||
const largerMiddleElement =
|
||||
outerCircleWidth > lineWidth ? outerCircleWidth : lineWidth;
|
||||
const requestedWidth =
|
||||
timeWidth + gap + largerMiddleElemeent + gap + textWidth;
|
||||
if (requestedWidth > width) {
|
||||
throw new Error(
|
||||
`<Timeline /> - timeWidth + gap + ${
|
||||
outerCircleWidth > lineWidth ? "outerCircleWidth" : "lineWidth"
|
||||
} + gap + textWidth (${timeWidth} + ${gap} + ${largerMiddleElemeent} + ${gap} + ${textWidth} = ${requestedWidth}) is larger than width (${width})`
|
||||
);
|
||||
}
|
||||
const width = timeWidth + gap + largerMiddleElement + gap + textWidth;
|
||||
if (innerCircleWidth > outerCircleWidth) {
|
||||
throw new Error(
|
||||
`<Timeline /> - innerCircleWidth (${innerCircleWidth}) is larger than outerCircleWidth (${outerCircleWidth})`
|
||||
|
|
|
@ -68,7 +68,7 @@ export default function Home() {
|
|||
<h2>
|
||||
<code>{"<Timeline />"}</code>
|
||||
</h2>
|
||||
<Timeline data={mockTimelineData} width={800} />
|
||||
<Timeline data={mockTimelineData} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue