mirror of
https://github.com/misode/misode.github.io.git
synced 2026-04-23 07:10:41 +00:00
Add guides (#224)
* Add guides * Add versioning to guides * Guides: special variables and nested expressions * Add guides page to vite build * Add search and hash hooks, guide tags and headings * Improve guides list and filtering * Add 1.19 download link
This commit is contained in:
25
src/app/components/GuideCard.tsx
Normal file
25
src/app/components/GuideCard.tsx
Normal file
@@ -0,0 +1,25 @@
|
||||
import { ChangelogTag } from './versions'
|
||||
|
||||
interface Props {
|
||||
title: string,
|
||||
link: string,
|
||||
versions: string[],
|
||||
tags: string[],
|
||||
activeTags?: string[],
|
||||
toggleTag?: (tag: string) => unknown,
|
||||
}
|
||||
export function GuideCard({ title, link, versions, tags, activeTags, toggleTag }: Props) {
|
||||
const onToggleTag = (tag: string) => (e: MouseEvent) => {
|
||||
if (toggleTag) toggleTag(tag)
|
||||
e.preventDefault()
|
||||
e.stopImmediatePropagation()
|
||||
}
|
||||
|
||||
return <a class="guide-card" href={link} >
|
||||
<span class="guide-versions">{versions.join(' • ')}</span>
|
||||
<h3>{title}</h3>
|
||||
<div class="guide-tags">
|
||||
{tags.sort().map(tag => <ChangelogTag label={tag} onClick={onToggleTag(tag)} active={activeTags?.includes(tag)} />)}
|
||||
</div>
|
||||
</a>
|
||||
}
|
||||
Reference in New Issue
Block a user