Remove Claude markers and resolve html errors. Add pagination to category page. New style for blog/category pages.

Author: OStefan2001

public/css/app.css

@@ -1,5 +1,5 @@
 // ============================================================
-// Blog post page styles — extracted & converted to SCSS
+// Blog post page styles - extracted & converted to SCSS
 // Relies on the global CSS custom properties (--bg, --text, etc.)
 // defined in :root / [data-theme="light"].
 // ============================================================

src/App/assets/scss/components/_blog.scss

@@ -813,6 +813,11 @@ details.acc {
   gap: 20px;
 }
 
+.posts-grid-2-col {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 20px;
+}
 .post-card {
   background: var(--surface);
   border: 1px solid var(--border);

src/App/assets/scss/components/_custom.scss

@@ -7,9 +7,9 @@
     <section class="hero">
         <div class="wrap hero-grid">
             <div>
-                <span class="eyebrow">PSR-15 · middleware-first architecture</span>
+                <span class="eyebrow">PSR-15 . middleware-first architecture</span>
                 <h1>A headless platform for building modern web applications</h1>
-                <p class="sub">Dotkernel is a collection of open-source application skeletons built on Mezzio and Laminas — pre-configured and ready for anything from a presentation site to an enterprise-grade API.</p>
+                <p class="sub">Dotkernel is a collection of open-source application skeletons built on Mezzio and Laminas - pre-configured and ready for anything from a presentation site to an enterprise-grade API.</p>
                 <div class="hero-ctas">
                     <a class="btn btn-primary" href="https://docs.dotkernel.org" target="_blank" rel="noopener">
                         <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"/><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"/></svg>
@@ -22,7 +22,7 @@
                 </div>
                 <div class="hero-stack-note">
                     <div><span>Runtime</span> Mezzio + Laminas</div>
-                    <div><span>Standards</span> PSR-7 · PSR-11 · PSR-15</div>
+                    <div><span>Standards</span> PSR-7 . PSR-11 . PSR-15</div>
                     <div><span>License</span> BSD-3-Clause</div>
                 </div>
             </div>
@@ -87,7 +87,7 @@
             <div class="section-head">
                 <span class="eyebrow">Headless Platform</span>
                 <h2>Three applications, one platform</h2>
-                <p>API, Admin, and Queue are designed to integrate into a single, unified headless platform — better together than the sum of their parts.</p>
+                <p>API, Admin, and Queue are designed to integrate into a single, unified headless platform - better together than the sum of their parts.</p>
             </div>
 
             <div class="products-grid">
@@ -120,7 +120,7 @@
                         <img alt="License" src="https://img.shields.io/github/license/dotkernel/admin?style=flat&label=&color=D6D2CC">
                         <img alt="Stars" src="https://img.shields.io/github/stars/dotkernel/admin?style=flat&label=%E2%98%85&color=D6D2CC">
                     </div>
-                    <p class="desc">A ready-to-go admin skeleton for managing your platform's records with a simple, table-based approach — plus the tools to build reports and dashboards.</p>
+                    <p class="desc">A ready-to-go admin skeleton for managing your platform's records with a simple, table-based approach - plus the tools to build reports and dashboards.</p>
                     <div class="card-btns">
                         <a class="btn btn-ghost btn-sm" href="https://github.com/dotkernel/admin" target="_blank" rel="noopener">GitHub</a>
                         <a class="btn btn-ghost btn-sm" href="https://admin7.dotkernel.net/" target="_blank" rel="noopener">Demo</a>
@@ -161,15 +161,15 @@
 
                 <div class="card" style="--accent:var(--rose)">
                     <div class="card-top">
-                        <div><span class="kicker">Skeleton · Didactic</span><h3>Light</h3></div>
+                        <div><span class="kicker">Skeleton . Didactic</span><h3>Light</h3></div>
                     </div>
                     <div class="badges">
                         <img alt="PHP" src="https://img.shields.io/packagist/php-v/dotkernel/light?style=flat&label=php&color=F6D6DA">
                         <img alt="Packagist" src="https://img.shields.io/packagist/v/dotkernel/light?style=flat&label=&color=F6D6DA">
                         <img alt="License" src="https://img.shields.io/github/license/dotkernel/light?style=flat&label=&color=F6D6DA">
                         <img alt="Stars" src="https://img.shields.io/github/stars/dotkernel/light?style=flat&label=%E2%98%85&color=F6D6DA">
                     </div>
-                    <p class="desc">A minimal, PSR-15 compliant skeleton built for learning purposes — a simple, didactic example of how to put together a basic website, not a Headless Platform component.</p>
+                    <p class="desc">A minimal, PSR-15 compliant skeleton built for learning purposes - a simple, didactic example of how to put together a basic website, not a Headless Platform component.</p>
                     <div class="card-btns">
                         <a class="btn btn-ghost btn-sm" href="https://github.com/dotkernel/light" target="_blank" rel="noopener">GitHub</a>
                         <a class="btn btn-ghost btn-sm" href="https://light.dotkernel.net/" target="_blank" rel="noopener">Demo</a>
@@ -179,15 +179,15 @@
 
                 <div class="card" style="--accent:var(--sage)">
                     <div class="card-top">
-                        <div><span class="kicker">Skeleton · Standalone</span><h3>Frontend</h3></div>
+                        <div><span class="kicker">Skeleton . Standalone</span><h3>Frontend</h3></div>
                     </div>
                     <div class="badges">
                         <img alt="PHP" src="https://img.shields.io/packagist/php-v/dotkernel/frontend?style=flat&label=php&color=E39AA8">
                         <img alt="Packagist" src="https://img.shields.io/packagist/v/dotkernel/frontend?style=flat&label=&color=E39AA8">
                         <img alt="License" src="https://img.shields.io/github/license/dotkernel/frontend?style=flat&label=&color=E39AA8">
                         <img alt="Stars" src="https://img.shields.io/github/stars/dotkernel/frontend?style=flat&label=%E2%98%85&color=E39AA8">
                     </div>
-                    <p class="desc">A web starter skeleton for building frontend applications on Mezzio and Laminas — a standalone alternative, separate from the Headless Platform.</p>
+                    <p class="desc">A web starter skeleton for building frontend applications on Mezzio and Laminas - a standalone alternative, separate from the Headless Platform.</p>
                     <div class="card-btns">
                         <a class="btn btn-ghost btn-sm" href="https://github.com/dotkernel/frontend" target="_blank" rel="noopener">GitHub</a>
                         <a class="btn btn-ghost btn-sm" href="https://v5.dotkernel.net/" target="_blank" rel="noopener">Demo</a>
@@ -204,7 +204,7 @@
             <div class="section-head">
                 <span class="eyebrow">Components</span>
                 <h2>Every layer, on its own</h2>
-                <p>Small, independent dot-* packages — pull in what you need. Lifecycle status for each lives on the <a href="https://www.dotkernel.com/dotkernel-packages-oss-lifecycle/" style="color:var(--teal);">Packages Lifecycle</a> page.</p>
+                <p>Small, independent dot-* packages - pull in what you need. Lifecycle status for each lives on the <a href="https://www.dotkernel.com/dotkernel-packages-oss-lifecycle/" style="color:var(--teal);">Packages Lifecycle</a> page.</p>
             </div>
             <div class="components-grid">
                 <div>
@@ -331,7 +331,7 @@
                 <h2>Control, scalability &amp; performance you can build on.</h2>
             </div>
             <div>
-                <p class="about-text">Dotkernel is an open-source project created and led by the dev team at Apidemia — built first as an internal tool for handling complex architectures, now freely shared as our way of giving back to the community.</p>
+                <p class="about-text">Dotkernel is an open-source project created and led by the dev team at Apidemia - built first as an internal tool for handling complex architectures, now freely shared as our way of giving back to the community.</p>
                 <div class="about-cta">
                     <a class="btn btn-ghost" href="{{ url('page::contact') }}">See more about us →</a>
                 </div>

src/App/templates/app/index.html.twig

@@ -96,7 +96,7 @@
                         <img class="icon icon-jetbrains mt-1" src="{{ asset('images/app/icon/jetbrains-mono.svg') }}" alt="JetBrains">
                     </a>
                 </span>
-            <span class="sponsor">Built with Mezzio, Laminas &amp; Doctrine — for PHP developers, by PHP developers.</span>
+            <span class="sponsor">Built with Mezzio, Laminas &amp; Doctrine - for PHP developers, by PHP developers.</span>
         </div>
     </div>
 </footer>

src/App/templates/layout/default.html.twig

@@ -6,6 +6,7 @@
 
 use Fig\Http\Message\StatusCodeInterface;
 use Laminas\Diactoros\Response\HtmlResponse;
+use Light\App\Helper\Paginator;
 use Light\Blog\Entity\Category;
 use Light\Blog\Repository\CategoryRepository;
 use Mezzio\Template\TemplateRendererInterface;
@@ -30,17 +31,23 @@ public function handle(ServerRequestInterface $request): ResponseInterface
         if ($category === null) {
             return $this->notFound($categories);
         }
-        $meta             = $category;
-        $categoryArticles = $this->categoryRepository->getCategoryPost($category);
+        $meta = $category;
+
+        $queryParams = $request->getQueryParams();
+        $params      = Paginator::getParams($queryParams, 'articles.id');
+        $data        = Paginator::wrapper(
+            $this->categoryRepository->getCategoryPost($category, $params),
+            $params
+        );
 
         try {
             $html = $this->template->render(
                 'page::category-resource',
                 [
-                    'categories'       => $categories,
-                    'category'         => $category,
-                    'meta'             => $meta,
-                    'categoryArticles' => $categoryArticles,
+                    'categories' => $categories,
+                    'category'   => $category,
+                    'meta'       => $meta,
+                    'data'       => $data,
                 ]
             );
             return new HtmlResponse($html);

src/Blog/src/Handler/GetCategoryResourceHandler.php

@@ -4,6 +4,7 @@
 
 namespace Light\Blog\Repository;
 
+use Doctrine\ORM\Tools\Pagination\Paginator as DoctrinePaginator;
 use Light\App\Repository\AbstractRepository;
 use Light\Blog\Entity\Category;
 use Light\Blog\Entity\Post;
@@ -37,19 +38,22 @@ public function getCategoryResource(string $slug): ?Category
     }
 
     /**
-     * @return array<Post>
+     * @param array<string, mixed> $params
+     * @return DoctrinePaginator<Post>
      */
-    public function getCategoryPost(Category $category): array
+    public function getCategoryPost(Category $category, array $params): DoctrinePaginator
     {
         $qb = $this->getQueryBuilder()
             ->select('articles')
             ->from(Post::class, 'articles')
             ->where('articles.category = :category')
             ->andWhere('articles.status = :published')
-            ->orderBy('articles.postDate', 'DESC')
+            ->setParameter('category', $category)
             ->setParameter('published', PostStatusEnum::Published)
-            ->setParameter('category', $category);
+            ->orderBy('articles.postDate', $params['dir'])
+            ->setFirstResult($params['offset'])
+            ->setMaxResults($params['limit']);
 
-        return $qb->getQuery()->getResult();
+        return new DoctrinePaginator($qb->getQuery());
     }
 }

