feat(footer): improve footer layout with additional content and styling by Shamanth-Kumar-K · Pull Request #55 · open-devhub/website

Shamanth-Kumar-K · 2026-07-31T08:20:27Z

Description

This pull request improves the footer section by making better use of the previously empty space.

Changes made

Added meaningful informational content to the footer.
Improved the footer layout and styling.
Reorganized footer logos/components for better visual balance.
Enhanced the overall appearance while keeping the design responsive.

Testing

Verified that the website runs successfully.
Checked that the footer renders correctly after the changes.
Confirmed that the updated layout looks clean and consistent.

Image of the Output

devhub-bot · 2026-07-31T08:20:31Z

Warning

Some commit messages in this PR do not follow the Conventional Commits specification.

Expected format: type(scope): description

📋 Invalid commit messages

PR title does not follow Conventional Commits: Improve footer layout with additional content and styling

Tip

Valid types:
feat, fix, docs, style, refactor, perf, test, build, ci, chore, revert

Note

This is just a friendly reminder and will not block the PR from being merged.

devhub-bot · 2026-07-31T10:38:34Z

Note

Linting checks passed successfully 🎉

All formatting and code quality checks are clean.

You're good to merge 🚀

calebephrem

Amazing work!

But under the HIGHLIGHTS section we're being kind of repetitive, because we already have /pages/getting-started, /resources and /partners linked in the NAVIGATE section.
There is also a mistake: /partners is not open source contribution page

So, maybe instead make the links (and the labels) point to pages:

/pages/privacy-policy
/pages/security-notice
/pages/code-of-conduct and
/pages/acknowledgements

In order ;]

Shamanth-Kumar-K · 2026-07-31T10:59:01Z

@calebephrem sure i will update the changes asked.

calebephrem · 2026-07-31T10:59:25Z

Yessur.

beetle-ai · 2026-07-31T15:22:44Z

Summary by Beetle

This PR enhances the website footer component by significantly improving its layout and content structure. The changes transform the footer from a simple icon-based social links section into a more comprehensive footer with highlighted content sections, better visual organization, and improved user engagement. The footer now features a 4-column grid layout (instead of 3), adds a new "Highlights" section with curated links to important pages (Privacy Policy, Security Notice, Code of Conduct, and Acknowledgements), and redesigns the community social links from compact icon buttons to more accessible text-labeled links with better hover states.

📁 File Changes Summary (Consolidated across all commits):

File	Status	Changes	Description
`components/site/Footer.tsx`	Modified	+183/-59	Enhanced footer component with improved layout, new highlights section featuring Privacy Policy, Security Notice, Code of Conduct, and Acknowledgements links. Redesigned social community links from icon-only buttons to text-labeled links with better accessibility and hover states. Changed grid layout from 3 to 4 columns. Added SVG icons for highlight items and improved visual hierarchy with better spacing and typography.

Total Changes: 1 file changed, +183 additions, -59 deletions

🎯 Key Changes:

New Highlights Section: Added a dedicated "Highlights" section in the footer with 4 curated links (Privacy Policy, Security Notice, Code of Conduct, Acknowledgements), each with custom SVG icons and hover effects
Improved Grid Layout: Expanded footer grid from 3 columns to 4 columns to accommodate the new highlights section
Redesigned Social Links: Transformed community social links (Discord, GitHub, Email) from compact icon-only buttons to full-width text-labeled links with icons and labels, improving accessibility and discoverability
Enhanced Visual Design: Added group hover effects, improved spacing with flex-col gap-3, better color transitions, and consistent styling with the design system
Better Accessibility: Social links now display text labels alongside icons, making them more discoverable and accessible to users
Refined Icons: Updated SVG icons for highlight items to better represent their purpose (shield for privacy/security, people for code of conduct, heart for acknowledgements)
Typography Improvements: Maintained consistent use of var(--font-geist-mono) for footer text and improved color contrast with text.veryDim styling

📊 Impact Assessment:

Security: No direct security implications. The addition of Privacy Policy, Security Notice, and Code of Conduct links actually improves transparency and user trust by making important legal/policy documents more discoverable in the footer.
Performance: Minimal performance impact. The changes add a small amount of JSX markup and SVG inline content, but no additional API calls or heavy computations. The component remains lightweight and performant.
Maintainability: Improved maintainability through better code organization. The highlightItems array follows the same pattern as footerLinks, making it easy to add/remove highlight items in the future. The refactored social links structure is more readable and follows consistent patterns with the rest of the footer.
Testing: The changes introduce new interactive elements (hover states, new links) that should be tested. Recommend testing: (1) responsive behavior of the 4-column grid on mobile/tablet/desktop, (2) hover state transitions on social links and highlight items, (3) link functionality for all new highlight pages, (4) accessibility with screen readers for the new text labels on social links.

