Skip to content

[BUG] The Header Is Not Working #2

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
Fluffy728 opened this issue Feb 28, 2025 · 5 comments
Closed

[BUG] The Header Is Not Working #2

Fluffy728 opened this issue Feb 28, 2025 · 5 comments
Assignees
@mcgdj
Labels
bug Something isn't working
Milestone
Coding Hut Websit...

Comments

@Fluffy728
Copy link
Member

Describe the bug
The header is not working, it shows lines instead of text.

To Reproduce
Go to the website and you will see the issue.

Expected behavior
It to have clear links between each pages..

Screenshots
It does not let me add any

Desktop (please complete the following information):

  • OS: MacBook OS
  • Browser safari
  • Version the latest

Smartphone (please complete the following information):
Device iPad 10
OS: the latest
Browser: Safari

Additional context
Add any other context about the problem here.
@Fluffy728 Fluffy728 added the bug Something isn't working label Feb 28, 2025
@Fluffy728
Copy link
Member Author

Ok how will we fix this?

@mcgdj
Copy link
Collaborator

mcgdj commented Mar 1, 2025

I see. Here's what I found:
The issue seems to be that the navigation header is displaying as lines instead of text. Here are some potential causes and solutions:

Potential Issues & Fixes:

  1. CSS Link Color Issue:

    • the menu links inside <nav> use this CSS: 
      .menu-container a {
  text-decoration: none;
  color: #c04d4d;
}
      • The link color #c04d4d (a shade of red) may blend with the background.
      • Fix: Change it to white for visibility: 
        .menu-container a {
  color: #ffffff; /* White */
}

  2. Missing nav Closing Tag & Placement:

    • the <nav> is inside <head>, which is incorrect. It should be inside <body>.
    • Fix: Move <nav> inside <body> and close <head> properly: 
      </head>
<body>
<nav class="menu-container">

  3. Input Checkbox Causing Layout Issues:

    • The checkbox used for the mobile menu may be affecting styling.
    • If you don’t need a mobile burger menu, remove this: 
      <input type="checkbox" aria-label="Toggle menu" />
<span></span>
<span></span>
<span></span>

  4. Broken Link for the Logo:

    • the <a> tag for the logo has an incorrect href: 
      <a href="scratch-coding-hut.github.io" class="menu-logo">
      • Fix: Add https:// to the link: 
        <a href="https://scratch-coding-hut.github.io" class="menu-logo">

Note:

  • I'll apply the fixes above.
  • Try opening Developer Tools (Cmd + Option + I on Mac) and inspect the <nav> to check if styles are applied correctly.
  • If the issue continues, please let me know.

@Fluffy728
Copy link
Member Author

Okay! That’s probably why. Thanks for telling me!

mcgdj added a commit that referenced this issue Mar 1, 2025
@mcgdj
Update index.html
ee0870c 
Bugfixes related to Issue #2
mcgdj added a commit that referenced this issue Mar 1, 2025
@mcgdj
Update account.html
85068fe 
General improvements; bugfixes related to Issue #2
mcgdj added a commit that referenced this issue Mar 1, 2025
@mcgdj
Update about.html
8be995c 
Bugfixes related to Issue #2
@Fluffy728
Copy link
Member Author

The header is still not working. I’m reopening this issue.

@Fluffy728 Fluffy728 reopened this Mar 1, 2025
@Fluffy728
Copy link
Member Author

It’s only broken on the About page, but we can’t find a fix so far.

@Fluffy728 Fluffy728 closed this as not planned Won't fix, can't repro, duplicate, stale Mar 2, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@mcgdj mcgdj

Labels
bug Something isn't working
Projects
None yet
Milestone
Coding Hut Website Cycle - Tier 1
Development

No branches or pull requests
2 participants
@Fluffy728 @mcgdj