finished initial implementation of site and added ci/cd stuffs

.gitlab-ci.yml

@@ -0,0 +1,47 @@
+stages:
+  - build
+  - deploy
+
+develop-build-job:
+  stage: build
+  tags:
+    - hugo
+  script:
+    - echo "Building configuration"
+    - hugo
+  only:
+    - develop
+
+master-build-job:
+  stage: build
+  tags:
+    - hugo
+  script:
+    - echo "Building configuration"
+    - hugo
+  artifacts:
+    paths:
+      - public/
+  only:
+    - master
+
+deploy-job:
+  stage: deploy
+  tags:
+    - hugo
+  environment:
+    name: Production
+    url: "$Live_Server_IP"
+  before_script:
+  - 'command -v ssh-agent >/dev/null || ( apt-get update -y && apt-get install openssh-client -y)'
+  - eval $(ssh-agent -s)
+  - echo "$SSH_PRIVATE_KEY" | tr -d '\r' | ssh-add -
+  - mkdir -p ~/.ssh
+  - chmod 700 ~/.ssh
+  - '[[ -f /.dockerenv ]] && echo -e "Host *\n\tStrictHostKeyChecking no\n\n" >> ~/.ssh/config'
+  script:
+    - tar zcf ../inkletblot-com.tar.gz ./public
+    - scp -o 'ProxyJump "$Live_Server_User"@"$Live_Server_IP"' -o StrictHostKeyChecking=no ../inkletblot-com.tar.gz "$Live_Server_User"@"$Live_Server_Target":/var/www/html
+    - ssh -J "$Live_Server_User"@"$Live_Server_IP" "$Live_Server_User"@"$Live_Server_Target" "rm -Rf /var/www/html/inkletblot-com_old && mv /var/www/html/inkletblot-com /var/www/html/inkletblot-com_old && mkdir /var/www/html/inkletblot-com_build && mkdir /var/www/html/inkletblot-com && tar zxf /var/www/html/inkletblot-com.tar.gz -C /var/www/html/inkletblot-com_build && mv /var/www/html/inkletblot-com_build/dist/inkletblot-com/* /var/www/html/inkletblot-com && rm -Rf /var/www/html/inkletblot-com_build && chmod -R 755 /var/www/html/inkletblot-com && exit"
+  only:
+    - master

assets/_fonts.scss

@@ -1,4 +1,4 @@
-// @font-face{
+@font-face{
-//     font-family: FiraCode;
+    font-family: FiraCode;
-//     src: url(static/fonts/FiraCode-Regular.ttf);
+    src: url(fonts/FiraCode-Regular.ttf);
-// }
+}

assets/_me.scss

