Site Builder

Editing: category.php

writable 0666

<?php
// expects $CATEGORY set by stub, _core.php loaded
$dir = __DIR__.'/../'.$CATEGORY;
$items = [];
if ($dh = opendir($dir)) {
  while (($entry = readdir($dh)) !== false) {
    if ($entry==='.'||$entry==='..') continue;
    $pdir = $dir.'/'.$entry;
    if (is_dir($pdir) && is_file("$pdir/product.json")) {
      $it = json_decode(file_get_contents("$pdir/product.json"), true);
      if ($it) {
        $it['_asin'] = $entry;
        // Resolve hero image path for card
        if (!empty($it['images'][0])) {
          $it['_hero'] = (strpos($it['images'][0],'http')===0)
            ? $it['images'][0]
            : "/amazon/$CATEGORY/$entry/".ltrim($it['images'][0],'/');
        } else $it['_hero'] = null;
        $items[] = $it;
      }
    }
  }
  closedir($dh);
}
?><!doctype html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width,initial-scale=1"/>
<title><?php echo e($CATEGORY); ?> — Catalog</title>
<style>
  :root { --bg:#fafafa; --card:#fff; --line:#dcdcdc; --text:#111; --muted:#555; --accent:#111; }
  body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-size:18px;line-height:1.6;margin:0;background:var(--bg);color:var(--text)}
  .wrap{max-width:1120px;margin:0 auto;padding:24px}
  .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
  .card{background:var(--card);border:2px solid var(--line);border-radius:14px;padding:12px;box-shadow:0 1px 3px rgba(0,0,0,.05)}
  .img{width:100%;aspect-ratio:4/3;background:#f4f4f4;border-radius:10px;display:flex;align-items:center;justify-content:center;overflow:hidden}
  .title{font-weight:700;margin:10px 0 6px;font-size:20px}
  .muted{color:var(--muted);font-size:16px}
  .btn{display:inline-block;padding:10px 12px;border:3px solid var(--accent);border-radius:10px;text-decoration:none;color:var(--accent);font-weight:700}
  .btn:hover{background:var(--accent);color:#fff}
</style>
</head>
<body><div class="wrap">
  <h1 style="margin:0 0 12px"><?php echo e(ucwords(str_replace('-', ' ', $CATEGORY))); ?></h1>
  <div class="grid">
    <?php foreach ($items as $it):
      $asin = e($it['_asin']);
      $path = "./$asin/";
    ?>
      <div class="card">
        <a class="img" href="<?php echo $path; ?>">
          <?php if ($it['_hero']): ?>
            <img src="<?php echo e($it['_hero']); ?>" alt="<?php echo e($it['title'] ?? $asin); ?>" style="width:100%;height:100%;object-fit:contain"/>
          <?php else: ?><span>Image</span><?php endif; ?>
        </a>
        <div class="title"><a href="<?php echo $path; ?>"><?php echo e($it['title'] ?? $asin); ?></a></div>
        <?php if (!empty($it['subtitle'])): ?><div class="muted"><?php echo e($it['subtitle']); ?></div><?php endif; ?>
        <div style="margin-top:8px;"><a class="btn" href="<?php echo $path; ?>">View details</a></div>
      </div>
    <?php endforeach; ?>
  </div>
  <p class="muted" style="margin-top:18px;">As an Amazon Associate I earn from qualifying purchases.</p>
</div></body>
</html>

Site Builder

Editing: category.php

Site Builder