41b8fac464
* Initial structure for updated homepage * Bring back <UseCases /> * Add section stubs * Add ecosystem section * Add features section * Iron out features section * Add Learn Callout section * Copy updates * Better together copy * Add updated copy & swap assets * Remove comment & just add existing icon for now * Copy and asset tweaks * Remove unwanted copy * Process the codeblock * Add transparent img * Swap for transparent img * More transparent img * Use Learn cards pattern * Rearrange img and finishing padding touches
29 lines
745 B
TypeScript
29 lines
745 B
TypeScript
import BeforeAfterDiagram from './before-after-diagram'
|
|
import s from './style.module.css'
|
|
|
|
export default function StaticDynamicDiagram({
|
|
heading,
|
|
description,
|
|
diagrams,
|
|
}) {
|
|
return (
|
|
<div className={s.staticDynamic}>
|
|
<div className={s.content}>
|
|
<h2 className={s.heading}>{heading}</h2>
|
|
{description && <p className={s.description}>{description}</p>}
|
|
</div>
|
|
<BeforeAfterDiagram
|
|
{...diagrams}
|
|
beforeImage={{
|
|
format: 'png',
|
|
url: '/img/static-dynamic-diagram/consul_static_isometric@2x.png',
|
|
}}
|
|
afterImage={{
|
|
format: 'png',
|
|
url: '/img/static-dynamic-diagram/consul_dynamic_isometric@2x.png',
|
|
}}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|