Alex Carpenter
ebb4d4e99f
* Updates <BrandedCta /> * Add <WhyBoundary /> section * Add <HowBoundaryWorks /> section * Updates <UseCases /> content * Adjust <HomepageHero /> content * Update <HowItWorks /> section * Content updates * Update icon directory * Update how it works title * Removes extra grid container * Adds lang attribute to document * Fix heading level usage * Content updates * Remove secure * Captialize works * Content update * Update use case links * Update background * CTA text * Convert ssh to svg * Convert to SVG * Coming soon to feature block
27 lines
690 B
React
27 lines
690 B
React
import LogoList from './logo-list'
|
|
import s from './feature.module.css'
|
|
import { useInView } from 'react-intersection-observer'
|
|
import { useState } from 'react'
|
|
|
|
export default function Feature({
|
|
title,
|
|
description,
|
|
logos,
|
|
onInViewStatusChanged,
|
|
}) {
|
|
const [ref, inView] = useInView({ threshold: 0.8 })
|
|
const [inViewStatus, setInViewStatus] = useState(false)
|
|
if (inView != inViewStatus) {
|
|
setInViewStatus(inView)
|
|
onInViewStatusChanged(inView)
|
|
}
|
|
|
|
return (
|
|
<div className={s.root} ref={ref}>
|
|
<h3 className="g-type-display-4">{title}</h3>
|
|
<p className="g-type-body">{description}</p>
|
|
{logos ? <LogoList logos={logos} /> : null}
|
|
</div>
|
|
)
|
|
}
|