import * as React from "react"
import { Container, ListLayout } from "@/components"
import * as styles from "./index.module.scss"

interface IProps {
  educationValue: EducationValue[]
}

const EducationValue: React.FC<IProps> = props => {
  const { educationValue } = props
  return (
    <div className={styles.educationValue}>
      <Container>
        <ListLayout listData={educationValue}>
          {(item: EducationValue) => (
            <div className={styles.inner}>
              <div className={styles.logo}>
                <img src={item.icon} alt={item.title} />
              </div>
              <h3>{item.title}</h3>
              <h5 dangerouslySetInnerHTML={{ __html: item.describe }}></h5>
            </div>
          )}
        </ListLayout>
      </Container>
    </div>
  )
}

export default EducationValue