catime 0.2.0__py3-none-any.whl → 0.4.0__py3-none-any.whl

catime/__init__.py

@@ -1,3 +1,3 @@
 """catime - AI-generated hourly cat images."""
 
-__version__ = "0.2.0"
+__version__ = "0.3.0"

catime/cli.py

@@ -64,14 +64,48 @@ def filter_by_query(cats: list[dict], query: str) -> list[dict]:
     return []
 
 
+def cmd_view(args):
+    """Serve the cat gallery locally in a browser."""
+    import http.server
+    import functools
+    import threading
+    import webbrowser
+
+    docs_dir = Path(__file__).resolve().parent / "docs"
+    if not docs_dir.exists():
+        # Fallback: project root docs/
+        docs_dir = Path(__file__).resolve().parent.parent.parent / "docs"
+    if not docs_dir.exists():
+        print("Error: docs/ directory not found.", file=sys.stderr)
+        sys.exit(1)
+
+    port = args.port
+    handler = functools.partial(http.server.SimpleHTTPRequestHandler, directory=str(docs_dir))
+    server = http.server.HTTPServer(("127.0.0.1", port), handler)
+    url = f"http://127.0.0.1:{port}"
+    print(f"Serving cat gallery at {url}")
+    threading.Timer(0.5, lambda: webbrowser.open(url)).start()
+    try:
+        server.serve_forever()
+    except KeyboardInterrupt:
+        print("\nStopped.")
+
+
 def main():
+    # Handle 'view' subcommand separately to avoid argparse conflicts
+    if len(sys.argv) >= 2 and sys.argv[1] == "view":
+        view_parser = argparse.ArgumentParser(prog="catime view")
+        view_parser.add_argument("--port", type=int, default=8000, help="Port (default: 8000)")
+        cmd_view(view_parser.parse_args(sys.argv[2:]))
+        return
+
     parser = argparse.ArgumentParser(
         prog="catime",
         description="View AI-generated hourly cat images",
     )
     parser.add_argument(
         "query", nargs="?",
-        help="Cat number (e.g. 42), date (2026-01-30), date+hour (2026-01-30T05), 'today', or 'yesterday'.",
+        help="Cat number (e.g. 42), date (2026-01-30), date+hour (2026-01-30T05), 'today', 'yesterday', or 'view'.",
     )
     parser.add_argument("--repo", default=DEFAULT_REPO, help="GitHub repo owner/name")
     parser.add_argument("--local", action="store_true", help="Use local catlist.json")
@@ -103,7 +137,14 @@ def main():
         print("  catime yesterday       List yesterday's cats")
         print("  catime 2026-01-30      List all cats from a date")
         print("  catime 2026-01-30T05   View the cat from a specific hour")
+        print("  catime latest          View the latest cat")
         print("  catime --list          List all cats")
+        print("  catime view            Open cat gallery in browser")
+        return
+
+    # latest
+    if args.query == "latest":
+        print_cat(cats[-1], len(cats))
         return
 
     # Try as number first

catime/docs/app.js

