update

layouts/partials/UI/article-card.html

@@ -1,48 +1,40 @@
-    <article class="story__card">
-      <img
-        src="{{.Params.image}}"
-        alt="{{ .Title }}"
-        data-pagefind-index-attrs="title,alt"
-        class="story__coverImg"
-        loading="lazy"
-      />
-      <div class="story__card__details">
-        <a data-story-url="{{.RelPermalink}}" class="open-modal">
-          <h4 class="card__title">{{ .Title }}</h4>
-        </a>
-        <p class="card__description">{{.Params.description}}</p>
+<article class="story__card">
 
-        <div class="card__tags_categories">
-          {{ range .Params.categories }}
-          <a href="{{ "/categories/" | relLangURL}}{{ . | urlize }}/" class="category__chip">
+{{ partial "common/image.html" (dict "src" .Params.image "alt" .Title) . }}
+
+  <div class="story__card__details">
+      <ul class="card_category_list">
+        {{ range first 5 .Params.categories }}
+        <a href="{{ "/categories/" | relLangURL}}{{ . | urlize }}/">
+          <li class="category__chip">
             {{.}}
-          </a>
-          {{ end }} {{ range .Params.tags }}
-          <a href="{{ "/tags/" | relLangURL }}{{ . | urlize }}/" class="tag__chip">
+          </li>
+        </a>
+        {{ end }}
+      </ul>
+
+        <a href="{{.RelPermalink}}" data-story-url="{{.RelPermalink}}" class="open-modal">
+          <h4 class="card__title">{{ .Title | truncate 45 }}</h4>
+        </a>
+
+            <!-- author -->
+             <div class="author__reading_time">
+                <p class="timeToRead">{{ .ReadingTime }} {{T "minutesToRead"}} </p>
+              </div>
+<!-- description -->
+        <p class="card__description">{{.Params.description | truncate 100}}</p>
+
+        <!-- tags -->
+      <ul class="card_tags_list">
+        {{ range first 3 .Params.tags }}
+        <a href="{{ "/tags/" | relLangURL }}{{ . | urlize }}/">
+          <li class="tag__chip">
             <span class="hastag">#</span>{{.}}
-          </a>
-          {{ end }}
-        </div>
+          </li>
+        </a>
+        {{ end }}
+      </ul>
 
-        <div class="publish__date__timeToRead">
-          <!-- publish date -->
-          <div class="publish__date">
-            <img src="/icons/calender.svg" class="story__card__icon" alt="" />
-            <time datetime=""
-              >{{ .PublishDate |time.Format ":date_medium" }}</time
-            >
-          </div>
 
-          <!-- time to read -->
-          <div class="publish__date">
-            <img src="/icons/hourglass.svg" class="story__card__icon" alt="" />
-            <time datetime="">{{ .ReadingTime }} {{T "minutesToRead"}} </time>
-          </div>
-        </div>
-        <!-- author -->
-        <div class="publish__date">
-          <img src="/icons/person.svg" class="story__card__icon" alt="" />
-          <time datetime="">{{ .Params.author }}</time>
-        </div>
-      </div>
-    </article>
+  </div>
+</article>

layouts/partials/UI/create-story-dialog.html

@@ -0,0 +1,7 @@
+<dialog class="story_dialog">
+  <button id="closeStoryModal" autofocus>Close</button>
+  <iframe
+    src="https://ai.odoo4projects.com/form/345c0f2c-8764-4094-8a5d-1be9c2ed86ef"
+    frameborder="1"
+  ></iframe>
+</dialog>

layouts/partials/UI/navbar.html

@@ -1,36 +1,34 @@
 <nav>
-  <h2>ODOO Community Success Stories sponsored by </h2>
-
-
-
-<a href="http://ODOO4projects.com" style="
-    display: inline-flex;
-    flex-direction: row;
-    align-items: center;
-    gap: 12px;
-    background-color: white;
-    color: orange;
-    border: 2px solid orange;
-    text-decoration: none;
-    padding: 16px 24px;
-    border-radius: 10px;
-    font-size: 18px;
-    font-weight: bold;
-    text-align: left;
-    line-height: 1.3;
-    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
-    transition: all 0.3s ease;
-  " onmouseover="this.style.backgroundColor='#fef6e4'; this.style.color='orange'" onmouseout="this.style.backgroundColor='white'; this.style.color='orange'">
-
-    <img src="/images/logo.svg" alt="Logo" style="width: 32px; height: 32px;">
-    <span style="display: inline-block;">
-      Launch your ODOO Project now!
-    </span>
+  <h2>ODOO Community Success Stories sponsored by</h2>
 
