day 2

Author: lostluck

content/posts/2025-01-02-css-flows.md

@@ -0,0 +1,72 @@
+---
+title: "Css Flows"
+date: 2025-01-02T08:04:56-08:00
+tags: [dev, distractions, website]
+categories: [Dev]
+---
+
+I figured out what was bothering me about the post layout, and it's CSS.
+
+<!--more-->
+
+I write these in Markdown. When they get rendered as a site, there are a few
+expectations to how that will work. Lets you infer how it's supposed to look
+in the final render, while also allowing you to make the actual markdown text
+file look good and easy to read.
+
+The standard rule is that a single line break between text in the markdown file
+should be ignored, and it'll get re-flowed in the rendered version.
+
+```
+This is funny spaced
+text
+for example
+purposes. 
+```
+
+Note how there it's written on several different lines. Instead, it should look
+like the paragraph below.
+
+*This is funny spaced
+text
+for example
+purposes.*
+
+See how it renders all on one line, with the expected line wrappings.
+
+This was happening because the default style for the blog posts was using a
+CSS feature called `white-space: pre-wrap` which basically assumes that you want
+to maintain any existing spacing and line breaks. This means that it made all
+the linebreaks in the markdown file to be significant. There's nothing wrong
+with it, it's just unexpected. But I don't want to have to think about layout,
+so I've turned that back to normal.
+
+A second feature that was on was `text-justify`. This spread the text across a
+line so it will largely fill a column. In multi-column layouts, this is probably
+a good thing. It also allows for meaningful hyphenation at line ends. 
+However, it makes all the paragraphs look the same! It's too easy to lose your
+space. I've turned those off for now, since this isn't print media. I don't have
+as much to worry about.
+
+I like how the paragraphs have a different, wobbly right edge. Makes it easier
+for me to read. Benefit of my own space. I can do what I like. I reserve the
+right to change it later. It might be fine with other adjustments too.
+
+I was a little concerned that changing these would affect the code rendering
+and highlighting, that this hugo theme made quite handy:
+
+```go
+import "fmt"
+
+func main() {
+    fmt.Println("Hello, World!")
+    if true {
+        fmt.Println("Very long run on sentence just to see what happens if the text needs to wrap or something like that.")
+    }
+}
+```
+
+But it looks fine to me. The renderer has too many additional structures and
+wrappings to make sure the syntax highlighting is correct.
+
+I'll take it.

themes/hugo-coder/assets/scss/_content.scss

@@ -59,7 +59,7 @@
       // hyphens: auto;
 
       white-space: normal;
-      width: 70rem;
+      width: 60rem;
     }
   }