@@ -0,0 +1,223 @@
+(function () {
+  const CATLIST_URL = "https://raw.githubusercontent.com/yazelin/catime/main/catlist.json";
+  const PAGE_SIZE = 20;
+
+  let allCats = [];
+  let filtered = [];
+  let loaded = 0;
+  let loading = false;
+  let selectedDate = ""; // "YYYY-MM-DD" or ""
+
+  const gallery = document.getElementById("gallery");
+  const endMsg = document.getElementById("end-msg");
+  const modelSelect = document.getElementById("model-filter");
+  const timelineList = document.getElementById("timeline-list");
+  const timelineNav = document.getElementById("timeline");
+  const timelineToggle = document.getElementById("timeline-toggle");
+  const lightbox = document.getElementById("lightbox");
+  const lbImg = document.getElementById("lb-img");
+  const lbInfo = document.getElementById("lb-info");
+  const lbClose = document.getElementById("lb-close");
+
+  // Date picker elements
+  const datePickerBtn = document.getElementById("date-picker-btn");
+  const dateDropdown = document.getElementById("date-dropdown");
+  const ddPrev = document.getElementById("dd-prev");
+  const ddNext = document.getElementById("dd-next");
+  const ddMonthLabel = document.getElementById("dd-month-label");
+  const ddDays = document.getElementById("dd-days");
+  const ddClear = document.getElementById("dd-clear");
+
+  let calYear = new Date().getFullYear();
+  let calMonth = new Date().getMonth();
+  let catDates = new Set();
+
+  // Fetch data
+  fetch(CATLIST_URL)
+    .then(r => r.json())
+    .then(data => {
+      allCats = data.filter(c => c.status !== "failed").reverse();
+      allCats.forEach(c => catDates.add(c.timestamp.split(" ")[0]));
+      populateModels();
+      buildTimeline();
+      // Init calendar to latest cat's month
+      if (allCats.length) {
+        const parts = allCats[0].timestamp.split(" ")[0].split("-");
+        calYear = parseInt(parts[0], 10);
+        calMonth = parseInt(parts[1], 10) - 1;
+      }
+      applyFilter();
+    })
+    .catch(err => {
+      gallery.innerHTML = `<p style="padding:2rem;color:var(--pink)">Failed to load cat list: ${err.message}</p>`;
+    });
+
+  function populateModels() {
+    const models = [...new Set(allCats.map(c => c.model).filter(Boolean))].sort();
+    models.forEach(m => {
+      const opt = document.createElement("option");
+      opt.value = m; opt.textContent = m;
+      modelSelect.appendChild(opt);
+    });
+  }
+
+  function buildTimeline() {
+    const map = {};
+    allCats.forEach(c => {
+      const [date] = c.timestamp.split(" ");
+      const [y, m] = date.split("-");
+      if (!map[y]) map[y] = new Set();
+      map[y].add(m);
+    });
+    let html = "";
+    Object.keys(map).sort().reverse().forEach(y => {
+      html += `<div class="year">${y}</div>`;
+      [...map[y]].sort().reverse().forEach(m => {
+        html += `<a href="#" data-ym="${y}-${m}">${y}-${m}</a>`;
+      });
+    });
+    timelineList.innerHTML = html;
+  }
+
+  // ── Date picker ──
+  datePickerBtn.addEventListener("click", e => {
+    e.stopPropagation();
+    dateDropdown.classList.toggle("hidden");
+    if (!dateDropdown.classList.contains("hidden")) renderCalendar();
+  });
+  document.addEventListener("click", e => {
+    if (!dateDropdown.classList.contains("hidden") && !document.getElementById("date-picker").contains(e.target)) {
+      dateDropdown.classList.add("hidden");
+    }
+  });
+  ddPrev.addEventListener("click", () => { calMonth--; if (calMonth < 0) { calMonth = 11; calYear--; } renderCalendar(); });
+  ddNext.addEventListener("click", () => { calMonth++; if (calMonth > 11) { calMonth = 0; calYear++; } renderCalendar(); });
+  ddClear.addEventListener("click", () => {
+    selectedDate = "";
+    datePickerBtn.textContent = "\u{1f4c5} All Dates";
+    datePickerBtn.classList.remove("active");
+    dateDropdown.classList.add("hidden");
+    applyFilter();
+  });
+
+  function renderCalendar() {
+    const months = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
+    ddMonthLabel.textContent = `${months[calMonth]} ${calYear}`;
+    const first = new Date(calYear, calMonth, 1);
+    const startDay = first.getDay();
+    const daysInMonth = new Date(calYear, calMonth + 1, 0).getDate();
+    const todayStr = new Date().toISOString().slice(0, 10);
+
+    let html = "";
+    // Empty cells before first day
+    for (let i = 0; i < startDay; i++) html += `<button class="other-month" disabled></button>`;
+    for (let d = 1; d <= daysInMonth; d++) {
+      const ds = `${calYear}-${String(calMonth + 1).padStart(2, "0")}-${String(d).padStart(2, "0")}`;
+      const cls = [];
+      if (ds === todayStr) cls.push("today");
+      if (ds === selectedDate) cls.push("selected");
+      if (catDates.has(ds)) cls.push("has-cat");
+      html += `<button data-date="${ds}" class="${cls.join(" ")}">${d}</button>`;
+    }
+    ddDays.innerHTML = html;
+  }
+
+  ddDays.addEventListener("click", e => {
+    const date = e.target.dataset.date;
+    if (!date) return;
+    selectedDate = date;
+    datePickerBtn.textContent = "\u{1f4c5} " + date;
+    datePickerBtn.classList.add("active");
+    dateDropdown.classList.add("hidden");
+    applyFilter();
+  });
+
+  // ── Filter ──
+  function applyFilter() {
+    const model = modelSelect.value;
+    filtered = allCats.filter(c => {
+      if (model && c.model !== model) return false;
+      if (selectedDate && !c.timestamp.startsWith(selectedDate)) return false;
+      return true;
+    });
+    loaded = 0;
+    gallery.innerHTML = "";
+    endMsg.classList.add("loading");
+    endMsg.classList.remove("hidden");
+    loadMore();
+  }
+
+  modelSelect.addEventListener("change", applyFilter);
+
+  // ── Render cards ──
+  function loadMore() {
+    if (loading || loaded >= filtered.length) return;
+    loading = true;
+    const slice = filtered.slice(loaded, loaded + PAGE_SIZE);
+    let lastMonth = "";
+    if (loaded > 0) {
+      const prev = filtered[loaded - 1];
+      lastMonth = prev.timestamp.slice(0, 7);
+    }
+    const frag = document.createDocumentFragment();
+    slice.forEach(cat => {
+      const month = cat.timestamp.slice(0, 7);
+      if (month !== lastMonth) {
+        const sep = document.createElement("div");
+        sep.className = "month-sep";
+        sep.id = `m-${month}`;
+        sep.textContent = month;
+        frag.appendChild(sep);
+        lastMonth = month;
+      }
+      const card = document.createElement("div");
+      card.className = "card";
+      card.innerHTML = `
+        <img src="${cat.url}" alt="Cat #${cat.number}" loading="lazy">
+        <div class="card-info">
+          <div class="time">#${cat.number} &middot; ${cat.timestamp}</div>
+          ${cat.model ? `<span class="model">${cat.model}</span>` : ""}
+        </div>`;
+      card.addEventListener("click", () => openLightbox(cat));
+      frag.appendChild(card);
+    });
+    gallery.appendChild(frag);
+    loaded += slice.length;
+    loading = false;
+    if (loaded >= filtered.length) {
+      endMsg.classList.remove("loading");
+    }
+  }
+
+  // ── Infinite scroll ──
+  const observer = new IntersectionObserver(entries => {
+    if (entries[0].isIntersecting) loadMore();
+  }, { rootMargin: "400px" });
+  observer.observe(endMsg);
+
+  // ── Timeline click ──
+  timelineList.addEventListener("click", e => {
+    e.preventDefault();
+    const ym = e.target.dataset.ym;
+    if (!ym) return;
+    const idx = filtered.findIndex(c => c.timestamp.startsWith(ym));
+    if (idx === -1) return;
+    while (loaded <= idx && loaded < filtered.length) loadMore();
+    const el = document.getElementById(`m-${ym}`);
+    if (el) el.scrollIntoView({ behavior: "smooth", block: "start" });
+    if (window.innerWidth <= 1024) timelineNav.classList.remove("open");
+  });
+
+  timelineToggle.addEventListener("click", () => timelineNav.classList.toggle("open"));
+
+  // ── Lightbox ──
+  function openLightbox(cat) {
+    lbImg.src = cat.url;
+    lbInfo.textContent = `#${cat.number} \u00b7 ${cat.timestamp} \u00b7 ${cat.model || ""}`;
+    lightbox.classList.remove("hidden");
+  }
+  lbClose.addEventListener("click", () => lightbox.classList.add("hidden"));
+  lightbox.addEventListener("click", e => { if (e.target === lightbox) lightbox.classList.add("hidden"); });
+  document.addEventListener("keydown", e => { if (e.key === "Escape") lightbox.classList.add("hidden"); });
+
+})();

