mirror of
https://github.com/tabler/tabler.git
synced 2026-10-12 21:27:06 +04:00
49 lines
1.5 KiB
Plaintext
49 lines
1.5 KiB
Plaintext
---
|
|
import Avatar from '@ui/Avatar.astro'
|
|
import Icon from '@ui/Icon.astro'
|
|
import Button from '@ui/Button.astro'
|
|
import ButtonList from '@ui/ButtonList.astro'
|
|
import { people } from '@shared/lib/people'
|
|
import { requireIndex } from '@shared/lib/array'
|
|
|
|
const person = requireIndex(people, 3)
|
|
---
|
|
|
|
<!-- BEGIN HEADER PROFILE -->
|
|
<div class="page-header">
|
|
<div class="container">
|
|
<div class="row align-items-center">
|
|
<div class="col-auto">
|
|
<Avatar person={person} size="lg" />
|
|
</div>
|
|
<div class="col">
|
|
<h1 class="fw-bold m-0">{person.full_name}</h1>
|
|
<div class="my-2">Unemployed. Building a $1M solo business while traveling the world. Currently at $400k/yr.</div>
|
|
|
|
<div class="list-inline list-inline-dots text-secondary">
|
|
<div class="list-inline-item">
|
|
<Icon name="map" inline />
|
|
{person.university}, {person.country}
|
|
</div>
|
|
<div class="list-inline-item">
|
|
<Icon name="mail" inline />
|
|
<a href="#" class="text-reset">{person.email}</a>
|
|
</div>
|
|
<div class="list-inline-item">
|
|
<Icon name="cake" inline />
|
|
{person.birth_date}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto ms-auto">
|
|
<ButtonList>
|
|
<Button icon="dots" iconOnly text="More options" />
|
|
<Button icon="message" iconOnly text="Send message" />
|
|
<Button icon="check" color="primary" text="Following" />
|
|
</ButtonList>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- END HEADER PROFILE -->
|