+  <a
+    href="http://ODOO4projects.com"
+    style="
+      display: inline-flex;
+      flex-direction: row;
+      align-items: center;
+      gap: 12px;
+      background-color: white;
+      color: orange;
+      border: 2px solid orange;
+      text-decoration: none;
+      padding: 16px 24px;
+      border-radius: 10px;
+      font-size: 18px;
+      font-weight: bold;
+      text-align: left;
+      line-height: 1.3;
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
+      transition: all 0.3s ease;
+    "
+    onmouseover="this.style.backgroundColor='#fef6e4'; this.style.color='orange'"
+    onmouseout="this.style.backgroundColor='white'; this.style.color='orange'"
+  >
+    <img src="/images/logo.svg" alt="Logo" style="width: 32px; height: 32px" />
+    <span style="display: inline-block"> Launch your ODOO Project now! </span>
   </a>
 
-
-  <div class="search-bar-container" id="search"></div>
+  <!-- <div class="search-bar-container" id="search"></div> -->
 
   <div class="dropdown">
     <button class="dropbtn">{{.Language.LanguageCode}}</button>

layouts/partials/common/footer.html

@@ -0,0 +1,9 @@
+<footer>
+  <ul class="footer_links">
+    {{ range .Site.Menus.footer }}
+    <li><a href="{{.URL}}" title="{{.Name}}">{{.Name}}</a></li>
+    {{ end }}
+  </ul>
+
+  <small class="copyright"> {{T "copyright" (dict "Year" now.Year)}} </small>
+</footer>

layouts/partials/common/head.html

@@ -1,16 +1,3 @@
 <head>
-  <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>
-    {{- if .IsHome -}} Home | {{ .Title }} {{- else if .Page.Title -}} {{
-    .Page.Title }} | {{ .Site.Title }} {{- else -}} {{ .Site.Title }} {{- end
-    -}}
-  </title>
-
-  <!-- description -->
-  {{- if .IsHome -}}
-  <meta name="description" content="{{ .Site.Params.description }}" />
-  {{- else -}}
-  <meta name="description" content="{{ .Params.description }}" />
-  {{- end }} {{ partial "common/links.html" . }}
+  {{ partial "common/meta.html" . }} {{ partial "common/links.html" . }}
 </head>

layouts/partials/common/image.html

@@ -0,0 +1,56 @@
+{{ $src := .src }} {{ $alt := .Text | default "image" }} {{ $title := .Title }}
+{{ $isRemote := strings.HasPrefix $src "http" }} {{ if $isRemote }} {{ with
+resources.GetRemote $src }} {{ if eq .MediaType.SubType "svg" }}
+<img
+  src="{{ $src }}"
+  alt="{{ $alt }}"
+  {{
+  if
+  $title
+  }}title="{{ $title }}"
+  {{
+  end
+  }}
+  loading="lazy"
+/>
+{{ else }} {{ $webp := .Resize "300x300 webp" | fingerprint }}
+<img
+  src="{{ $webp.RelPermalink }}"
+  alt="{{ $alt }}"
+  {{
+  if
+  $title
+  }}title="{{ $title }}"
+  {{
+  end
+  }}
+  loading="lazy"
+/>
+{{ end }} {{ end }} {{ else }} {{ with resources.Get $src }} {{ if eq
+.MediaType.SubType "svg" }}
+<img
+  src="{{ $src }}"
+  alt="{{ $alt }}"
+  {{
+  if
+  $title
+  }}title="{{ $title }}"
+  {{
+  end
+  }}
+  loading="lazy"
+/>
+{{ else }} {{ $resized := .Resize "300x300 webp" }}
+<img
+  src="{{ $resized.RelPermalink }}"
+  alt="{{ $alt }}"
+  {{
+  if
+  $title
+  }}title="{{ $title }}"
+  {{
+  end
+  }}
+  loading="lazy"
+/>
+{{ end }} {{ end }} {{ end }}

