mockups/pulse.html
Rama main · réplica de lectura del repositorio original.
<!DOCTYPE html>
<html lang="en" class="dark">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Pulse · mkappworks/cloudzilla — Cloudzilla</title>
<link rel="stylesheet" href="/assets/tailwind.css" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Geist+Mono:wght@400;500&family=Geist:wght@400;500;600&display=swap" rel="stylesheet" />
</head>
<body class="min-h-screen flex flex-col antialiased font-sans">
<a href="#main-content" class="skip-link">Skip to main content</a>
<div id="cz-header" data-repo-tab="code"></div>
<main id="main-content" tabindex="-1" class="max-w-[1400px] mx-auto px-6 pt-6 pb-20 flex-1 w-full">
<div class="space-y-8">
<section aria-labelledby="pulse-title">
<h1 id="pulse-title" class="text-2xl font-semibold tracking-tight">
Repository pulse
<span class="text-muted-foreground font-normal text-base font-mono">last 30 days</span>
</h1>
</section>
<section aria-labelledby="stats-heading">
<h2 id="stats-heading" class="sr-only">Activity counts</h2>
<div class="grid grid-cols-1 gap-3 sm:grid-cols-3">
<div class="rounded-md border border-border bg-card p-4 flex flex-col gap-3">
<p class="font-mono text-[10px] text-muted-foreground uppercase tracking-wider">Issues</p>
<div class="flex items-end justify-between gap-4">
<div class="space-y-1">
<div class="flex items-baseline gap-2">
<span class="text-2xl font-semibold tabular-nums text-success">14</span>
<span class="text-[11px] text-muted-foreground">opened</span>
</div>
<div class="flex items-baseline gap-2">
<span class="text-2xl font-semibold tabular-nums text-destructive">9</span>
<span class="text-[11px] text-muted-foreground">closed</span>
</div>
</div>
<div class="text-muted-foreground/50 shrink-0">
<svg width="80" height="32" viewBox="0 0 80 32" aria-hidden="true"><rect x="0.0" y="26.7" width="1.7" height="5.3" fill="currentColor"></rect><rect x="2.7" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect><rect x="5.3" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect><rect x="8.0" y="26.7" width="1.7" height="5.3" fill="currentColor"></rect><rect x="10.7" y="21.3" width="1.7" height="10.7" fill="currentColor"></rect><rect x="13.3" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect><rect x="16.0" y="16.0" width="1.7" height="16.0" fill="currentColor"></rect><rect x="18.7" y="5.3" width="1.7" height="26.7" fill="currentColor"></rect><rect x="21.3" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect><rect x="24.0" y="32.0" width="1.7" height="0.0" fill="currentColor"></rect><rect x="26.7" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect><rect x="29.3" y="32.0" width="1.7" height="0.0" fill="currentColor"></rect><rect x="32.0" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="34.7" y="16.0" width="1.7" height="16.0" fill="currentColor"></rect><rect x="37.3" y="21.3" width="1.7" height="10.7" fill="currentColor"></rect><rect x="40.0" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect><rect x="42.7" y="26.7" width="1.7" height="5.3" fill="currentColor"></rect><rect x="45.3" y="26.7" width="1.7" height="5.3" fill="currentColor"></rect><rect x="48.0" y="5.3" width="1.7" height="26.7" fill="currentColor"></rect><rect x="50.7" y="16.0" width="1.7" height="16.0" fill="currentColor"></rect><rect x="53.3" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect><rect x="56.0" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="58.7" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect><rect x="61.3" y="16.0" width="1.7" height="16.0" fill="currentColor"></rect><rect x="64.0" y="16.0" width="1.7" height="16.0" fill="currentColor"></rect><rect x="66.7" y="5.3" width="1.7" height="26.7" fill="currentColor"></rect><rect x="69.3" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="72.0" y="26.7" width="1.7" height="5.3" fill="currentColor"></rect><rect x="74.7" y="26.7" width="1.7" height="5.3" fill="currentColor"></rect><rect x="77.3" y="5.3" width="1.7" height="26.7" fill="currentColor"></rect></svg>
</div>
</div>
</div>
<div class="rounded-md border border-border bg-card p-4 flex flex-col gap-3">
<p class="font-mono text-[10px] text-muted-foreground uppercase tracking-wider">Pull requests</p>
<div class="flex items-end justify-between gap-4">
<div class="space-y-1">
<div class="flex items-baseline gap-2">
<span class="text-2xl font-semibold tabular-nums ">21</span>
<span class="text-[11px] text-muted-foreground">opened</span>
</div>
<div class="flex items-baseline gap-2">
<span class="text-2xl font-semibold tabular-nums text-[hsl(270_70%_70%)]">18</span>
<span class="text-[11px] text-muted-foreground">merged</span>
</div>
</div>
<div class="text-muted-foreground/50 shrink-0">
<svg width="80" height="32" viewBox="0 0 80 32" aria-hidden="true"><rect x="0.0" y="26.7" width="1.7" height="5.3" fill="currentColor"></rect><rect x="2.7" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="5.3" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect><rect x="8.0" y="16.0" width="1.7" height="16.0" fill="currentColor"></rect><rect x="10.7" y="5.3" width="1.7" height="26.7" fill="currentColor"></rect><rect x="13.3" y="32.0" width="1.7" height="0.0" fill="currentColor"></rect><rect x="16.0" y="5.3" width="1.7" height="26.7" fill="currentColor"></rect><rect x="18.7" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="21.3" y="32.0" width="1.7" height="0.0" fill="currentColor"></rect><rect x="24.0" y="26.7" width="1.7" height="5.3" fill="currentColor"></rect><rect x="26.7" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="29.3" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect><rect x="32.0" y="32.0" width="1.7" height="0.0" fill="currentColor"></rect><rect x="34.7" y="21.3" width="1.7" height="10.7" fill="currentColor"></rect><rect x="37.3" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="40.0" y="32.0" width="1.7" height="0.0" fill="currentColor"></rect><rect x="42.7" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="45.3" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="48.0" y="21.3" width="1.7" height="10.7" fill="currentColor"></rect><rect x="50.7" y="16.0" width="1.7" height="16.0" fill="currentColor"></rect><rect x="53.3" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect><rect x="56.0" y="5.3" width="1.7" height="26.7" fill="currentColor"></rect><rect x="58.7" y="16.0" width="1.7" height="16.0" fill="currentColor"></rect><rect x="61.3" y="5.3" width="1.7" height="26.7" fill="currentColor"></rect><rect x="64.0" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="66.7" y="16.0" width="1.7" height="16.0" fill="currentColor"></rect><rect x="69.3" y="16.0" width="1.7" height="16.0" fill="currentColor"></rect><rect x="72.0" y="5.3" width="1.7" height="26.7" fill="currentColor"></rect><rect x="74.7" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="77.3" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect></svg>
</div>
</div>
</div>
<div class="rounded-md border border-border bg-card p-4 flex flex-col gap-3">
<p class="font-mono text-[10px] text-muted-foreground uppercase tracking-wider">Commits</p>
<div class="flex items-end justify-between gap-4">
<div class="space-y-1">
<div class="flex items-baseline gap-2">
<span class="text-2xl font-semibold tabular-nums ">87</span>
<span class="text-[11px] text-muted-foreground">total</span>
</div>
<div class="flex items-baseline gap-2">
<span class="text-2xl font-semibold tabular-nums "></span>
<span class="text-[11px] text-muted-foreground"></span>
</div>
</div>
<div class="text-muted-foreground/50 shrink-0">
<svg width="80" height="32" viewBox="0 0 80 32" aria-hidden="true"><rect x="0.0" y="7.1" width="1.7" height="24.9" fill="currentColor"></rect><rect x="2.7" y="24.9" width="1.7" height="7.1" fill="currentColor"></rect><rect x="5.3" y="14.2" width="1.7" height="17.8" fill="currentColor"></rect><rect x="8.0" y="28.4" width="1.7" height="3.6" fill="currentColor"></rect><rect x="10.7" y="32.0" width="1.7" height="0.0" fill="currentColor"></rect><rect x="13.3" y="24.9" width="1.7" height="7.1" fill="currentColor"></rect><rect x="16.0" y="7.1" width="1.7" height="24.9" fill="currentColor"></rect><rect x="18.7" y="21.3" width="1.7" height="10.7" fill="currentColor"></rect><rect x="21.3" y="17.8" width="1.7" height="14.2" fill="currentColor"></rect><rect x="24.0" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect><rect x="26.7" y="17.8" width="1.7" height="14.2" fill="currentColor"></rect><rect x="29.3" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect><rect x="32.0" y="3.6" width="1.7" height="28.4" fill="currentColor"></rect><rect x="34.7" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect><rect x="37.3" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="40.0" y="14.2" width="1.7" height="17.8" fill="currentColor"></rect><rect x="42.7" y="3.6" width="1.7" height="28.4" fill="currentColor"></rect><rect x="45.3" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="48.0" y="10.7" width="1.7" height="21.3" fill="currentColor"></rect><rect x="50.7" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="53.3" y="21.3" width="1.7" height="10.7" fill="currentColor"></rect><rect x="56.0" y="14.2" width="1.7" height="17.8" fill="currentColor"></rect><rect x="58.7" y="32.0" width="1.7" height="0.0" fill="currentColor"></rect><rect x="61.3" y="17.8" width="1.7" height="14.2" fill="currentColor"></rect><rect x="64.0" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="66.7" y="24.9" width="1.7" height="7.1" fill="currentColor"></rect><rect x="69.3" y="14.2" width="1.7" height="17.8" fill="currentColor"></rect><rect x="72.0" y="3.6" width="1.7" height="28.4" fill="currentColor"></rect><rect x="74.7" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect><rect x="77.3" y="0.0" width="1.7" height="32.0" fill="currentColor"></rect></svg>
</div>
</div>
</div>
</div>
</section>
<section class="rounded-md border border-border bg-card" aria-labelledby="top-contrib">
<header class="px-4 py-3 border-b border-border flex items-center justify-between">
<h2 id="top-contrib" class="text-[13px] font-medium">Top contributors</h2>
<a href="contributors.html" class="text-[12px] text-muted-foreground hover:text-foreground">View all →</a>
</header>
<ul class="divide-y divide-border">
<li class="flex items-center gap-3 px-4 py-2.5">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="malith">M</span>
<span class="flex-1 font-medium text-[13px] truncate">malith</span>
<span class="font-mono text-[12px] font-semibold w-24 text-right">42 commits</span>
</li>
<li class="flex items-center gap-3 px-4 py-2.5">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="daisy">D</span>
<span class="flex-1 font-medium text-[13px] truncate">daisy</span>
<span class="font-mono text-[12px] font-semibold w-24 text-right">23 commits</span>
</li>
<li class="flex items-center gap-3 px-4 py-2.5">
<span class="inline-grid place-items-center rounded-full bg-muted border border-border font-medium text-muted-foreground h-6 w-6 text-[10px]" role="img" aria-label="yumi">Y</span>
<span class="flex-1 font-medium text-[13px] truncate">yumi</span>
<span class="font-mono text-[12px] font-semibold w-24 text-right">14 commits</span>
</li>
</ul>
</section>
</div>
</main>
<div id="cz-footer"></div>
<script src="shell.js"></script>
</body>
</html>