catime/docs/index.html

@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html lang="zh-TW">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Catime - AI Cat Gallery</title>
+  <link rel="icon" href="favicon.ico" sizes="any">
+  <link rel="icon" href="favicon-32.png" type="image/png" sizes="32x32">
+  <link rel="icon" href="icon-192.png" type="image/png" sizes="192x192">
+  <link rel="apple-touch-icon" href="apple-touch-icon.png">
+  <link rel="stylesheet" href="style.css">
+</head>
+<body>
+  <header id="topbar">
+    <img src="icon-192.png" alt="Catime" class="logo-icon">
+    <h1>Catime</h1>
+    <div class="filters">
+      <select id="model-filter">
+        <option value="">All Models</option>
+      </select>
+      <div class="date-picker" id="date-picker">
+        <button class="date-picker-btn" id="date-picker-btn">&#x1f4c5; All Dates</button>
+        <div class="date-dropdown hidden" id="date-dropdown">
+          <div class="dd-header">
+            <button class="dd-nav" id="dd-prev">&lsaquo;</button>
+            <span id="dd-month-label"></span>
+            <button class="dd-nav" id="dd-next">&rsaquo;</button>
+          </div>
+          <div class="dd-weekdays">
+            <span>Su</span><span>Mo</span><span>Tu</span><span>We</span><span>Th</span><span>Fr</span><span>Sa</span>
+          </div>
+          <div class="dd-days" id="dd-days"></div>
+          <button class="dd-clear" id="dd-clear">Clear</button>
+        </div>
+      </div>
+    </div>
+    <a href="https://github.com/yazelin/catime" target="_blank" rel="noopener" class="github-link" title="View on GitHub">
+      <svg viewBox="0 0 16 16" width="22" height="22" fill="currentColor"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27s1.36.09 2 .27c1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0016 8c0-4.42-3.58-8-8-8z"/></svg>
+    </a>
+  </header>
+
+  <nav id="timeline" aria-label="Timeline navigation">
+    <button id="timeline-toggle" aria-label="Toggle timeline">&#x1f4c5;</button>
+    <div id="timeline-list"></div>
+  </nav>
+
+  <main id="gallery" class="masonry"></main>
+  <div id="end-msg" class="hidden">No more cats! 🐱</div>
+
+  <div id="lightbox" class="hidden" role="dialog">
+    <button id="lb-close" aria-label="Close">&times;</button>
+    <img id="lb-img" src="" alt="Cat">
+    <div id="lb-info"></div>
+  </div>
+
+  <script src="app.js"></script>
+</body>
+</html>

