Add mock data
This commit is contained in:
parent
f0d3a97107
commit
3f5439cb7d
|
@ -1,11 +1,27 @@
|
|||
import React from "react";
|
||||
|
||||
import TimelineSection from "./TimelineSection";
|
||||
interface TimelineData {
|
||||
time: string;
|
||||
text: string;
|
||||
}
|
||||
|
||||
interface TimelineProps {
|
||||
children: typeof TimelineSection;
|
||||
data: TimelineData[];
|
||||
/** Distance between consecutive nodes on timeline, in pixels */
|
||||
nodeGap?: number;
|
||||
/** Whether the time is transformed to uppercase */
|
||||
isTimeUppercase?: boolean;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
export default function Timeline(props: TimelineProps) {
|
||||
export default function Timeline({
|
||||
data,
|
||||
nodeGap = 40,
|
||||
isTimeUppercase = true,
|
||||
}: TimelineProps) {
|
||||
return <div></div>;
|
||||
}
|
||||
|
||||
function TimelineSection() {
|
||||
return <div></div>;
|
||||
}
|
||||
|
|
|
@ -1,5 +0,0 @@
|
|||
import React from "react";
|
||||
|
||||
export default function TimelineSection() {
|
||||
return <div></div>;
|
||||
}
|
|
@ -64,3 +64,30 @@ export const moreMockCategoricalData = [
|
|||
{ key: "Ada", value: 2.21 },
|
||||
{ key: "Dart", value: 2.21 },
|
||||
];
|
||||
|
||||
export const mockTimelineData = [
|
||||
{
|
||||
time: "Fall 2018",
|
||||
text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum",
|
||||
},
|
||||
{
|
||||
time: "Winter 2019",
|
||||
text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim venia",
|
||||
},
|
||||
{
|
||||
time: "Spring 2019",
|
||||
text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in volupta",
|
||||
},
|
||||
{
|
||||
time: "Fall 2020",
|
||||
text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum",
|
||||
},
|
||||
{
|
||||
time: "Winter 2020",
|
||||
text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit,",
|
||||
},
|
||||
{
|
||||
time: "Spring 2020",
|
||||
text: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in repre",
|
||||
},
|
||||
];
|
||||
|
|
|
@ -1,3 +1,4 @@
|
|||
import Timeline from "@/components/Timeline";
|
||||
import { BarGraphHorizontal, BarGraphVertical } from "components/BarGraph";
|
||||
import { mockCategoricalData, moreMockCategoricalData } from "data/mocks";
|
||||
import React from "react";
|
||||
|
@ -59,6 +60,7 @@ export default function Home() {
|
|||
value: word.value,
|
||||
}))}
|
||||
/>
|
||||
<Timeline data={mockTimelineData}/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue