VibeCoderzVibeCoderz
Telegram
All Prompts
Career History Card with Job List preview
cardlisttimelineresumeprofiletailwindiconresponsive

Career History Card with Job List

Карточка истории карьеры с списком работ. Отображает прошлые должности, компании и даты. Иконки для контекста. Для портфолио, резюме, профиля.

Prompt

<div class="bg-white/5 border-white/10 border rounded-2xl px-4 py-4">
              <div class="flex items-center gap-2">
                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="briefcase" class="lucide lucide-briefcase w-4 h-4 text-white/80"><path d="M16 20V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16" class=""></path><rect width="20" height="14" x="2" y="6" rx="2" class=""></rect></svg>
                <h3 class="text-xl font-semibold tracking-tight">Past jobs</h3>
              </div>
              <ul class="mt-3 space-y-3">
                <li class="flex items-start gap-3">
                  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="building-2" class="lucide lucide-building-2 w-4 h-4 text-white/70 mt-0.5"><path d="M6 22V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v18Z" class=""></path><path d="M6 12H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2" class=""></path><path d="M18 9h2a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-2" class=""></path><path d="M10 6h4" class=""></path><path d="M10 10h4" class=""></path><path d="M10 14h4" class=""></path><path d="M10 18h4" class=""></path></svg>
                  <div class="">
                    <p class="text-sm font-medium tracking-tight">Senior Product Designer • Atlas Analytics</p>
                    <p class="text-xs text-white/60">2022 — 2024 · Led design system and multi-tenant analytics</p>
                  </div>
                </li>
                <li class="flex items-start gap-3">
                  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="building-2" class="lucide lucide-building-2 w-4 h-4 text-white/70 mt-0.5"><path d="M6 22V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v18Z" class=""></path><path d="M6 12H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2" class=""></path><path d="M18 9h2a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-2" class=""></path><path d="M10 6h4" class=""></path><path d="M10 10h4" class=""></path><path d="M10 14h4" class=""></path><path d="M10 18h4" class=""></path></svg>
                  <div class="">
                    <p class="text-sm font-medium tracking-tight">Product Designer • Tempo Health</p>
                    <p class="text-xs text-white/60">2019 — 2022 · Care workflows, mobile companion app</p>
                  </div>
                </li>
                <li class="flex items-start gap-3">
                  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" data-lucide="building-2" class="lucide lucide-building-2 w-4 h-4 text-white/70 mt-0.5"><path d="M6 22V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v18Z" class=""></path><path d="M6 12H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2" class=""></path><path d="M18 9h2a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-2" class=""></path><path d="M10 6h4" class=""></path><path d="M10 10h4" class=""></path><path d="M10 14h4" class=""></path><path d="M10 18h4" class=""></path></svg>
                  <div>
                    <p class="text-sm font-medium tracking-tight">Frontend Engineer • Nexus Commerce</p>
                    <p class="text-xs text-white/60">2017 — 2019 · Storefront UI, performance, A/B testing</p>
                  </div>
                </li>
              </ul>
            </div>
All Prompts