@@ -1,12 +1,17 @@
-@use 'variables' as vars;
+@use "variables" as vars;
 
 .home {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    align-items: center;
+
     &__content {
         text-align: justify;
         max-width: 850px;
 
         img {
-            border-radius: 50px;
+            border-radius: 16px;
             float: left;
             margin: 0 24px 16px 0;
         }

assets/_posts.scss

@@ -4,6 +4,7 @@
     &__title {
         margin-bottom: 0;
         padding-bottom: 0;
+        color: vars.$color-orange-dark;
     }
 
     &__date {

assets/_services.scss

@@ -15,13 +15,17 @@
 
         .service {
             width: 45%;
-            // text-align: justify;
+            align-self: center;
+            margin: 8px 0;
+
+            h2 {
+                margin: 0;
+            }
 
             &__text {
-                padding: 4px 4px 4px 0;
+                padding: 2px;
-                line-height: 12px;
+                line-height: 24px;
-                // background: vars.$color-bg0_h;
+                background: vars.$color-bg0_h;
-                background: green ;
             }
         }
     }

assets/style.scss

@@ -9,7 +9,11 @@
 body {
     color: vars.$color-fg;
     background: vars.$color-bg;
-    // font-family: FiraCode, monospace;
+    font-family: FiraCode, monospace;
+}
+
+code {
+    font-family: FiraCode, monospace;
 }
 
 .content-wrapper {
@@ -44,21 +48,27 @@ img {
 }
 
 .header {
+    display: block;
     // background-color: red;
+
     &__title {
         a,
         a:link,
         a:hover,
         a:visited {
-            color: vars.$color-green-dark !important;
+            color: vars.$color-orange-dark !important;
         }
     }
 
     &__nav {
-        display: flex;
+        &__list {
+            display: flex;
+            flex-wrap:wrap;
 
-        &__item {
+            &__item {
-            list-style: none;
+                margin-right: 32px;
+                list-style: none;
+            }
         }
     }
 }
@@ -78,11 +88,11 @@ img {
         a,
         a:link,
         a:visited {
-            color: vars.$color-green-dark;
+            color: vars.$color-orange-dark;
         }
 
         a:hover {
-            color: vars.$color-green;
+            color: vars.$color-orange;
         }
     }
 
@@ -106,6 +116,11 @@ img {
     }
 }
 
+.list {
+    display: flex;
+    flex-direction: column;
+}
+
 .footer {
     // background: purple;
     text-align: center;
@@ -132,5 +147,5 @@ h1,
 h2,
 h3,
 h4 {
-    color: vars.$color-orange-dark;
+    color: vars.$color-green-dark;
 }

content/posts/an-old-new-upgrade-to-my-k8s.md

@@ -26,7 +26,7 @@ however, given that it was being set up on standard x86_64 architecture one
 could pick any of the myriad of guides for setting up rancher (which I set up in
 a VM on my server) with a k3s cluster (the t620s), which is what I did.
 
-![Current Rancher Dashboard](https://gitlab.inkletblot.com/inkletblot/simple-blog-api/-/raw/master/assets/rancher.png)
+![Current Rancher Dashboard](/images/rancher.png)
 
 ## It's Use
 
@@ -52,7 +52,9 @@ setup and I'm very happy with it.
 
 When I started writing this I had a much grander vision for the end result,
 however, it really isn't that grand. The final solution for the CI/CD can be
-found [here](). Using helm simplified things greatly.
+found [here](https://gitlab.inkletblot.com/inkletblot/simple-blog-api). Although
+I don't use the project any more it contains all of the CI/CD config required,
+some of which is outlined below. Using helm simplified things greatly.
 
 ## Extras
 
@@ -209,7 +211,6 @@ through gitlab.
         name: production
 ```
 
-
 That is about all I can come up with at the moment. I hope it is useful for
 someone.
 

content/posts/hardkernel-odroid-kubernetes-cluster.md

@@ -4,8 +4,6 @@ date: 2022-06-16
 draft: false
 ---
 
-## Odroid Cluster
-
 Say hello to my little odroid kubernetes cluster project.
 
 Details are: 5 x Odroid-MC1's as worker nodes. All up 10gb RAM and 40 cores. 1 x
@@ -21,7 +19,7 @@ tutorial loosely and it's all working wonderfully. It's cool to be introduced to
 ansible, which I had heard about but not used before. I'm currently developing
 some apps that I'd like to run on it.
 
-![My odroid MC1 and N2 cluster](https://gitlab.inkletblot.com/inkletblot/simple-blog-api/-/raw/master/assets/odroid-cluster-2.jpg)
+![My odroid MC1 and N2 cluster](/images/odroid-cluster-2.jpg)
 
 -ink
 

content/posts/icons-svgs-fonts-and-icomoon.md

@@ -4,10 +4,6 @@ date: 2021-07-28
 draft: true
 ---
 
-# Icomoon for Icon Managament
-
-## Icons, SVGs, Fonts, and Icomoon.
-
 Early in the year I, for a project at work, was tasked with coming up with a
 solution to deal with icons. We had decided to use FluentUI icons from
 microsoft, but the 2Mb font file that they provide was a bit much to include in

content/posts/this-website.md

@@ -1,24 +1,58 @@
 ---
-title: "This Website"
+title: "This Website - inkletblot.com"
 date: 2021-07-15
 lastmod: 2022-06-13
 draft: false
 ---
 
-# Inkletblot[]().com
+This website has existed in one for or another for upwards of 10 years at this
+point. It is essentially the catalyst for my love of programming, technology,
+and for my choice of study at university, and my career. When I first created it
+I was in my early teens and it was created using solely HTML and CSS. Since then
+each time I learn of some new technology through uni, on my own steam, or at
+work, I rework the site a little bit. The current design is my favourite so far.
+It's also the most complex.
 
-This website has existed in one for or another for upwards of 10 years at this point. It is essentially the catalyst for my love of programming, technology, and for my choice of study at university, and my career. When I first created it I was in my early teens and it was created using solely HTML and CSS. Since then each time I learn of some new technology through uni, on my own steam, or at work, I rework the site a little bit. The current design is my favourite so far. It's also the most complex.
+## A little timeline
 
-### A little timeline
+- 2009 - sites initial creation, very basic hand rolled static site. Contents is
+  a bio and some downloads (probably poorly considered by my teen self) to
+  different things I liked.
 
-* 2009 - sites initial creation, very basic hand rolled static site. Contents is a bio and some downloads (probably poorly considered by my teen self) to different things I liked.
+- 2010-2014 - site remains largely unchanged, it is re-created early on and has
+  downloads removed.
 
-* 2010-2014 - site remains largely unchanged, it is re-created early on and has downloads removed.
+- 2015 - a forum is created (now removed until further notice) and added to the
+  site following a long forgotten tutorial on how to create a PHP based forum.
+  Along with this, the knowledge gained from creating the forum is used to
+  create a very basic gallery. It was open to the public for uploads and there
+  was a global clear button. Very simple comment threads were also used.
 
-* 2015 - a forum is created (now removed until further notice) and added to the site following a long forgotten tutorial on how to create a PHP based forum. Along with this, the knowledge gained from creating the forum is used to create a very basic gallery. It was open to the public for uploads and there was a global clear button. Very simple comment threads were also used.
+- 2018 - a major change occurs. The forum, site, and gallery, are all recreated
+  in angularjs and node APIs are built for the forum and gallery. This came from
+  a web dev topic I completed at uni. Everything looked pretty similar to the
+  previous iteration the implementations were completely new. I hosted the node
+  APIs on the Kubernetes cluster I talk about in another post. Their management
+  was a pain though for reasons I won't get into here which leads me to...
 
-* 2018 - a major change occurs. The forum, site, and gallery, are all recreated in angularjs and node APIs are built for the forum and gallery. This came from a web dev topic I completed at uni. Everything looked pretty similar to the previous iteration the implementations were completely new. I hosted the node APIs on the Kubernetes cluster I talk about in another post. Their management was a pain though for reasons I won't get into here which leads me to...
+- 2020-2021 - the site is rewritten yet again, this time using angular11
+  (something I was introduced to through work). The forum and gallery are
+  removed from the site and instead a simple blog is added. I will cover the
+  simple blog api I have created in another post however you can find it on my
+  [gitlab](https://gitlab.inkletblot.com/inkletblot/simple-blog-api). I do plan
+  on recreating the forum and gallery at some point. However, I think I am going
+  to fucus on this little blog for now. I want to add more content and make it a
+  bit more feature rich if I can.
 
-* 2020-2021 - the site is rewritten yet again, this time using angular11 (something I was introduced to through work). The forum and gallery are removed from the site and instead a simple blog is added. I will cover the simple blog api I have created in another post however you can find it on my [gitlab](https://gitlab.inkletblot.com/inkletblot/simple-blog-api). I do plan on recreating the forum and gallery at some point. However, I think I am going to fucus on this little blog for now. I want to add more content and make it a bit more feature rich if I can.
+  ![My website from 2020-2021](/images/site-2020-2021.png)
 
-* the future - I guess we will see.
+- 2022 - Present. I have re-created the website yet again, this time in using
+  [Hugo](https://gohugo.io/). I originally got the idea from Luke Smith but it's
+  taken me some time to complete this while working on my final year of uni and
+  since I started Hugo has exploded in popularity. The site, including it's
+  posts of which there are few so far, are totally static. Thus the largest part
+  of the site for the user to download is the font I'm using which I think is
+  pretty cool. I indent to continue working on the site and in partuclar the
+  content, which I'm hoping to add to semi-regularly.
+
+- the future - I guess we will see.

layouts/_default/list.html

@@ -1,5 +1,5 @@
 {{ define "main" }}
-	<main>
+	<main class="list">
 		{{ if or .Title .Content }}
 		<div>
 			{{ with .Title }}<h1>{{ . }}</h1>{{ end }}

layouts/index.html

@@ -1,6 +1,8 @@
 {{ define "main" }}
 <div class="main">
 	<main class="main__content">
+        <article><p>This homepage is a work in progress, I hope to find something a little more interesting to put here than a list of posts.</p></article>
+
 		{{ $paginator := .Paginate (where .Site.RegularPages "Type" "in" .Site.Params.mainSections) }}
 		{{ range $paginator.Pages }}
 			{{ .Render "summary" }}

layouts/me/single.html

@@ -1,6 +1,6 @@
 {{ define "main" }}
-<article class="home">
+<div class="home">
     <h1>{{ .Title }}</h1>
     <div class="home__content">{{ .Content }}</div>
-</article>
+</div>
 {{ end }}

layouts/partials/header.html

@@ -4,9 +4,9 @@
     </h1>
     {{ with .Site.Menus.main }}
     <nav class="header__nav">
-        <ul>
+        <ul class="header__nav__list">
             {{ range . }}
-            <li class="header__nav__item">
+            <li class="header__nav__list__item">
                 <a href="{{ .URL | relURL }}">{{ .Name }}</a>
             </li>
             {{ end }}

layouts/services/list.html

@@ -1,14 +1,10 @@
 {{ define "main" }}
 <main class="services">
-    {{ if or .Title .Content }}
+    {{ if or .Title .Content }} {{ with .Title }}
-    <div>
+    <h1 class="services__title">{{ . }}</h1>
-        {{ with .Title }}
+    {{ end }} {{ with .Content }}
-        <h1 class="services__title">{{ . }}</h1>
+    <div class="services__content">{{ . }}</div>
-        {{ end }} {{ with .Content }}
+    {{ end }} {{ end }}
-        <div class="services__content">{{ . }}</div>
-        {{ end }}
-    </div>
-    {{ end }}
 
     <div class="services__list">
         {{ range .Paginator.Pages }} {{ .Render "summary" }} {{ end }}