fix: Fixed overflowing code tags

[SindreKjelsrud]

Closes issue #2316.

Screenshot:

Summary by CodeRabbit

• Style
  • Improved code block display to allow long lines to wrap instead of overflow, enhancing readability for code snippets.

[coderabbitai]

Walkthrough

The PR adds word-wrap: break-word to code block styling in the theme CSS file, enabling long code tokens to wrap within their containers instead of overflowing. A trailing newline is also inserted as a formatting adjustment.

Changes

Cohort / File(s)	Summary
CSS Code Block Styling themes/hugo-theme-altinn/static/css/theme.css	Added word-wrap: break-word declaration to code block styles for improved text wrapping behavior; trailing newline inserted

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

---

A single line of CSS breaks the chain,
Where words once wandered far and wide in vain,
Now code blocks wrap with grace and care,
No overflow despair—just words that share! 📦✨

---

Note: The tone instructions reference documentation review in en-US, nb-NO, and nn-NO, though this PR contains no documentation changes.

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title Check	✅ Passed	The pull request title "fix: Fixed overflowing code tags" directly and accurately describes the main change in the changeset. The modification adds word-wrap: break-word to code blocks in the theme CSS to resolve the code overflow issue (#2316), which is precisely what the title conveys. The title is concise, uses clear and specific language, and avoids vague terms or noise. A teammate scanning the pull request history would immediately understand that this change addresses a visual rendering problem with code elements.
Docstring Coverage	✅ Passed	No functions found in the changes. Docstring coverage check skipped.

✨ Finishing touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (1)

themes/hugo-theme-altinn/static/css/theme.css (1)

644-644: Inconsistent indentation and consider modern property name.

Line 644 uses a tab character for indentation while the surrounding properties (lines 640–643) use spaces, creating inconsistency within the CSS block.

Additionally, while word-wrap: break-word is widely supported, consider pairing it with the modern standard property overflow-wrap: break-word for improved future compatibility:

 code {
     border-radius: 2px;
     white-space: nowrap;
     color: #5e5e5e;
     background: #FFF7DD;
     border: 1px solid #fbf0cb;
     padding: 0px 2px;
     white-space : pre-wrap !important;
-    word-wrap: break-word;
+    word-wrap: break-word;
+    overflow-wrap: break-word;
 }

This ensures code tokens wrap reliably across all browsers.

📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between c0a40ce and 91ca826.

📒 Files selected for processing (1)

• themes/hugo-theme-altinn/static/css/theme.css (2 hunks)