catime/docs/style.css

@@ -0,0 +1,294 @@
+@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800&display=swap');
+
+*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
+
+:root {
+  --pink: #ff6b9d;
+  --pink-light: #ffa5c8;
+  --pink-pale: #fff0f5;
+  --orange: #ffb347;
+  --red: #ff6b6b;
+  --blue: #74b9ff;
+  --green: #a8e6cf;
+  --purple: #c9b1ff;
+  --bg: #fff5f9;
+  --surface: #ffffff;
+  --card-1: #fff0f5;
+  --card-2: #f0f8ff;
+  --card-3: #f5fff0;
+  --card-4: #fef5ff;
+  --card-5: #fff8f0;
+  --text: #5a4a5a;
+  --text-muted: #b8a0b8;
+  --shadow: rgba(255, 107, 157, .15);
+}
+
+body {
+  font-family: 'Nunito', system-ui, sans-serif;
+  background: var(--bg);
+  background-image:
+    radial-gradient(circle at 10% 20%, rgba(255,107,157,.06) 0%, transparent 50%),
+    radial-gradient(circle at 90% 80%, rgba(116,185,255,.06) 0%, transparent 50%),
+    radial-gradient(circle at 50% 50%, rgba(201,177,255,.05) 0%, transparent 50%);
+  color: var(--text);
+  min-height: 100vh;
+}
+
+/* Top bar */
+#topbar {
+  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
+  display: flex; align-items: center; gap: .6rem;
+  padding: .6rem 1rem;
+  background: linear-gradient(135deg, #fff 0%, var(--pink-pale) 100%);
+  border-bottom: 3px solid var(--pink-light);
+  box-shadow: 0 2px 16px var(--shadow);
+  flex-wrap: wrap;
+}
+.logo-icon {
+  width: 34px; height: 34px; border-radius: 50%;
+  flex-shrink: 0;
+}
+#topbar h1 {
+  font-size: 1.3rem; font-weight: 800; white-space: nowrap;
+  background: linear-gradient(135deg, #9b7ec8, var(--pink), #ffb347);
+  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
+  background-clip: text;
+}
+.filters {
+  display: flex; gap: .5rem; flex: 1; justify-content: flex-end;
+  align-items: center; flex-wrap: wrap; min-width: 0;
+}
+.filters select {
+  padding: .45rem .8rem; border-radius: 20px;
+  border: 2px solid var(--pink-light);
+  background: #fff; color: var(--text); font-size: .85rem;
+  font-family: inherit; cursor: pointer;
+  transition: border-color .2s, box-shadow .2s;
+  min-width: 0;
+}
+.filters select:focus {
+  outline: none; border-color: var(--pink);
+  box-shadow: 0 0 0 3px rgba(255,107,157,.2);
+}
+
+/* Custom date picker */
+.date-picker { position: relative; }
+.date-picker-btn {
+  padding: .45rem .8rem; border-radius: 20px;
+  border: 2px solid var(--pink-light);
+  background: #fff; color: var(--text); font-size: .85rem;
+  font-family: inherit; cursor: pointer; white-space: nowrap;
+  transition: border-color .2s, box-shadow .2s;
+}
+.date-picker-btn:hover { border-color: var(--pink); }
+.date-picker-btn.active {
+  border-color: var(--pink); background: var(--pink-pale);
+}
+.date-dropdown {
+  position: absolute; top: calc(100% + 6px); right: 0; z-index: 150;
+  background: #fff; border-radius: 16px; padding: .8rem;
+  border: 2px solid var(--pink-light);
+  box-shadow: 0 8px 30px var(--shadow);
+  width: 260px;
+}
+.dd-header {
+  display: flex; align-items: center; justify-content: space-between;
+  margin-bottom: .5rem;
+}
+.dd-header span {
+  font-weight: 800; font-size: .9rem;
+  background: linear-gradient(135deg, var(--pink), var(--purple));
+  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
+  background-clip: text;
+}
+.dd-nav {
+  width: 30px; height: 30px; border-radius: 50%; border: none;
+  background: var(--pink-pale); color: var(--pink);
+  font-size: 1.1rem; font-weight: 800; cursor: pointer;
+  transition: background .2s;
+}
+.dd-nav:hover { background: var(--pink-light); color: #fff; }
+.dd-weekdays {
+  display: grid; grid-template-columns: repeat(7, 1fr);
+  text-align: center; font-size: .7rem; font-weight: 700;
+  color: var(--text-muted); margin-bottom: .3rem;
+}
+.dd-days {
+  display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px;
+}
+.dd-days button {
+  aspect-ratio: 1; border: none; border-radius: 50%;
+  background: transparent; color: var(--text); font-size: .78rem;
+  font-family: inherit; font-weight: 600; cursor: pointer;
+  transition: all .15s;
+}
+.dd-days button:hover { background: var(--pink-pale); }
+.dd-days button.today { border: 2px solid var(--pink-light); }
+.dd-days button.selected {
+  background: linear-gradient(135deg, var(--pink), var(--purple));
+  color: #fff;
+}
+.dd-days button.has-cat::after {
+  content: ""; display: block; width: 4px; height: 4px;
+  background: var(--pink); border-radius: 50%;
+  margin: -2px auto 0;
+}
+.dd-days button.selected.has-cat::after { background: #fff; }
+.dd-days button.other-month { color: var(--text-muted); opacity: .4; }
+.dd-clear {
+  display: block; width: 100%; margin-top: .5rem; padding: .4rem;
+  border: none; border-radius: 20px;
+  background: var(--pink-pale); color: var(--pink);
+  font-family: inherit; font-size: .8rem; font-weight: 700;
+  cursor: pointer; transition: background .2s;
+}
+.dd-clear:hover { background: var(--pink-light); color: #fff; }
+
+/* GitHub link */
+.github-link {
+  color: var(--pink); flex-shrink: 0;
+  transition: color .2s, transform .2s;
+  display: flex; align-items: center;
+}
+.github-link:hover { color: var(--purple); transform: scale(1.15) rotate(-8deg); }
+
+/* Timeline sidebar */
+#timeline {
+  position: fixed; top: 56px; right: 0; bottom: 0; width: 130px; z-index: 90;
+  background: linear-gradient(180deg, #fff 0%, var(--pink-pale) 100%);
+  border-left: 2px solid var(--pink-light);
+  overflow-y: auto; padding: .8rem 0;
+  transition: transform .3s ease;
+}
+#timeline::-webkit-scrollbar { width: 4px; }
+#timeline::-webkit-scrollbar-thumb { background: var(--pink-light); border-radius: 4px; }
+
+#timeline-toggle {
+  display: none; position: fixed; bottom: 1.2rem; right: 1.2rem; z-index: 91;
+  width: 48px; height: 48px; border-radius: 50%; border: none;
+  background: linear-gradient(135deg, var(--pink), var(--purple));
+  color: #fff; font-size: 1.3rem; cursor: pointer;
+  box-shadow: 0 4px 15px rgba(255,107,157,.35);
+  transition: transform .2s;
+}
+#timeline-toggle:hover { transform: scale(1.1); }
+
+#timeline-list a {
+  display: block; padding: .3rem .8rem; color: var(--text-muted);
+  text-decoration: none; font-size: .8rem; font-weight: 600;
+  border-right: 3px solid transparent;
+  transition: all .2s;
+}
+#timeline-list a:hover {
+  color: var(--pink); background: rgba(255,107,157,.08);
+  border-right-color: var(--pink);
+}
+#timeline-list .year {
+  font-weight: 800; color: var(--purple); margin-top: .6rem;
+  padding: .2rem .8rem; font-size: .85rem;
+}
+
+/* Gallery masonry */
+.masonry {
+  margin-top: 60px; margin-right: 130px; padding: 1.2rem;
+  column-count: 3; column-gap: 1.2rem;
+}
+
+/* Candy color rotation for cards */
+.card {
+  break-inside: avoid; margin-bottom: 1.2rem;
+  border-radius: 16px; overflow: hidden;
+  cursor: pointer;
+  transition: transform .2s ease, box-shadow .2s ease;
+  border: 2px solid transparent;
+}
+.card:nth-child(5n+1) { background: var(--card-1); border-color: rgba(255,107,157,.2); }
+.card:nth-child(5n+2) { background: var(--card-2); border-color: rgba(116,185,255,.2); }
+.card:nth-child(5n+3) { background: var(--card-3); border-color: rgba(168,230,207,.25); }
+.card:nth-child(5n+4) { background: var(--card-4); border-color: rgba(201,177,255,.25); }
+.card:nth-child(5n+5) { background: var(--card-5); border-color: rgba(255,179,71,.2); }
+
+.card:hover {
+  transform: translateY(-4px) scale(1.01);
+  box-shadow: 0 8px 25px var(--shadow);
+}
+.card img { width: 100%; display: block; border-radius: 14px 14px 0 0; }
+.card-info { padding: .6rem .8rem; font-size: .78rem; }
+.card-info .time { color: var(--text-muted); font-weight: 600; }
+.card-info .model {
+  display: inline-block; margin-top: .3rem; padding: .15rem .55rem;
+  border-radius: 20px; font-size: .7rem; font-weight: 700;
+  color: #fff;
+}
+/* Rotate model tag colors */
+.card:nth-child(5n+1) .model { background: linear-gradient(135deg, var(--pink), var(--red)); }
+.card:nth-child(5n+2) .model { background: linear-gradient(135deg, var(--blue), var(--purple)); }
+.card:nth-child(5n+3) .model { background: linear-gradient(135deg, var(--green), #6bcfa8); }
+.card:nth-child(5n+4) .model { background: linear-gradient(135deg, var(--purple), var(--pink)); }
+.card:nth-child(5n+5) .model { background: linear-gradient(135deg, var(--orange), var(--red)); }
+
+/* Month separator */
+.month-sep {
+  column-span: all; padding: .5rem 0; font-size: .95rem;
+  font-weight: 800; letter-spacing: .02em;
+  background: linear-gradient(135deg, var(--pink), var(--purple));
+  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
+  background-clip: text;
+  border-bottom: 2px dashed var(--pink-light);
+  margin-bottom: .8rem;
+}
+.month-sep::before { content: "🌸 "; -webkit-text-fill-color: initial; }
+
+/* End / scroll sentinel */
+#end-msg {
+  text-align: center; padding: 2.5rem; font-size: 1rem;
+  color: var(--text-muted); font-weight: 700;
+  margin-right: 130px;
+}
+#end-msg.loading { visibility: hidden; height: 1px; padding: 0; }
+.hidden { display: none !important; }
+
+/* Lightbox */
+#lightbox {
+  position: fixed; inset: 0; z-index: 200;
+  background: rgba(90, 74, 90, .8);
+  backdrop-filter: blur(8px);
+  display: flex; flex-direction: column;
+  align-items: center; justify-content: center;
+}
+#lb-close {
+  position: absolute; top: 1rem; right: 1.2rem;
+  background: none; border: none; color: #fff; font-size: 2.2rem; cursor: pointer;
+  text-shadow: 0 2px 8px rgba(0,0,0,.3);
+  transition: transform .2s;
+}
+#lb-close:hover { transform: scale(1.2) rotate(90deg); }
+#lb-img {
+  max-width: 90vw; max-height: 80vh;
+  border-radius: 16px;
+  box-shadow: 0 12px 40px rgba(0,0,0,.3);
+}
+#lb-info {
+  margin-top: .8rem; color: #fff; font-size: .9rem;
+  font-weight: 600; text-shadow: 0 1px 4px rgba(0,0,0,.3);
+}
+
+/* Responsive */
+@media (max-width: 1024px) {
+  .masonry { column-count: 2; margin-right: 0; }
+  #end-msg { margin-right: 0; }
+  #timeline { transform: translateX(100%); }
+  #timeline.open { transform: translateX(0); }
+  #timeline-toggle { display: block; }
+}
+@media (max-width: 600px) {
+  .masonry { column-count: 1; padding: .8rem; margin-top: 100px; }
+  #topbar { gap: .4rem; padding: .5rem .6rem; }
+  #topbar h1 { font-size: 1.1rem; }
+  .logo-icon { width: 28px; height: 28px; }
+  .filters { flex: 1 1 100%; order: 1; justify-content: flex-start; gap: .4rem; }
+  .filters select { font-size: .78rem; padding: .35rem .5rem; }
+  .date-picker-btn { font-size: .78rem; padding: .35rem .5rem; }
+  .date-dropdown { width: calc(100vw - 1.2rem); max-width: 280px; right: auto; left: 0; }
+  .github-link { margin-left: auto; }
+}