src/Blog/src/Repository/CategoryRepository.php

@@ -31,26 +31,21 @@
             {{ include('@partial/left-menu.html.twig') }}
 
             <main class="article">
-                <div class="posts-list">
+                <div class="posts-grid-2-col">
                     {% for post in data.items %}
-                        <article class="card my-3">
-                            <h3>
-                                <a href="{{ url('page::blog-resource', {categorySlug: post.category.slug, slug: post.slug}) }}">
-                                    {{ post.title }}
-                                </a>
-                            </h3>
-
-                            <p class="desc">{{ post.excerpt }}</p>
-
-                            <div class="card-btns">
-                                <span class="post-date">{{ post.postDate|date('Y-m-d') }}</span>
-
-                                <a href="{{ url('page::blog-resource', {categorySlug: post.category.slug, slug: post.slug}) }}"
-                                   class="btn btn-ghost btn-sm">
-                                    Read more →
-                                </a>
-                            </div>
-                        </article>
+                        <a class="post-card"
+                           href="{{ url('page::blog-resource', {categorySlug: post.category.slug, slug: post.slug}) }}">
+                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8"
+                                 style="width:20px;height:20px;color:var(--teal);" aria-hidden="true">
+                                <path d="M4 4h11l5 5v11a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1z"/>
+                                <path d="M14 4v6h6"/>
+                            </svg>
+                            <span class="post-card-kicker">{{ post.category.name }}</span>
+                            <h4>{{ post.title }}</h4>
+                            <p>{{ post.excerpt|length > 200 ? post.excerpt|slice(0, 200)|trim ~ '…' : post.excerpt }}</p>
+                            <span class="post-card-meta">{{ post.postDate|date('M d, Y') }}</span>
+                            <span class="read-more">Read more →</span>
+                        </a>
                     {% else %}
                         <div class="card posts-empty">
                             <p class="desc">No posts found.</p>
