mirror of
https://github.com/hanzo-apps/hanzo.ai.git
synced 2026-10-30 14:58:08 +00:00
zeekay
34f1b9fd63
Studio's model strip rendered after ProductLanding, so the page said "Open the canvas", listed related capabilities, then opened a gallery of six models. It is the landing's own section now, passed as the children ProductLanding renders before its closing card. ProductFooter stood on a 1024 measure under 896-wide blocks, its heading 38px left of theirs; it is a Band at 896.
52 lines
1.8 KiB
TypeScript
52 lines
1.8 KiB
TypeScript
'use client'
|
|
|
|
/**
|
|
* ProductFooter — the one block at the bottom of every product page: the
|
|
* product's name and line, its licence and repository, and the two ways to
|
|
* run it (Deploy to Cloud, Self-host). The site's closing call follows it.
|
|
*
|
|
* It used to be two blocks, "Open source" and then "Get <name>" with its own
|
|
* headline, so a product page ended on three headings in a row before the
|
|
* closing call's. One heading now, with the pills under it and the actions
|
|
* beside it from 768px, on the 896 measure the blocks above it stand on. The
|
|
* test ids the products audit reads (oss-attribution, deploy-block,
|
|
* deploy-cta) are the parts' own.
|
|
*/
|
|
|
|
import React from 'react'
|
|
import { YStack } from '@hanzo/ui'
|
|
import { Line } from '@/components/type'
|
|
import { Band } from '@/components/marketing/band'
|
|
import { getProductMetadata } from '@/lib/constants/products-metadata'
|
|
import { OssAttribution } from './OssAttribution'
|
|
import { DeployBlock } from './DeployBlock'
|
|
|
|
type Props = {
|
|
slug: string
|
|
name: string
|
|
}
|
|
|
|
export function ProductFooter({ slug, name }: Props) {
|
|
const meta = getProductMetadata(slug)
|
|
return (
|
|
<Band pad="$10" measure={896}>
|
|
<YStack gap={28} $md={{ flexDirection: 'row', items: 'center', justify: 'space-between' }}>
|
|
<YStack gap={12} shrink={1} minW={0}>
|
|
<Line render="h2" size="xl" weight="500" $md={{ fontSize: 'var(--text-2xl)', lineHeight: '1.3333' }}>
|
|
{`Get ${name}`}
|
|
</Line>
|
|
{meta?.tagline ? (
|
|
<Line render="p" size="sm" tone="muted">
|
|
{meta.tagline}
|
|
</Line>
|
|
) : null}
|
|
<OssAttribution slug={slug} meta={meta ?? undefined} />
|
|
</YStack>
|
|
<DeployBlock slug={slug} />
|
|
</YStack>
|
|
</Band>
|
|
)
|
|
}
|
|
|
|
export default ProductFooter
|