layouts/partials/common/links.html

@@ -1,9 +1,3 @@
-<link rel="stylesheet" href="/css/main.css" />
-<link href="/pagefind/pagefind-ui.css" rel="stylesheet" />
-<!-- <link
-  rel="stylesheet"
-  href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css"
-  integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg=="
-  crossorigin="anonymous"
-  referrerpolicy="no-referrer"
-/> -->
+{{ $style := resources.Get "/css/main.css" | minify | fingerprint }}
+<link rel="stylesheet" href="{{ $style.Permalink }}" />
+<!-- <link href="/pagefind/pagefind-ui.css" rel="stylesheet" /> -->

layouts/partials/common/meta.html

@@ -0,0 +1,20 @@
+<meta charset="UTF-8" />
+<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
+<!-- keywords -->
+{{ if .IsHome }} <meta name="keywords" content="{{ delimit .Site.Params.keywords
+", " " and " }}" /> {{ else if .Keywords }}
+# <meta name="keywords" content="{{delimit .Keywords ", "}}">
+{{ end }}
+<!-- title -->
+<title>
+  {{- if .IsHome -}} Home | {{ .Site.Title }} {{- else if .Page.Title -}} {{
+  .Page.Title }} | {{ .Site.Title }} {{- else -}} {{ .Site.Title }} {{- end -}}
+</title>
+
+<!-- description -->
+{{- if .IsHome -}}
+<meta name="description" content="{{ .Site.Params.description }}" />
+{{- else -}}
+<meta name="description" content="{{ .Params.description }}" />
+{{- end }}

layouts/partials/common/scripts.html

@@ -1,5 +1,5 @@
 <script src="/pagefind/pagefind-ui.js"></script>
-<script src="/js/main.js"></script>
+<!-- <script src="/js/main.js"></script> -->
 <script>
   window.addEventListener("DOMContentLoaded", (event) => {
     new PagefindUI({ element: "#search", showSubResults: true,highlightParam: "highlight" });

layouts/partials/sections/hero.html

@@ -0,0 +1,9 @@
+<section class="hero">
+    <div class="search-bar-container" id="search"></div>
+
+  <h1 class="" data-pagefind-meta="title">{{T "hero.heading"}}</h1>
+  <p class="" data-pagefind-meta="description">{{T "hero.description"}}</p>
+  <button class="story-btn" id="createStoryBtn">
+    {{T "submitButtonLabelText"}}
+  </button>
+</section>

layouts/partials/sections/story-grid.html

@@ -0,0 +1,44 @@
+<section id="stories">
+  <div class="tags_categories">
+    <div class="category_list">
+      <div class="block_heading_container">
+        <img src="/icons/categories.svg" alt="" class="">
+        <p class="">{{T "categories"}}</p>
+      </div>
+
+      <!-- list of categories -->
+      <ul>
+        {{ range $name, $taxonomy := .Site.Taxonomies.categories }}
+        <a href="{{site.BaseURL}}{{"categories/"| relLangURL}}{{ $name | urlize }}/">
+          <li class="chip">
+            {{ $name }}
+          </li>
+        </a>
+        {{ end }}
+      </ul>
+    </div>
+
+    <div class="tags_list">
+<div class="block_heading_container">
+
+  <img src="/icons/hastag.svg" alt="" class="">
+  <p class="">
+    {{T "tags"}}
+  </p>
+</div>
+      <ul>
+        {{ range $name, $taxonomy := .Site.Taxonomies.tags }}
+        <a href="{{site.BaseURL}}{{"tags/" | relLangURL}}{{ $name | urlize }}/">
+          <li class="chip">
+            {{ $name }}
+          </li>
+        </a>
+        {{ end }}
+      </ul>
+    </div>
+  </div>
+  <div class="{{ if .IsSection }} story__grid_2 {{ else }} story__grid {{ end }}">
+    {{ range site.RegularPages }}
+    {{ partial "UI/article-card.html" . }} {{end}}
+  </div>
+</section>