catime-0.4.0.dist-info/METADATA

@@ -0,0 +1,45 @@
+Metadata-Version: 2.4
+Name: catime
+Version: 0.4.0
+Summary: AI-generated hourly cat images - a new cat every hour!
+License-Expression: MIT
+License-File: LICENSE
+Requires-Python: >=3.10
+Requires-Dist: httpx
+Description-Content-Type: text/markdown
+
+# <img src="docs/icon-192.png" width="32" height="32" alt="catime icon"> catime
+
+AI-generated hourly cat images. A new cat every hour!
+
+Every hour, a GitHub Actions workflow generates a unique cat image using [nanobanana-py](https://pypi.org/project/nanobanana-py/) (Gemini API), uploads it as a GitHub Release asset, and posts it to a monthly issue.
+
+## Install & Usage
+
+```bash
+uvx catime              # Show total cat count
+uvx catime latest       # View the latest cat
+uvx catime 42           # View cat #42
+uvx catime today        # List today's cats
+uvx catime yesterday    # List yesterday's cats
+uvx catime 2026-01-30   # List all cats from a date
+uvx catime 2026-01-30T05  # View the cat from a specific hour
+uvx catime --list       # List all cats
+uvx catime view         # Open cat gallery in browser (localhost:8000)
+uvx catime view --port 3000  # Use custom port
+```
+
+## How It Works
+
+- **Image generation:** [nanobanana-py](https://pypi.org/project/nanobanana-py/) with `gemini-3-pro-image-preview` (fallback: `gemini-2.5-flash-image`)
+- **Image hosting:** GitHub Release assets
+- **Cat gallery:** Monthly GitHub issues (auto-created)
+- **Metadata:** `catlist.json` in the repo (records timestamp, model used, success/failure)
+- **Gallery:** [GitHub Pages](https://yazelin.github.io/catime) waterfall gallery (`docs/`)
+- **Schedule:** GitHub Actions cron, every hour at :00
+
+## Setup (for your own repo)
+
+1. Fork or clone this repo
+2. Add `GEMINI_API_KEY` to repo Settings → Secrets
+3. The workflow will auto-create monthly issues and a `cats` release

catime-0.4.0.dist-info/RECORD

@@ -0,0 +1,14 @@
+catime/__init__.py,sha256=i8FYHW-V2UO0kNEghreL2-uQ70fLxsGQ0z5kGoNEbfk,70
+catime/cli.py,sha256=9wvMNzCYkhvEJGOycuLCUf4MbvkpOAHw7Sfg0M1bN80,5743
+catime/docs/app.js,sha256=PyvA4Ai7Y_ZDPbwRDAsrv8aWi1yMZV7BqUraF4uIyPE,8261
+catime/docs/apple-touch-icon.png,sha256=ZSipNfat3Wz3Gu3S5hTGPfIpc5hT_eDFFgScStJLzwQ,38872
+catime/docs/favicon-32.png,sha256=13byvPFWFl_u2RiFITAIVZJZk75Ljo7_N_xS6NUmX_g,2496
+catime/docs/favicon.ico,sha256=2LLdNzyOh5dCYMkpcOVCMyvYyg9PVJPTmmZ2APubvpQ,8050
+catime/docs/icon-192.png,sha256=hx10FySGPXgaBVWMDLR6VJd9UBOfzybOeo9fNZMZTdw,43281
+catime/docs/index.html,sha256=CMKUjEIfaEGu8B7xayHfslDVqfnSmXH10l4Qn3buk44,2801
+catime/docs/style.css,sha256=sS5INs7BsUvP2e5yA2x3CzFVjJ7ODQ0B1nqJRAYUEyU,10429
+catime-0.4.0.dist-info/METADATA,sha256=MFjNZp8nIrt-7m-dsYVbQFmPZIBTljTpjRWDJtfYbE0,1814
+catime-0.4.0.dist-info/WHEEL,sha256=WLgqFyCfm_KASv4WHyYy0P3pM_m7J5L9k2skdKLirC8,87
+catime-0.4.0.dist-info/entry_points.txt,sha256=oPgi6h026vMo9YyEOH3wuNtD3A28e-s1ChJs-KWWGXw,43
+catime-0.4.0.dist-info/licenses/LICENSE,sha256=p_h5YRMaNCwMqGXX5KDrk49_NWGpzAJ2d6IhKa67B0E,1064
+catime-0.4.0.dist-info/RECORD,,

catime-0.2.0.dist-info/METADATA

@@ -1,25 +0,0 @@
-Metadata-Version: 2.4
-Name: catime
-Version: 0.2.0
-Summary: AI-generated hourly cat images - a new cat every hour!
-License-Expression: MIT
-License-File: LICENSE
-Requires-Python: >=3.10
-Requires-Dist: httpx
-Description-Content-Type: text/markdown
-
-# catime
-
-AI-generated hourly cat images. A new cat every hour!
-
-## Usage
-
-```bash
-uvx catime              # Show total cat count
-uvx catime 42           # View cat #42
-uvx catime today        # List today's cats
-uvx catime yesterday    # List yesterday's cats
-uvx catime 2026-01-30   # List all cats from a date
-uvx catime 2026-01-30T05  # View the cat from a specific hour
-uvx catime --list       # List all cats
-```

catime-0.2.0.dist-info/RECORD

@@ -1,7 +0,0 @@
-catime/__init__.py,sha256=f37KsktucfUui7NyCuEJRZT_WMFOIcUFCWao5y9wsyM,70
-catime/cli.py,sha256=dDMYM6UvXQlDldni2rfQ70CsjUwIaQGPZj6Egcd4t8M,4243
-catime-0.2.0.dist-info/METADATA,sha256=bfR_tARqCSml9MpfEOnZZnBUz1bMgGF3OTPSsX88GV8,665
-catime-0.2.0.dist-info/WHEEL,sha256=WLgqFyCfm_KASv4WHyYy0P3pM_m7J5L9k2skdKLirC8,87
-catime-0.2.0.dist-info/entry_points.txt,sha256=oPgi6h026vMo9YyEOH3wuNtD3A28e-s1ChJs-KWWGXw,43
-catime-0.2.0.dist-info/licenses/LICENSE,sha256=p_h5YRMaNCwMqGXX5KDrk49_NWGpzAJ2d6IhKa67B0E,1064
-catime-0.2.0.dist-info/RECORD,,