List

The List component displays a section with a list of blog items.

Props

The List component accepts the following props:

blogItems (array of BlogItem, required): An array of blog items to be displayed in the list.

BlogItem:

• imageSrc (string, required): The image source URL for the blog item.

• title (string, required): The title of the blog item.

• link (string, required): The link URL for the blog item.

• description (string, required): The description of the blog item.

Usage Example

<List blogItems={[
  {
    imageSrc: './images/blog/blog-01.png',
    title: 'Free advertising for your online business',
    link: 'blog-single.html',
    description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit convallis tortor.',
  },
  {
    imageSrc: './images/blog/blog-02.png',
    title: '9 simple ways to improve your design skills',
    link: 'bog-single.html',
    description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit convallis tortor.',
  },
  {
    imageSrc: './images/blog/blog-03.png',
    title: 'Tips to quickly improve your coding speed.',
    link: 'blog-single.html',
    description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit convallis tortor.',
  },
]} />

In the example above, the List component is used to display a section with a list of blog items. The blogItems prop is passed an array of BlogItem objects containing the details of each blog item. You can customize the content of the list by modifying the data passed to the blogItems prop.