⚙️ Settings

Severity Threshold: Medium — Balanced feedback — medium and high severity issues only. — Change in Settings
Custom Rules: Define your own review rules — Set Custom Rules
PR Summary: Configure PR summary — Change in Settings

📖 User Guide

Once repos are connected, PR analysis is automatically enabled. You can disable analysis for this repo from beetleai.dev/analysis
Comment @beetle on any PR to start analysis manually
Comment @beetle stop to stop any ongoing analysis

Follow us: Beetle · X · LinkedIn

beetle-ai · 2026-07-31T15:23:42Z

+                color: accent.indigoLightest,
+              }}
+            >
+              Highlights
+            </h4>
+            <ul className="space-y-3 mb-6">
+              {highlightItems.map((item) => (
+                <li key={item.label}>
+                  <Link
+                    href={item.href}
+                    className="flex items-center gap-2 text-sm transition-colors hover:text-[#a5b4fc]"


The new Highlights section uses the Link component (line 264), but there's no visible import statement for it in the patch. If Link is not imported from next/link or another source, this will cause a runtime error.

Confidence: 4/5

Suggested Fix

Verify that Link is imported at the top of the file. If not present, add:

Suggested change

color: accent.indigoLightest,

}}

>

Highlights

</h4>

<ul className="space-y-3 mb-6">

{highlightItems.map((item) => (

<li key={item.label}>

<Link

href={item.href}

className="flex items-center gap-2 text-sm transition-colors hover:text-[#a5b4fc]"

import Link from "next/link";

This import should be added to the imports section at the beginning of the file (typically near other React/Next.js imports).

Prompt for AI

Copy this prompt to your AI IDE to fix this issue locally:

In components/site/Footer.tsx, the new Highlights section uses the Link component starting at line 264, but the import statement for Link from "next/link" may be missing. Add the import statement at the top of the file if it's not already present: import Link from "next/link";

📍 This suggestion applies to lines 264-274

devhub-bot · 2026-07-31T15:31:26Z

Note

Linting checks passed successfully 🎉

All formatting and code quality checks are clean.

You're good to merge 🚀

calebephrem

LGTM

calebephrem · 2026-07-31T15:33:41Z

@Shamanth-Kumar-K thank you for contributing!

Shamanth-Kumar-K · 2026-07-31T15:35:09Z

@calebephrem Thanks for the Opportunity 😊

calebephrem · 2026-07-31T15:37:31Z

Thank you as well!

feat: adding footer content to improve footer layout

228f3c7

devhub-bot Bot added the feat New feature label Jul 31, 2026

Shamanth-Kumar-K changed the title ~~Improve footer layout with additional content and styling~~ feat(footer): improve footer layout with additional content and styling Jul 31, 2026

vercel Bot deployed to Preview July 31, 2026 10:38 View deployment

calebephrem requested changes Jul 31, 2026

View reviewed changes

calebephrem self-assigned this Jul 31, 2026

calebephrem linked an issue Jul 31, 2026 that may be closed by this pull request

Replace the huge empty area in the footer with some text #43

Closed

fix: address review comments

d5cd7f3

beetle-ai Bot reviewed Jul 31, 2026

View reviewed changes

vercel Bot deployed to Preview July 31, 2026 15:30 View deployment

calebephrem approved these changes Jul 31, 2026

View reviewed changes

calebephrem merged commit 4c451b3 into open-devhub:main Jul 31, 2026
5 checks passed

Uh oh!

Conversation

Shamanth-Kumar-K commented Jul 31, 2026

Description

Changes made

Testing

Image of the Output

Uh oh!

devhub-bot Bot commented Jul 31, 2026

Uh oh!

devhub-bot Bot commented Jul 31, 2026

Uh oh!

calebephrem left a comment

Choose a reason for hiding this comment

Uh oh!

Shamanth-Kumar-K commented Jul 31, 2026

Uh oh!

calebephrem commented Jul 31, 2026

Uh oh!

beetle-ai Bot commented Jul 31, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by Beetle

📁 File Changes Summary (Consolidated across all commits):

🎯 Key Changes:

📊 Impact Assessment:

Uh oh!

beetle-ai Bot Jul 31, 2026

Choose a reason for hiding this comment

Uh oh!

devhub-bot Bot commented Jul 31, 2026

Uh oh!

calebephrem left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

calebephrem commented Jul 31, 2026

Uh oh!

Shamanth-Kumar-K commented Jul 31, 2026

Uh oh!

calebephrem commented Jul 31, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

beetle-ai Bot commented Jul 31, 2026 •

edited

Loading