Thành phần thương hiệu

Folio line

name · title · city between two ink hairlines, with the language switch.

Nội dung tham khảo viết bằng tiếng Anh; mục “Vietnamese” có ví dụ tiếng Việt.

Pham Do Nhat MinhAgentic Software EngineerHo Chi Minh City

Install

bash

npx shadcn add @eloquent/folio-line

Usage

tsx

import { FolioLine } from "@/components/ui/folio-line";

<FolioLine
  name="Pham Do Nhat Minh"
  title="Agentic Software Engineer"
  city="Ho Chi Minh City"
  languageSwitch={{ locale: "en", label: "Language", hrefFor: (locale) => `/${locale}` }}
/>

States

Name only

Pham Do Nhat MinhAgentic Software EngineerHo Chi Minh City

Narrow columnWraps onto two linesHo Chi Minh City

ENVI

State	Treatment
Full	name · title · city, then the switch
Without the switch	Omit `languageSwitch`
Narrow	Wraps; the switch moves to its own line

Keyboard

Key	Action
Tab	Moves to the language switch link; the rest is text
Enter	Opens the same page in the other locale

Vietnamese

Phạm Đỗ Nhật MinhKỹ sư phần mềm AgenticTP. Hồ Chí Minh