// eslint-disable-next-line @typescript-eslint/no-unused-vars
import React from 'react';
// import styled from 'styled-components';
// import Timeline from '../lib/Timeline/Timeline';
// import TimeItem from '../lib/Timeline/TimeItem';
// import SunIcon from '../static/icons/sunny.svg';
//
// const Wrap = styled.div`
//   display: flex;
//   flex-direction: column;
//   gap: 50px;
//   align-items: center;
// `;
//
// // 组件使用
// const Home: React.FC = () => {
//   return (
//     <Wrap>
//       <Timeline mode="left">
//         <TimeItem color="red">
//           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
//           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
//           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
//           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
//         </TimeItem>
//         <TimeItem color="green">
//           Lorem ipsum dolor sit amet, consectetur adipisicing elit.{' '}
//         </TimeItem>
//         <TimeItem color="blue">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </TimeItem>
//         <TimeItem color="orange">
//           Lorem ipsum dolor sit amet, consectetur adipisicing elit.{' '}
//         </TimeItem>
//         <TimeItem dotIcon={<SunIcon width="1em" height="1em" />}>
//           Lorem ipsum dolor sit amet, consectetur adipisicing elit.{' '}
//         </TimeItem>
//       </Timeline>
//       <Timeline mode="right">
//         <TimeItem color="red">
//           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
//           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
//           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
//           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
//         </TimeItem>
//         <TimeItem color="green">
//           Lorem ipsum dolor sit amet, consectetur adipisicing elit.{' '}
//         </TimeItem>
//         <TimeItem color="blue">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </TimeItem>
//         <TimeItem color="orange">
//           Lorem ipsum dolor sit amet, consectetur adipisicing elit.{' '}
//         </TimeItem>
//         <TimeItem dotIcon={<SunIcon width="1em" height="1em" />}>
//           Lorem ipsum dolor sit amet, consectetur adipisicing elit.{' '}
//         </TimeItem>
//       </Timeline>
//       <Timeline mode="alternate">
//         <TimeItem color="red">
//           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
//           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
//           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
//           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
//         </TimeItem>
//         <TimeItem color="green">
//           Lorem ipsum dolor sit amet, consectetur adipisicing elit.{' '}
//         </TimeItem>
//         <TimeItem color="blue">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </TimeItem>
//         <TimeItem color="orange">
//           Lorem ipsum dolor sit amet, consectetur adipisicing elit.{' '}
//         </TimeItem>
//         <TimeItem dotIcon={<SunIcon width="1em" height="1em" />}>
//           Lorem ipsum dolor sit amet, consectetur adipisicing elit.{' '}
//         </TimeItem>
//       </Timeline>
//     </Wrap>
//   );
// };
//
// export default Home;