fix: prevent sponsors link from being clipped on mobile navbar

[Adarshkumar0509]

Description

fixed issue: #3085

On mobile, the navbar clips the "Sponsors" link due to whitespace-nowrap on the flex container.

Solution

• Replaced whitespace-nowrap with flex-wrap on the links container div in app.html.heex.
• Reduced nav link font size and padding further to fit all links in a single line on 360px screens (Samsung S8)
• Stretched the nav container to full width so links spread evenly across the navbar on all mobile viewports

Change

• copi.owasp.org/lib/copi_web/components/layouts/app.html.heex

screenshot

AI Tool Disclosure

• My contribution does not include any AI-generated content
• My contribution includes AI-generated content, as disclosed below:
  • AI Tools: [e.g. GitHub CoPilot, ChatGPT, JetBrains Junie etc.]
  • LLMs and versions: [e.g. GPT-4.1, Claude Haiku 4.5, Gemini 2.5 Pro etc.]
  • Prompts: [Summarize the key prompts or instructions given to the AI tools]

Affirmation

• My code follows the CONTRIBUTING.md guidelines

[Adarshkumar0509]

hii @sydseter , please take a look at this , i have verified all changes locally it was working fine.

[sydseter]

Switch the divs that use "sm:block" so that they use "min-[730px]:block" instead. That way, the logos will disappear when they have to disappear.

[sydseter]

Revert the other changes.

[sydseter]

These are the only two lines you need to change:

cornucopia/copi.owasp.org/lib/copi_web/components/layouts/app.html.heex

Line 21 in 456a4ac

<div class="hidden sm:block">

cornucopia/copi.owasp.org/lib/copi_web/controllers/page_html/home.html.heex

Line 120 in 456a4ac

<div class="hidden sm:block">

[sydseter]

@Adarshkumar0509 thank you so much!