45 lines
1.4 KiB
TypeScript
45 lines
1.4 KiB
TypeScript
import React from "react";
|
|
import clsx from "clsx";
|
|
import styles from "./styles.module.css";
|
|
import { ServiceDescription, sections, services } from "@site/src/services";
|
|
|
|
function Service({ title, Svg, description }: ServiceDescription) {
|
|
return (
|
|
<div className={clsx("col col--4 service")}>
|
|
<div className="text--center">
|
|
<Svg className={styles.featureSvg} role="img" />
|
|
</div>
|
|
<div className="text--center padding-horiz--md">
|
|
<h3>{title}</h3>
|
|
<p>{description}</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default function HomepageFeatures(): JSX.Element {
|
|
return (
|
|
<section className={styles.features}>
|
|
<div className="container">
|
|
<h1 className={styles.featureHeader}>Services that we provide</h1>
|
|
{Object.entries(sections).map(
|
|
([sectionKind, { title, description }]) => {
|
|
return (
|
|
<>
|
|
<h2 className={styles.featureHeader}>{title}</h2>
|
|
<h3 className={styles.featureSubHeader}>{description}</h3>
|
|
<div className={clsx("row", styles.row)}>
|
|
{services
|
|
.filter((service) => service.sectionKind === sectionKind)
|
|
.map((props, idx) => (
|
|
<Service key={idx} {...props} />
|
|
))}
|
|
</div>
|
|
</>
|
|
);
|
|
}
|
|
)}
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|