mirror of
https://github.com/hanzo-apps/hanzo.ai.git
synced 2026-10-30 14:58:08 +00:00
zeekayandGitHub
7843241e3f
* style: the last inline styles are gui props, a kit member or @hanzo/ui
Owner rule, 2026-10-22: no style={…}, and no `inline-style:` exception.
hanzo-design.allow.json now allows 0 inline styles (from 36), 0 raw
font sizes (16), 0 raw z-indexes (1) and 42 raw colours (57).
- benchmarks/CodeRace: three lanes of hand-written divs are Lane, Track
and Dot on gui props; the hues are stated once and each wash and edge
is mixed from its hue.
- beta: the share card's picture is beta/card's Picture, used by the
share step and /beta/for/<topic>.
- /contact-sales: the options take @hanzo/ui Picker's `placeholder`
(8.29.31), which keeps the open list at full ink.
- components/code: each span says `data-code` and @hanzo/ui's new
styles/code.css inks it from the code theme; the dead Dracula
legibility pass goes with the per-token style.
- /analytics: the dashboard grows on a CSS view timeline (motion.css
`grow`) where framer wrote MotionValues per frame. A Band clips with
`overflow: clip`: `hidden` made it a scroller that never moves, and a
scroll-driven motion inside it stood half done.
- /buying-specialist: hovers and focus are hoverStyle and focusStyle
where handlers wrote them onto the element, and a reply's marks are
elements where they were HTML strings. A reply carries the name from
the address (`?name=`), which was parsed as HTML.
- ShareWidget's menu stands on --z-dropdown.
LLM.md drops the clause that allowed an `inline-style:` comment.
Claude-Session: https://claude.ai/code/session_015XYKLjZtDTJEnMo4eK3AFH
* gates/code: a block's spans say data-code and carry no style of their own
Claude-Session: https://claude.ai/code/session_015XYKLjZtDTJEnMo4eK3AFH
* CodeRace: each part of a row may shrink, as its div did; /contact-sales' Picker inks in $ink
A gui stack keeps its width where a div gave way, so at 390 the target
query and a lane's name pushed the race 136px past the window. The
sizes Picker's choice and list take $ink, as the page drew them.
Claude-Session: https://claude.ai/code/session_015XYKLjZtDTJEnMo4eK3AFH
* deps: @hanzo/ui 8.29.35 and @hanzo/design 0.5.39; code samples keep their faces
@hanzo/ui 8.29.35 marks a span's weight and slant as data-face
(codeFace), so a keyword stays bold and a comment italic with no style
on the span; 8.29.34's grow is useScroll's range exactly, and Picker's
`color` is the field's ink. @hanzo/design 0.5.39 passes no
`inline-style:` comment, and the count stays 0. The corner names
8.29.33's Plex Arabic face. The allowance's prose says the numbers it
holds (redeclared-token is 0 since the bar's rungs went).
Claude-Session: https://claude.ai/code/session_015XYKLjZtDTJEnMo4eK3AFH
* gui.css is the one @hanzo/ui 8.29.35 generates ($serif)
Claude-Session: https://claude.ai/code/session_015XYKLjZtDTJEnMo4eK3AFH
* deps: @hanzo/design stays 0.5.35
0.5.38's Arabic faces lead --font-sans with Noto Kufi Arabic, which
font.spec reads as the one binding moving; that bump is the
arabic-faces branch's to make. No inline-style comment is left, so the
zero holds under 0.5.39's rule whenever it lands.
Claude-Session: https://claude.ai/code/session_015XYKLjZtDTJEnMo4eK3AFH
42 lines
1.4 KiB
TypeScript
42 lines
1.4 KiB
TypeScript
'use client'
|
|
|
|
import { useEffect, useState } from 'react'
|
|
import { useRouter } from 'next/navigation'
|
|
import { Box, YStack } from '@hanzo/ui'
|
|
import { Action, Display, Eyebrow, Lede } from '@hanzo/ui/marketing'
|
|
import { useI18n } from '@hanzo/i18n/react'
|
|
import { Picture } from '@/components/beta/card'
|
|
import { HANZO, topic } from '@/lib/hanzo/topics'
|
|
|
|
/**
|
|
* The share page's body: the topic, its card, and the way on to /beta. Drawn into
|
|
* the export for a reader without scripts; a person with them is sent to /beta at
|
|
* once, with the query the link carried.
|
|
*/
|
|
export function Forward({ id }: { id: string }) {
|
|
const { t } = useI18n()
|
|
const router = useRouter()
|
|
const [query, setQuery] = useState('')
|
|
useEffect(() => {
|
|
const q = window.location.search
|
|
setQuery(q)
|
|
router.replace(`/beta${q}`)
|
|
}, [router])
|
|
const it = topic(id)!
|
|
return (
|
|
<Box minH="100vh" $platform-web={{ color: 'var(--foreground)' }}>
|
|
<YStack render="main" id="main" width="100%" maxW={720} mx="auto" px={16} py={64} gap={20}>
|
|
<Eyebrow>{it.group ? t('Beta · {group}', { group: t(it.group) }) : t('Beta')}</Eyebrow>
|
|
<Display>{it.id === HANZO ? t(it.title) : it.name}</Display>
|
|
<Lede>{t(it.line)}</Lede>
|
|
<Picture id={id} alt={it.name} rounded={14} />
|
|
<Box>
|
|
<Action fill href={`/beta${query}`}>
|
|
{t('Get early access')}
|
|
</Action>
|
|
</Box>
|
|
</YStack>
|
|
</Box>
|
|
)
|
|
}
|