Skip to content

fix/mobile-navbar-improvements#3062

Open
Adarshkumar0509 wants to merge 1 commit into
OWASP:masterfrom
Adarshkumar0509:fix/mobile-navbar-improvements
Open

fix/mobile-navbar-improvements#3062
Adarshkumar0509 wants to merge 1 commit into
OWASP:masterfrom
Adarshkumar0509:fix/mobile-navbar-improvements

Conversation

@Adarshkumar0509
Copy link
Copy Markdown
Contributor

@Adarshkumar0509 Adarshkumar0509 commented Jun 3, 2026

Description

Redesigns the OWASP Cornucopia site header navigation to match the mobile/desktop layout from the redesign demo, with mentor feedback applied.

Changes:

1.} Replace the legacy mobile dropdown with a left slide-out drawer (backdrop, hamburger toggle, section label for “Get Cornucopia” sublinks).
2.} Add the OWASP wordmark header logo (cornucopia_logo_white_with_text_owasp.svg) instead of plain text branding.
3.} Keep desktop navigation: horizontal links, “Get Cornucopia” checkbox dropdown, and “Play Online” CTA.
4.} Scope nav CSS to .top-nav / .mobile-drawer so global nav flex rules no longer break the drawer layout.
5.} Mobile menu: tighter vertical spacing, readable font sizes, smaller “Play Online” button, no language list in the drawer (per design review).

fixed issue: #2194

AI Tool Disclosure

  • My contribution does not include any AI-generated content
  • My contribution includes AI-generated content, as disclosed below:
    • AI Tools: ` ChatGPT
    • LLMs and versions: GPT-4.1
    • Prompts: It help me for thinking and giving ideas and helping me to fix some issue as well where i got confused

Affirmation

Replace the legacy mobile dropdown with a slide-out drawer, add the branded header logo, and apply mobile menu spacing from design review.
@Adarshkumar0509
Copy link
Copy Markdown
Contributor Author

hii @sydseter please take a look at this.

@sydseter
Copy link
Copy Markdown
Collaborator

sydseter commented Jun 5, 2026

@Adarshkumar0509 instead of taking the user to /copi when pressing Play Online, could we instead be taken to https://copi.owasp.org/ ?

@sydseter
Copy link
Copy Markdown
Collaborator

sydseter commented Jun 5, 2026

Not very serious, but on Desktop and Pads the Ge Cornucopia sub-menu is pulling a lot to the left for no reason. Which disturbs a bit.

On IPad Mini (Using the Chrome developer tools and selecting the device), the Play online is pushing against the frame so that you get a white vertical border. I am not sure what is the best here. Either hide it, or make it scrollable. Perhaps I have a soultion for you.

Instead of "Play Online" simply use "Play". That will probably take care of it. When the user presses the button, take them to copi.owasp.org

web

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants