Merge pull request #8 from avinal/avinal/improvements

Image related improvements

content/posts/articles/big-red-ants.md

@@ -4,7 +4,7 @@ date: 2012-02-27 22:47
 tags: [ants, sav] 
 category: article
 description: 'The Big Red Ants'
-image: /images/ants.jpg
+image: "/images/ants.webp"
 ---
 
 # The Big Red Ants

content/posts/articles/for-sunshine.md

@@ -3,6 +3,7 @@ title: प्रेम रतन धन पायो
 date: 2019-09-21 15:47
 category: article
 tags: [love, article, hindi]
+image: "/images/fedora-night.webp"
 ---
 
 # प्रेम रतन धन पायो

content/posts/blogs/gsod2020-report.md

@@ -8,6 +8,7 @@ description: 'The project was to Create the VLC User Documentation for Android
 Mobile Port which was previously hosted on VLC wiki pages. The major portion 
 of this was to start everything from scratch including chapter separation, 
 section organization.'
+image: "/images/day-of-cone.webp"
 ---
 
 # Create the VLC User Documentation for one Mobile Port(Android)
@@ -273,3 +274,7 @@ thank every person at VLC and Google who were involved in this whole
 process. Thanks and Congrats to my fellow writer Abhishek Pratap Singh.
 This was a great opportunity to learn and meet awesome people. I learned
 a lot about Sphinx, reStructured Text and many other things.
+
+## ATTRIBUTION
+
+- [Image by Tom Bigelajzen](https://images.videolan.org/images/goodies/day-of-the-cones-ex2.jpg)

content/posts/blogs/hrt-interview-1.md

@@ -3,6 +3,7 @@ title: HRT (Hudson River Trading) Systems Internship Interview Experience
 date: 2021-01-04 21:47
 tags: [HRT, hudsonrivertrading, interview, internship]
 category: blog
+image: "/images/hrt-singapore.webp"
 ---
 
 # `HRT (Hudson River Trading)` Systems Internship Interview Experience

content/posts/development/final-evaluation.md

@@ -3,7 +3,8 @@ title: Google Summer of Code 2021
 date: 2021-08-19 23:07
 tags: [gsoc, FOSSology]
 category: development
-description: This is the final report of my Google Summer of Code 2021 at The FOSSology Project. 
+description: This is the final report of my Google Summer of Code 2021 at The FOSSology Project.
+image: "/images/gsoc-wall.webp"
 ---
 # Google Summer of Code 2021
 
@@ -30,7 +31,7 @@ via custom scripts.
 
 ## GitHub Actions CI/CD
 
-<img src="/images/ci.png"
+<img src="/images/ci.webp"
 class="float-md-right rounded border border-info ml-3 float-md-right rounded border border-info ml-3"
 width="350" alt="A CI Meme" />
 
@@ -497,7 +498,6 @@ INCOMPLETE, <span class="or">ORANGE</span>: NOT NEEDED/DEPRECATED)
 
 ## How does it work and how to use it?
 
-
 The new build system retains the modular and hierarchical structure of
 the previous build system. On the other hand, the new build system
 provides several new flags to control the build. The new build system

content/posts/development/i-am-loving-it-redhat.md

@@ -4,6 +4,7 @@ date: 2022-02-25 20:47
 category: development
 tags: [kubernetes, redhat, docker, golang, tekton, openshift, intern]
 description: I made it to the Red Hat as a DevTools intern. This post is about onboarding and how I prepared myself for working on the actual project.
+image: "/images/fedora-wall.webp"
 ---
 # My internship at Red Hat
 
@@ -74,7 +75,7 @@ end-to-end platform includes UIs, CLIs, APIs, and security that are
 engineered to work together across the entire application delivery
 lifecycle.
 
-![The Docker Architecture](/images/docker-architecture.png)
+![The Docker Architecture](/images/docker-architecture.webp)
 
 - [Docker and Containers -
   Katacoda](https://www.katacoda.com/courses/docker) *interactive
@@ -85,7 +86,7 @@ lifecycle.
 
 ### Kubernetes
 
-![Kubernetes tech](/images/kubernetes-architecture.png)
+![Kubernetes tech](/images/kubernetes-meme.webp)
 
 **Kubernetes** is the Greek word for a ship's captain. We get the words
 Cybernetic and Gubernatorial from it. The Kubernetes project focuses on

content/posts/development/lovely-dangerous-things-redhat.md

@@ -3,6 +3,7 @@ title: Developing Minimal Tekton Server
 date: 2022-02-27 20:47
 modified: 2022-03-07 22:47
 category: development
+image: "/images/development.webp"
 tags: [tekton, go, kubernetes, openshift, redhat, intern, golang, openshift-pipelines]
 description: 'This blog is a descreptive account of the development of Minimal Tekton Server. This is highly technical in nature, so please make sure that you have sufficient knowledge about Golang, Docker, Kubernetes and TektonCD. You can refer to my [previous blog]("https://avinal.space/posts/development/i-am-loving-it-redhat.html") to know about these topics.'
 ---
@@ -37,7 +38,7 @@ to the final diagram. Yeah, we learned. I will be explaining our
 final(obviously) architectural diagram and try to make some sense out of
 band-aids and duct tapes.
 
-<img src="/images/mks-architecture.png"
+<img src="/images/mks-architecture.webp"
 class="img-fluid my-3 img-fluid my-3" alt="The MKS Arhitecture" />
 
 Let me start with explaining **What are MKS Resources?**. I hope you
@@ -206,4 +207,7 @@ type SpaceTimeList struct {
 }
 ```
 
-### To be Continued
+### Attribution
+
+- Photo by [Luca Bravo](https://unsplash.com/@lucabravo?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on [Unsplash](https://unsplash.com/photos/XJXWbfSo2f0?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText).
+  

content/posts/development/wakatime.md

@@ -3,7 +3,7 @@ title: How I implemented WakaTime embeddable Coding Graph GHA?
 date: 2021-02-02 21:47
 tags: [wakatime, github-action, coding]
 category: development
-image: https://raw.githubusercontent.com/avinal/Profile-Readme-WakaTime/b281d074ee75f9626b39d10e2e518c6a297208a3/waka.png
+image: "/images/waka.webp"
 description: 'If you use WakaTime to track your coding activity. You can add that to 
 your README as a bar graph or embed it in your blog/portfolio. Just add this 
 action to any of your repositories and there you have it.'

content/posts/development/wsl1.md

@@ -7,6 +7,7 @@ description: 'It is real pain when you have small SSD and Windows Subsystem for
 (WSL) is growing exponentially in size. There is no easy way to move the
 WSL installation to another drive. Here in this blog I will discuss how
 to tackle this problem with bite size steps.'
+image: "/images/windows-wsl2.webp"
 ---
 
 # Move WSL 2 Safely to another Drive
@@ -21,13 +22,13 @@ use WinKey + X shortcut and select **Windows PowerShell(Admin)**.
 2. Check if the WSL 2 installation you are planning to move is is
 currently running/stopped.
 
-  ```powershell
-  PS C:\\Users\\Avinal> wsl -l -v
-  PS C:\\Users\\Avinal>
-    NAME      STATE           VERSION
-  * Ubuntu    Running         2
-    Kali      Stopped         2
-  ```
+```powershell
+PS C:\\Users\\Avinal> wsl -l -v
+PS C:\\Users\\Avinal>
+  NAME      STATE           VERSION
+* Ubuntu    Running         2
+  Kali      Stopped         2
+```
 
 3. If its running then you must stop the particular WSL distribution.
 (*Ubuntu* used as example)
@@ -89,3 +90,7 @@ PS C:\\Users\\Avinal> ubuntu config --default-user user_name
 
 10. Finally run `wsl` and you have successfully moved your WSL 2
     installation to another drive.
+
+## Attribution
+
+- [Image](https://www.atwix.com/magento/magento-2-with-docker-for-windows-and-wsl-2/)

content/posts/posts.json

@@ -1,65 +1 @@
-[
-  {
-    "title": "Developing Minimal Tekton Server",
-    "date": "2022-02-27 20:47",
-    "category": "development",
-    "description": "This blog is a descreptive account of the development of Minimal Tekton Server. This is highly technical in nature, so please make sure that you have sufficient knowledge about Golang, Docker, Kubernetes and TektonCD. You can refer to my [previous blog](\"https://avinal.space/posts/development/i-am-loving-it-redhat.html\") to know about these topics.",
-    "slug": "lovely-dangerous-things-redhat"
-  },
-  {
-    "title": "I am loving it! RedHat",
-    "date": "2022-02-25 20:47",
-    "category": "development",
-    "description": "I made it to the Red Hat as a DevTools intern. This post is about onboarding and how I prepared myself for working on the actual project.",
-    "slug": "i-am-loving-it-redhat"
-  },
-  {
-    "title": "Google Summer of Code 2021",
-    "date": "2021-08-19 23:07",
-    "category": "development",
-    "description": "This is the final report of my Google Summer of Code 2021 at The FOSSology Project. One of the major improvements over the previous build system is faster build times. CMake generates parallel build-enabled configurations for all generators.",
-    "slug": "final-evaluation"
-  },
-  {
-    "title": "How I implemented WakaTime embeddable Coding Graph GHA?",
-    "date": "2021-02-02 21:47",
-    "category": "development",
-    "description": "If you use WakaTime to track your coding activity. You can add that to your README as a bar graph or embed it in your blog/portfolio. Just add this action to any of your repositories and there you have it.",
-    "slug": "wakatime"
-  },
-  {
-    "title": "HRT (Hudson River Trading) Systems Internship Interview Experience",
-    "date": "2021-01-04 21:47",
-    "category": "blogs",
-    "slug": "hrt-interview-1",
-    "description": "uestions were clear and of medium level. But they were designed in such a way that you must know the basics before you could attempt. Also, they expected a clear and concise approach."
-  },
-  {
-    "title": "Move WSL 2 Safely to another Drive",
-    "date": "2020-12-31 19:07",
-    "category": "development",
-    "description": "It is real pain when you have small SSD and Windows Subsystem for Linux (WSL) is growing exponentially in size. There is no easy way to move the WSL installation to another drive. Here in this blog I will discuss how to tackle this problem with bite size steps.",
-    "slug": "wsl2-move"
-  },
-  {
-    "title": "Create the VLC User Documentation for one Mobile Port(Android)",
-    "date": "2020-12-01 23:47",
-    "category": "blogs",
-    "description": "The project was to Create the VLC User Documentation for Android Mobile Port which was previously hosted on VLC wiki pages. The major portion of this was to start everything from scratch including chapter separation, section organization.",
-    "slug": "gsod2020-report"
-  },
-  {
-    "title": "प्रेम रतन धन पायो",
-    "date": "2019-09-21 15:47",
-    "category": "articles",
-    "slug": "for-sunshine",
-    "description": "प्रकृति की सुंदरता और कलाकारी हिमालय की कण-कण में झलकती है। प्रकृति ने प्रेम को भी हिमालय के जितना ही विशाल और अलौकिक बनाया है । ये एक अलग चर्चा का विषय है कि हिमालय पहले आया या प्रेम। मैं तो प्रेम के पक्ष में हूँ । वो हर अणु-परमाणु जिन्होंने इतने बड़ा पहाड़ खड़ा किया वो सब आपस में प्रेम से बंधे हुए हैं। ये पृथ्वी, सूर्य, चंद्रमा, आकाश-गंगा इत्यादि सब प्रेम से बंधे हुए हैं"
-  },
-  {
-    "title": "The Big Red Ants",
-    "date": "2012-02-27 22:47",
-    "category": "articles",
-    "description": "As I observed them making and reparing their nests, I concluded that they are laborious and intellectual. They create their nests bybinding two or more leaves (maybe up to 500) together. They stich the leaves using a stinky white substance either excreted by themselves or from trees.",
-    "slug": "big-red-ants"
-  }
-]
+[{"title":"Developing Minimal Tekton Server","date":"2022-02-27 20:47","category":"development","description":"This blog is a descreptive account of the development of Minimal Tekton Server. This is highly technical in nature, so please make sure that you have sufficient knowledge about Golang, Docker, Kubernetes and TektonCD. You can refer to my [previous blog](\"https://avinal.space/posts/development/i-am-loving-it-redhat.html\") to know about these topics.","slug":"lovely-dangerous-things-redhat","image":"/images/development.webp"},{"title":"I am loving it! RedHat","date":"2022-02-25 20:47","category":"development","description":"I made it to the Red Hat as a DevTools intern. This post is about onboarding and how I prepared myself for working on the actual project.","slug":"i-am-loving-it-redhat","image":"/images/fedora-wall.webp"},{"title":"Google Summer of Code 2021","date":"2021-08-19 23:07","category":"development","description":"This is the final report of my Google Summer of Code 2021 at The FOSSology Project. One of the major improvements over the previous build system is faster build times. CMake generates parallel build-enabled configurations for all generators.","slug":"final-evaluation","image":"/images/gsoc-wall.webp"},{"title":"How I implemented WakaTime embeddable Coding Graph GHA?","date":"2021-02-02 21:47","category":"development","description":"If you use WakaTime to track your coding activity. You can add that to your README as a bar graph or embed it in your blog/portfolio. Just add this action to any of your repositories and there you have it.","slug":"wakatime","image":"/images/waka.webp"},{"title":"HRT (Hudson River Trading) Systems Internship Interview Experience","date":"2021-01-04 21:47","category":"blogs","slug":"hrt-interview-1","description":"uestions were clear and of medium level. But they were designed in such a way that you must know the basics before you could attempt. Also, they expected a clear and concise approach.","image":"/images/hrt-singapore.webp"},{"title":"Move WSL 2 Safely to another Drive","date":"2020-12-31 19:07","category":"development","description":"It is real pain when you have small SSD and Windows Subsystem for Linux (WSL) is growing exponentially in size. There is no easy way to move the WSL installation to another drive. Here in this blog I will discuss how to tackle this problem with bite size steps.","slug":"wsl2-move","image":"/images/windows-wsl2.webp"},{"title":"Create the VLC User Documentation for one Mobile Port(Android)","date":"2020-12-01 23:47","category":"blogs","description":"The project was to Create the VLC User Documentation for Android Mobile Port which was previously hosted on VLC wiki pages. The major portion of this was to start everything from scratch including chapter separation, section organization.","slug":"gsod2020-report","image":"/images/day-of-cone.webp"},{"title":"प्रेम रतन धन पायो","date":"2019-09-21 15:47","category":"articles","slug":"for-sunshine","description":"प्रकृति की सुंदरता और कलाकारी हिमालय की कण-कण में झलकती है। प्रकृति ने प्रेम को भी हिमालय के जितना ही विशाल और अलौकिक बनाया है । ये एक अलग चर्चा का विषय है कि हिमालय पहले आया या प्रेम। मैं तो प्रेम के पक्ष में हूँ । वो हर अणु-परमाणु जिन्होंने इतने बड़ा पहाड़ खड़ा किया वो सब आपस में प्रेम से बंधे हुए हैं। ये पृथ्वी, सूर्य, चंद्रमा, आकाश-गंगा इत्यादि सब प्रेम से बंधे हुए हैं","image":"/images/fedora-night.webp"},{"title":"The Big Red Ants","date":"2012-02-27 22:47","category":"articles","description":"As I observed them making and reparing their nests, I concluded that they are laborious and intellectual. They create their nests bybinding two or more leaves (maybe up to 500) together. They stich the leaves using a stinky white substance either excreted by themselves or from trees.","slug":"big-red-ants","image":"/images/ants.webp"}]

src/Pages/Posts.elm

@@ -34,6 +34,7 @@ type alias JsonMeta =
     , description : String
     , category : String
     , slug : String
+    , image : String
     }
 
 
@@ -124,7 +125,7 @@ view model =
                 first :: rest ->
                     Html.div [ class "max-w-6xl p-6 mx-auto space-y-6 sm:space-y-12 mb-16" ]
                         [ Html.a [ class "block max-w-sm gap-3 mx-auto sm:max-w-full group hover:no-underline focus:no-underline lg:grid lg:grid-cols-12 bg-neutral-900", href ("/posts/" ++ first.category ++ "/" ++ first.slug) ]
-                            [ Html.img [ class "object-cover w-full h-64 rounded sm:h-96 lg:col-span-7", src unsplash ] []
+                            [ Html.img [ class "object-cover w-full h-64 rounded sm:h-96 lg:col-span-7", src first.image ] []
                             , Html.div [ class "p-6 space-y-2 lg:col-span-5" ]
                                 [ Html.h3 [ class "text-2xl font-semibold sm:text-4xl group-hover:underline group-focus:underline" ]
                                     [ Html.text first.title ]
@@ -142,7 +143,7 @@ view model =
         card : JsonMeta -> Html msg
         card blog =
             Html.a [ class "max-w-sm  mx-auto group hover:no-underline focus:no-underline bg-neutral-900", href ("/posts/" ++ blog.category ++ "/" ++ blog.slug) ]
-                [ Html.img [ class "object-cover w-full h-44 rounded", src unsplash ] []
+                [ Html.img [ class "object-cover w-full h-44 rounded", src blog.image ] []
                 , Html.div [ class "p-6 space-y-2" ]
                     [ Html.h3 [ class "text-2xl font-semibold group-hover:underline group-focus:underline" ] [ Html.text blog.title ]
                     , Html.span [ class " text-gray-400" ] [ Html.text blog.date ]
@@ -191,9 +192,10 @@ view model =
 
 jsonMetaDecoder : Json.Decoder JsonMeta
 jsonMetaDecoder =
-    Json.map5 JsonMeta
+    Json.map6 JsonMeta
         (Json.field "title" Json.string)
         (Json.field "date" Json.string)
         (Json.field "description" Json.string)
         (Json.field "category" Json.string)
         (Json.field "slug" Json.string)
+        (Json.field "image" Json.string)

static/images/info.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 512"><!--! Font Awesome Pro 6.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M144 80c0 26.5-21.5 48-48 48s-48-21.5-48-48s21.5-48 48-48s48 21.5 48 48zM0 224c0-17.7 14.3-32 32-32H96c17.7 0 32 14.3 32 32V448h32c17.7 0 32 14.3 32 32s-14.3 32-32 32H32c-17.7 0-32-14.3-32-32s14.3-32 32-32H64V256H32c-17.7 0-32-14.3-32-32z"/></svg>