Adding media to series and navigation

content/posts/path-of-market/index.md

@@ -3,6 +3,7 @@ draft: false
 title: "Path of Market: Part 1"
 aliases: ["Path of Market: Part 1"]
 series: ["path-of-market"]
+series_order: 1
 author: "Nick Dumas"
 cover: ""
 description: "Tracking market trends in Path of Exile with Prometheus"
@@ -26,7 +27,7 @@ This API is what powers the market for the Path of Exile community. There's [qui
 
 What I found fascinating, though, is the ability to monitor trends, more than finding individual items. As a former EVE player, I was used to relatively advanced market features like price histories, buy/sell orders, advanced graphing options etc and it's something I've missed everywhere I've gone since. After some investigation, I found that Prometheus and Grafana could offer a powerful base to build upon. Prometheus is a tool for storing time-based "metrics", and Grafana is a visualizer that can connect to Prometheus and other data sources and provide graphs, charts, tables, and all sorts of tools for seeing your data. Below is an example of a chart showing memory usage on a Kubernetes pod.
 
-{{< figure src="/img/grafana-mem-usage.png" caption="Grafana memory usage chart">}}
+{{< figure src="" alt="Original image lost." caption="Grafana memory usage chart">}}
 
 # First Steps
 
@@ -34,8 +35,7 @@ Obviously, the first step is talking to the official Path of Exile API and getti
 
 A particularly fun challenge was this one, describing how "gem" items could be slotted into an item. This was a challenge because the API can return either a string *or* a boolean for a specific set of fields. This is, in my opinion, not as "well behaved" API but you don't always get the luxury of working with ones that are well behaved. This unmarshaling solution helps account for this inconsistency and populates the relevant fields accordingly.
 
-{{< highlight go "linenos=table" >}}
-
+```go
 type SocketAttr struct {
         Type  string
         Abyss bool
@@ -79,14 +79,14 @@ func (sc *SocketColour) UnmarshalJSON(data []byte) error {
         }
         return nil
 }
+```
 
-{{< /highlight >}}
 
 With that done, I had passing tests that parsed a variety of sample items I had manually extracted from the API. Next was turning these into a "stream" that I could process. Channels seemed like a natural fit for this task; the API did not guarantee any number of results at any time and only declares that you periodically request the last ID you were given by the API.
 
 The full code is [here](https://github.com/therealfakemoot/pom/blob/master/poe/client.go), but I'll highlight the parts that are interesting, and not standard issue HTTP client fare.
 
-{{< highlight go >}}
+```go
 		d := json.NewDecoder(resp.Body)
 		err = d.Decode(&e)
 		if err != nil {
@@ -103,6 +103,6 @@ The full code is [here](https://github.com/therealfakemoot/pom/blob/master/poe/c
 		for _, stash := range e.Stashes {
 			sa.Stashes <- stash
 		}
-{{< /highlight >}}
+```
 
 This snippet is where the magic happens. JSON gets decoded, errors are pushed into a channel for processing. Finally, stashes are pushed into a channel to be consumed outside inside the main loop. And here's where I'll leave off for now. There's quite a bit more code to cover, and I'm still refactoring pieces of it relatively frequently, so I don't want to write too much about things that I expect to change.

content/posts/series-and-navigation/index.md

@@ -3,6 +3,7 @@ draft: false
 title: "Adding Series and Navigation links to Hugo page"
 aliases: ["Adding Series and Navigation links to Hugo page"]
 series: ["blogging-with-quartz"]
+series_order: 3
 date: "2023-03-07"
 author: "Nick Dumas"
 cover: ""
@@ -40,9 +41,9 @@ Hugo helps us here by providing [page variables](https://gohugo.io/variables/pag
     {{partial "prev-next.html" .}}
 ```
 
-Just a few `if` statements and calling `.Permalink` to get a URL. I chose to use the `*InSection` variants because I probably will be introducing more content types over time and I may as well fix this beforehand.
+Just a few `if` statements and calling `.Permalink` to get a URL. I chose to use the `*InSection` variants because I probably will be introducing more content types over time and I may as well fix this beforehand. Below is `layouts/partials/prev-next.html`
 
-```html {title="layouts/partials/prev-next.html"}
+```html
 {{ if or .NextInSection .PrevInSection }}
 <nav class="pagination">
     {{ if .PrevInSection }}
@@ -67,8 +68,8 @@ Just a few `if` statements and calling `.Permalink` to get a URL. I chose to use
 {{ end }}
 ```
 
- There's also a small block of custom CSS, necessary to reset some padding and make the links flow horizontally with a bit of a margin to keep them legible.
-```css {title="asset/styles/custom.scss"}
+ There's also a small block of custom CSS, necessary to reset some padding and make the links flow horizontally with a bit of a margin to keep them legible. Shown is  a portion of `asset/styles/custom.scss`.
+```css 
 ...
 nav.pagination {
                 border: 1px solid black;
@@ -130,7 +131,10 @@ This generates a short list linking to all the other posts in a given series.
 }
 ...
 ```
-![[Resources/attachments/series-insert-example.png]]
+
+
+{{< figure src="series-insert-example.png" alt="Screenshot of text on a website describing an article and its membership in a series called 'blogging-with-qurtz' " caption="You can even click the name to take you to a list of the rest of the posts in the series">}}
+
 ## Webdev is tedious 
 I'd love to be able to test this locally. It only takes approximately thirty seconds from pushing a change to having a fresh build of the site, but that's still hella slow when you're trying to rapidly iterate on CSS and stuff.