update

modules/projectproblog/views/css/blog.css

@@ -530,3 +530,60 @@
     color: var(--blog-accent-dk);
     text-decoration: underline;
 }
+
+/* ---- Homepage: zajawki bloga -------------------------------- */
+#blog-home {
+    margin-top: 2.25rem;
+    margin-bottom: 2.5rem;
+}
+
+.blog-home__header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 1rem;
+    margin-bottom: 1rem;
+}
+
+.blog-home__title {
+    margin: 0;
+    font-size: 1.5rem;
+    font-weight: 700;
+    color: var(--blog-text);
+    line-height: 1.25;
+}
+
+.blog-home__all {
+    font-size: 0.85rem;
+    font-weight: 700;
+    text-transform: uppercase;
+    letter-spacing: 0.04em;
+    color: var(--blog-accent);
+    text-decoration: none;
+}
+
+.blog-home__all:hover {
+    color: var(--blog-accent-dk);
+    text-decoration: underline;
+}
+
+.blog-grid--home .blog-grid-item--home {
+    width: 33.3333%;
+}
+
+@media (max-width: 991px) {
+    .blog-grid--home .blog-grid-item--home {
+        width: 50%;
+    }
+}
+
+@media (max-width: 575px) {
+    .blog-home__header {
+        flex-direction: column;
+        align-items: flex-start;
+    }
+
+    .blog-grid--home .blog-grid-item--home {
+        width: 100%;
+    }
+}

modules/projectproblog/views/templates/hook/home.tpl

@@ -0,0 +1,50 @@
+{**
+ * Project-Pro Blog - sekcja zajawkowa na homepage
+ *}
+{if $blog_home_posts}
+<section id="blog-home" class="container">
+  <div class="blog-home__header">
+    <h2 class="blog-home__title">{$blog_home_title|escape:'html':'UTF-8'}</h2>
+    <a class="blog-home__all" href="{$blog_url|escape:'html':'UTF-8'}">
+      {l s='Zobacz wszystkie wpisy' mod='projectproblog'}
+    </a>
+  </div>
+
+  <div class="blog-grid blog-grid--home">
+    {foreach from=$blog_home_posts item=post}
+      <div class="blog-grid-item blog-grid-item--home">
+        <article class="blog-card">
+          {if $post.thumbnail_url}
+            <a href="{$post.url|escape:'html':'UTF-8'}" class="blog-card__thumb">
+              <img src="{$post.thumbnail_url|escape:'html':'UTF-8'}"
+                   alt="{$post.title|escape:'html':'UTF-8'}"
+                   loading="lazy">
+            </a>
+          {/if}
+
+          <div class="blog-card__body">
+            <h3 class="blog-card__title">
+              <a href="{$post.url|escape:'html':'UTF-8'}">
+                {$post.title|escape:'html':'UTF-8'}
+              </a>
+            </h3>
+
+            {if $post.intro}
+              <div class="blog-card__intro">
+                {$post.intro|strip_tags|truncate:150:'...'}
+              </div>
+            {/if}
+
+            <div class="blog-card__footer">
+              <span class="blog-card__date">{$post.date_add|date_format:'%d.%m.%Y'}</span>
+              <a href="{$post.url|escape:'html':'UTF-8'}" class="blog-card__more">
+                {l s='Czytaj wiecej' mod='projectproblog'} &rsaquo;
+              </a>
+            </div>
+          </div>
+        </article>
+      </div>
+    {/foreach}
+  </div>
+</section>
+{/if}

modules/projectproblog/views/templates/hook/index.php

@@ -0,0 +1,4 @@
+<?php
+/**
+ * Silence is golden.
+ */