Improve readability of text above Figure 4.18 in Chapter 4 docs

[manash213cyber]

Ref #485

This PR improves the readability of the text above Figure 4.18 by wrapping it
in a Docusaurus note, which provides better contrast in both light and dark
themes.

During investigation, I found that the low-contrast labels inside Figure 4.18
are part of the image asset itself, so adjusting them would require updating
the image rather than CSS or Markdown. This PR focuses on improving the
surrounding documentation text.

Changes done:

• Improved readability of the text above Figure 4.18 using a Docusaurus note

Screenshots:

(Add before/after screenshot showing the text readability improvement)

Preview Link(s):

(Will be added after checks complete)

✅️ By submitting this PR, I have verified the following

• Checked to see if a similar PR has not already been opened 🤔️
• Reviewed the contributing guidelines 🔍️
• Sample preview link added (will add after checks complete)
• Tried squashing the commits into one

Summary by CodeRabbit

• Documentation
  • Reformatted a properties entry into a highlighted note for clearer presentation and improved readability.
• Chores
  • Cleaned up theme configuration to adjust which stylesheet is applied, simplifying the effective CSS load order.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

Walkthrough

This pull request makes two documentation/configuration edits. In docs/chapter4/8misc.md, a sentence in the Adder section ("Properties that can be customized in the PROPERTIES panel include: Direction") is moved into a note admonition block. In docusaurus.config.js, the require.resolve('./src/css/custom.css') entry was removed from the customCss array, leaving only theme.css and darkTheme.css.

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 title accurately describes the main change: wrapping text above Figure 4.18 in a note admonition for improved readability, matching the primary modification in the changeset.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

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

---

📜 Recent review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 68209ea and c4363e7.

📒 Files selected for processing (2)

• docs/chapter4/8misc.md
• docusaurus.config.js

🚧 Files skipped from review as they are similar to previous changes (2)

• docusaurus.config.js
• docs/chapter4/8misc.md

---

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: 1

🧹 Nitpick comments (1)

docs/chapter4/8misc.md (1)

141-143: Apply note formatting consistently across all sections.

While wrapping this properties line in a note block improves readability for the Adder section, similar lines at other locations in this file (lines 24, 287, 330, 403, 431, 493) remain as plain blockquotes. This creates visual inconsistency.

For a cohesive user experience, consider applying the same note block formatting to all "Properties that can be customized..." statements throughout the document, or clarify why only the Adder section requires this treatment.

🔎 Proposed fix to apply note formatting consistently

For example, at line 24 (ALU section):

-> Properties that can be customized in the **PROPERTIES** panel include: **Direction, BitWidth**
+:::note
+Properties that can be customized in the **PROPERTIES** panel include: **Direction, BitWidth**
+:::

And similarly for lines 287, 330, 403, 431, and 493.

📜 Review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between bace6c5 and e8c7476.

📒 Files selected for processing (3)

• docs/chapter4/8misc.md
• docusaurus.config.js
• src/css/custom.css

🔇 Additional comments (2)

src/css/custom.css (1)

1-8: PR scope mismatch: CSS changes not mentioned in PR objectives.

The PR description states it "focuses only on surrounding documentation text" and mentions wrapping text in a note block, but this file introduces site-wide responsive iframe styling. While this is a useful enhancement, it appears to exceed the stated scope of the PR.

Consider either:

• Updating the PR description to document these CSS changes and their purpose
• Moving the responsive iframe styling to a separate PR if it addresses a different issue

docusaurus.config.js (1)

35-39: LGTM!

The CSS file inclusion is correctly implemented using require.resolve() and follows the existing pattern for other CSS files in the array.

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (1)

docusaurus.config.js (1)

37-37: Restore the trailing comma for consistency and maintainability.

The PR description mentions "Deleted the custom.css reference from docusaurus.config.js," but the actual change here is just removing a trailing comma. This creates two concerns:

1. Inconsistency within the array: Line 36 has a trailing comma, but line 37 doesn't. This inconsistency can be confusing.
2. Modern JavaScript best practice: Trailing commas in arrays and objects are recommended in modern JavaScript because they produce cleaner diffs when adding new elements in the future.

Consider restoring the trailing comma to maintain consistency with line 36 and follow best practices.

🔎 Proposed fix

-					require.resolve('./src/css/darkTheme.css')
+					require.resolve('./src/css/darkTheme.css'),

📜 Review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between e8c7476 and 68209ea.

📒 Files selected for processing (1)

• docusaurus.config.js

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)

• GitHub Check: Redirect rules - wizardly-perlman-2ed351
• GitHub Check: Header rules - wizardly-perlman-2ed351
• GitHub Check: Pages changed - wizardly-perlman-2ed351