fix: prevent search bar from growing on scroll

[SouparnaChatterjee]

Fixes #215

The search bar grew on scroll because it used 'height: 100%' which animated along with the parent nav's 'transition: .3s ease' when '.nav-bg' was added on scroll.

• Use 'top: 0; bottom: 0' absolute positioning instead of 'height: 100%'
• Center input with 'position: absolute; top: 50%; transform: translateY(-50%)'
• Scope transition to opacity/visibility only, excluding height
• Remove 'h-100' from form element in header partial
• Fix '.Site.DisqusShortname' deprecation warning (Hugo 0.158+)

Summary by CodeRabbit

• New Features

  • Added search bar with dedicated styling and form submission.
  • Added site header with responsive navigation menu, logo, and dropdown support.
  • Added single page template displaying article metadata, featured images, content, related articles, and comments.

• Style

  • Enhanced table of contents link styling with improved formatting.
  • Added search bar layout and appearance rules.

[accesslint]

Found 2 issues across 1 rule.

[accesslint]

WCAG 1.3.1: <ul> contains direct text content. Wrap in <li>.

<ul> and <ol> must only contain <li>, <script>, or <template> as direct children.

Details

Screen readers announce list structure ('list with 5 items') based on proper markup. Placing non-<li> elements directly inside <ul> or <ol> breaks this structure. Wrap content in <li> elements, or if you need wrapper divs for styling, restructure your CSS to style the <li> elements directly.

[accesslint]

WCAG 1.3.1: <ul> contains direct text content. Wrap in <li>.

<ul> and <ol> must only contain <li>, <script>, or <template> as direct children.

Details

Screen readers announce list structure ('list with 5 items') based on proper markup. Placing non-<li> elements directly inside <ul> or <ol> breaks this structure. Wrap content in <li> elements, or if you need wrapper divs for styling, restructure your CSS to style the <li> elements directly.

[coderabbitai]

Warning

Review limit reached

@SouparnaChatterjee, we couldn't start this review because you've reached your PR review rate limit.

More reviews will be available in 39 minutes and 16 seconds. Learn how PR review limits work.

Your organization has used up its prepaid credits, and credit purchases are no longer available. Enable the review add-on in the billing tab to keep reviews running — you're only billed for reviews past your plan's rate limits ($0.25/file).

⌛ How to resolve this issue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available.

Please see our Fair Usage Limits Policy for further information.

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: b1504cab-4762-4385-a3f9-ca93308b7c20

📥 Commits

Reviewing files that changed from the base of the PR and between 516d95e and 80da807.

📒 Files selected for processing (1)

• layouts/partials/header.html

Walkthrough

Three files are added or modified to build out the blog's theme. A new layouts/partials/header.html partial renders a fixed-top Bootstrap navbar with logo, hamburger toggler, Site.Menus.main-driven navigation (including dropdown support), and an optional search widget controlled by Site.Params.search.enable. A new layouts/_default/single.html template defines the single-page layout with title, author/date/category metadata, optional featured image, content, tags, a related-pages section, and conditional Disqus comments. In assets/scss/_mixins.scss, .toc a gains bold text and cursor/spacing rules, a media-query block is reformatted, and a new search bar section adds styles for .search-wrapper, .search-box (with focus state), and .search-close.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Out of Scope Changes check	⚠️ Warning	The PR includes changes beyond the search bar fix: new single.html layout template, new header.html partial, and styling for ToC links and search bar in mixins.scss, which appear unrelated to issue #215.	Remove or separate the unrelated layout templates and focus the PR on search bar styling fixes for issue #215, or create separate PRs for each feature.

✅ Passed checks (4 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 fix: preventing search bar growth during scrolling, which directly addresses the primary issue being resolved.
Linked Issues check	✅ Passed	The PR addresses issue #215 by fixing the search bar animation problem through CSS changes (replacing height with positioning, scoping transitions) and template updates.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

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

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 61a57ff4-fd1f-45ac-b0f3-c543b6841bcc

📥 Commits

Reviewing files that changed from the base of the PR and between db1546d and 516d95e.

📒 Files selected for processing (3)

• assets/scss/_mixins.scss
• layouts/_default/single.html
• layouts/partials/header.html

[accesslint]

Found 1 issue across 1 rule.