Timeline

Ang work-experience rail: patayong linya na may logo ng kumpanya sa bawat hinto, at card sa tabi ng bawat logo. Nasa ibaba ang tunay na component na pinakain ng placeholder na entries: sa live na page, ang tunay na employment record ang dala nito.

Ang rail

Kasalukuyan

Acme Studios

Mar 2024 - Kasalukuyan

Engineering Manager

Placeholder na role na nagpapakita ng anatomy ng card: isang linyang buod na napuputol pagkatapos ng ilang salita para manatiling madaling basahin ang row.

TypeScriptReact Native

Northwind Labs

Ene 2022 - Peb 2024

Senior Engineer

Mas naunang placeholder na role, may saradong hanay ng petsa at parehong compact na card.

TypeScriptReact Native

Anatomya

Isang bilog na logo ang nakaupo sa rail sa bawat kompanya, napapalibutan ng berde: 120 pixel sa desktop, 92 sa tablet, 48 sa isang telepono. Isang berdeng “Latest” na tag ang tumatakip sa itaas. Ang bawat card ay nagdadala ng kompanya sa berde, isang monospace na saklaw ng petsa, ang role, isang maikling buod at isang hanay ng mga tech chip; isang chevron ang nagmamarka rito bilang isang link. Sa isang telepono ang card ay compact sa logo, kompanya, role at petsa.

Sa sariling pahina ng isang kompanya ang logo dot ang direktang nag-aankla sa pamagat ng pahina: ang tanging lugar kung saan ang isang page heading ay iniiwan ang berdeng bar nito, dahil minamarkahan na ito ng dot.

Kailan gagamitin

Gawin

Gamitin ang timeline para sa isang pagkakasunod-sunod ng mga naka-petsang entry sa isang rail.

Huwag

Gamitin ang timeline para sa mga walang-ayos na item; iyon ay isang listahan.

Gawin

Panatilihin ang pinakabago sa itaas, sa ilalim ng Latest na tag.

Huwag

2 positions
Ipakita ang positions badge sa isang kompanyang may iisang role lamang.

Gawin

Hayaang ang bawat card ay isang link sa buong entry.

Huwag

Panatilihin ang berdeng bar sa isang detail na pahina kung saan nag-aankla na ang logo dot sa pamagat.

Kung saan ito matatagpuan

Timeline.astro at TimelineEntry.astro (.timeline, .timeline-card, .timeline-logo), na pinakakain mula sa data ng karanasan sa trabaho.

May dalawang kamag-anak ang wika ng rail. Ang series page ay may numerong vertical timeline ng mga bahagi nito — naka-link ang mga na-publish, naka-dim ang mga nakaplano kasama ang kanilang mga petsa. At ang CV page ay nagsasara sa education list: mga row ng kwalipikasyon na may institusyon, mga petsa at certificate link, hinihiwalay ng napakanipis na linya.