@@ -59,7 +54,7 @@
                 </div>
 
                 {% if data.lastPage > 1 %}
-                    <nav class="pagination-row" aria-label="Author posts pagination">
+                    <nav class="pagination-row mt-3" aria-label="Author posts pagination">
                         <a class="btn btn-ghost btn-sm {% if data.isFirstPage %}disabled{% endif %}"
                            href="?page={{ data.previousPage }}" aria-label="Previous page">←</a>
 
@@ -74,7 +69,7 @@
 
                     <p class="post-date pagination-summary">
                         Page {{ data.currentPage }} of {{ data.lastPage }}
-                        &nbsp;·&nbsp; {{ data.count }} articles total
+                        &nbsp;.&nbsp; {{ data.count }} articles total
                     </p>
                 {% endif %}
             </main>

src/Blog/templates/page/author-resource.html.twig

@@ -14,7 +14,7 @@
             <div class="post-meta">
                 <span class="text-muted small">
                     By <a href="{{ path('page::author-resource', {slug: article.author.slug}) }}" class="fw-bold link-dark text-decoration-none">{{ article.author.name }}</a>
-                    &nbsp;·&nbsp; {{ article.postDate|date('M d, Y') }}
+                    &nbsp;.&nbsp; {{ article.postDate|date('M d, Y') }}
                 </span>
             </div>
         </div>

src/Blog/templates/page/blog-resource/android/listen-for-android-install-referrer.html.twig

@@ -14,7 +14,7 @@
             <div class="post-meta">
                 <span class="text-muted small">
                     By <a href="{{ path('page::author-resource', {slug: article.author.slug}) }}" class="fw-bold link-dark text-decoration-none">{{ article.author.name }}</a>
-                    &nbsp;·&nbsp; {{ article.postDate|date('M d, Y') }}
+                    &nbsp;.&nbsp; {{ article.postDate|date('M d, Y') }}
                 </span>
             </div>
         </div>