modifs blog

Author: Axthauvin

content/blog/doks-1-6/index.md

@@ -1,6 +1,5 @@
 ---
 title: "Doks 1.6"
-url: "/blog/doks-1-6/"
 description: "Doks 1.6 is out! This release includes a new Hugo requirement, an improved scripts setup, new development tools, and more."
 summary: "Doks 1.6 is out! This release includes a new Hugo requirement, an improved <code>scripts</code> setup, new development tools, and more."
 date: 2024-05-16T09:03:10+02:00
@@ -75,28 +74,28 @@ Doks 1.6 introduces a cleaner `scripts` section in your projects' `package.json`
 
 Thulite/Doks now uses [Prettier](https://prettier.io/) as a code formatter and [Vite](https://vitejs.dev/) to preview your project's build. You can configure Prettier in the `.prettierrc.yaml` and `.prettierignore` files in the root of your project. With Vite, when you use the `--host` flag, you can preview the build on your local network — for example on your mobile phone — here's how:
 
-{{< tabs "create-new-site" >}}
-{{< tab "npm" >}}
+{{< tabs tabTotal="3">}}
+{{% tab title="npm" %}}
 
 ```bash
 npm run build -- --baseURL=/ && npm run preview -- --host
 ```
 
-{{< /tab >}}
-{{< tab "pnpm" >}}
+{{% /tab %}}
+{{% tab title="pnpm" %}}
 
 ```bash
 pnpm build --baseURL=/ && pnpm preview --host
 ```
 
-{{< /tab >}}
-{{< tab "Yarn" >}}
+{{% /tab %}}
+{{% tab title="Yarn" %}}
 
 ```bash
 yarn run build --baseURL=/ && yarn run preview --host
 ```
 
-{{< /tab >}}
+{{% /tab %}}
 {{< /tabs >}}
 
 <!-- omit in toc -->

hugo.toml

@@ -16,4 +16,6 @@ title = 'BackToBasics'
 [params]
     [params.docs]
         darkMode = true
-        #themeColor = "blue" #blue (default), green, red, yellow, emerald, cardinal, magenta, cyan.
+        #themeColor = "blue" #blue (default), green, red, yellow, emerald, cardinal, magenta, cyan
+    [params.blog]
+        showImage = true

themes/lotusdocs/layouts/blog/baseof.html

@@ -39,7 +39,10 @@
         <div class="mb-4" id="content" style="padding-top: 100px;">
             <div class="wrap container-fluid">
                 <div class="content">
-                    {{- block "main" . }}{{- end }}
+                    <div class="container p-0">
+                        {{- block "main" . }}{{- end }}
+                    </div>
+                    
                 </div>
             </div>
 

themes/lotusdocs/layouts/blog/list.html

@@ -23,19 +23,13 @@ <h1 class="text-center">{{ .Title }}</h1>
     {{ $paginator := .Paginate (.Data.Pages) -}}
     {{ range $paginator.Pages -}}
       <div class="card">
-        {{ if site.Params.doks.imageList -}}
+        {{ if site.Params.blog.showImage -}}
+          
           {{- $images := .Resources.ByType "image" -}}
           {{- $featured := $images.GetMatch "*feature*" -}}
           {{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
           {{- if $featured -}}
-            {{ partial "img" (dict
-            "page" .
-            "src" $featured
-            "process" "fill 2100x900"
-            "lqip" "21x webp q20"
-            "alt" .Title
-            "class" "rounded-top-1"
-            )}}
+            <img src = "{{ $featured.RelPermalink }}">
           {{ end -}}
         {{ end -}}
         <div class="card-body">

themes/lotusdocs/layouts/blog/list_old.html

@@ -7,24 +7,19 @@ <h1>{{ .Title }}</h1>
       {{ partial "main/blog-meta.html" . }}
     </div>
   </div>
-  {{ if site.Params.doks.imageSingle -}}
+  {{ if site.Params.blog.showImage -}}
     {{- $images := .Resources.ByType "image" -}}
     {{- $featured := $images.GetMatch "*feature*" -}}
     {{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
     {{- if $featured -}}
       <div class="col-md-13">
-        {{ partial "picture" (dict
-        "page" .
-        "src" $featured
-        "alt" .Title
-        "class" "img-post-single rounded-0"
-        )}}
+        <img src = "{{ $featured.RelPermalink }}">
       </div>
     {{ end -}}
   {{ end -}}
   <div class="col-md-12 col-lg-9">
-    {{ with .Params.summary -}}<p class="lead">{{ . }}</p>{{ end -}}
-    {{ .Content }}
+    {{ with .Params.summary | safeHTML -}}<p class="lead">{{ . }}</p>{{ end -}}
+    {{ .Content}}
     {{ if .Params.tags -}}
     <div class="tag-list-single">
       {{ range $index, $tag := .Params.tags -}}
@@ -55,7 +50,7 @@ <h2 class="section-title text-center">Related posts</h2>
               <div class="card-body">
                 <article>
                   <h2 class="h3"><a class="stretched-link text-body" href="{{ .RelPermalink }}">{{ .Params.title }}</a></h2>
-                  <p>{{ .Params.summary | safeHTML }}</p>
+                  <p>{{ .Params.summary | safeHTML}}</p>
                   {{ partial "main/blog-meta.html" . -}}
                 </article>
               </div>

themes/lotusdocs/layouts/blog/single.html

@@ -4004,13 +4004,25 @@
         font-family: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
         font-size: .875rem
     }
-    
-    code:not(:where(.not-content *)) {
-        background-color: var(--sl-color-gray-1) !important;
+
+    code {
+        background-color: var(--sl-color-gray-1) ;
         margin-block:-0.125rem !important;
         padding: 0.125rem 0.375rem !important;
         color: inherit !important;
     }
+
+    code[data-dark-mode] {
+        background-color: #23262f !important;
+    }
+    
+    code[data-lang] {
+        background-color: var(--sl-color-gray-6) !important;
+    }
+
+    .highlight pre {
+        background-color: #23262f !important;
+    }
 
     [data-dark-mode] code:not(:where(.not-content *)) {
         background-color: var(--sl-color-gray-5)