Build a Reusable Mega Navbar - Step 6

Español JavaScript
1

Tell us what’s happening:

Ayudeme no se como hacerlo porfavor y otra cosa donde puedo que me obtorgen los certificados o hablar con alguien quebhaga eso porfavor

Your code so far

<!-- file: index.html -->
<!doctype html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Reusable Navbar</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/18.3.1/umd/react.development.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/18.3.1/umd/react-dom.development.js"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/7.26.3/babel.min.js"></script>
    <script
      data-plugins="transform-modules-umd"
      type="text/babel"
      src="index.jsx"
    ></script>
     <link rel="stylesheet" href="./styles.css" />
  </head>
  <body>
    <div id="root"></div>
    <script
      data-plugins="transform-modules-umd"
      type="text/babel"
      data-presets="react"
      data-type="module"
    >
      import { Navbar } from './index.jsx';
      ReactDOM.createRoot(document.getElementById('root')).render(
        <Navbar />
      );
    </script>
  </body>
</html>

/* file: styles.css */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  --white: #fff;
  --light-grey: #e1e0e0;
  --dark-purple: #7c0e7c;
  --black: #000;
}

body {
  background-color: var(--light-grey);
}

.navbar {
  background-color: var(--white);
}

.navbar ul {
  display: flex;
  justify-content: space-around;
}

.navbar ul li {
  list-style: none;
  border-radius: 4px;
}

.navbar ul li a {
  text-decoration: none;
  color: var(--black);
  padding: 10px;
  display: inline-block;
  width: 100%;
}

button {
  background: transparent;
  border: none;
  font-family: 'Times New Roman', Times, serif;
  padding: 10px;
  font-size: 1rem;
}

.navbar ul .nav-item a:hover {
  background-color: var(--dark-purple);
  color: var(--white);
}

button:hover {
  background-color: var(--dark-purple);
  color: var(--white);
}

.navbar ul .nav-item .sub-menu {
  visibility: hidden;
  opacity: 0;
  position: absolute;
  right: 5%;
  transition: opacity 0.5s ease;
  display: block;
  background-color: var(--white);
}

@media (min-width: 768px) {
  .navbar ul .nav-item .sub-menu {
    right: 15%;
  }
}

@media (min-width: 1024px) {
  .navbar ul .nav-item .sub-menu {
    right: 13%;
  }
}

.navbar ul .nav-item:hover .sub-menu,
.navbar ul .nav-item:focus-within .sub-menu {
  visibility: visible;
  opacity: 1;
}

/* file: index.jsx */

{/* User Editable Region */}

<ul>
  <li>
    <a href="#">Gadgets</a>
  </li>
  <li>
    <a href="#">Widgets</a>
  </li>
</ul>


{/* User Editable Region */}

Your browser information:

User Agent is: Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/142.0.0.0 Mobile Safari/537.36

Challenge Information:

Build a Reusable Mega Navbar - Step 6

2

Hi there!
You added the correct a element, but you changed the initial code
Please reset the lesson and try again, don’t change the starting code

3

Eso hare muchas gracias usted trabaja en la plataforma ?

1 Like
4

I’m afraid I didn’t clearly understand your message.
Did you pass the task eventually?

5

Why are you looking for someone who ‘works on the platform’? I’d just ask directly for what you need.

6

No aun estoy en eso busco a alguien por que quiero hacerle unas preguntas

7

Please just directly ask your questions

8

Pornque necesito hacerle unas pregunta si es que me puede ayudar

9

Please just ask your question

10

Pero usted trabaja hay o es algo de la plataforma ? Igual me comunique por correo sin solucion

11

Please just ask your question. If you never actually ask your question, it will never get answered.

12

Es por el tema de las certificaciones las necesito pero aun no termino los cursos

13

I recommend finishing the courses before trying to claim the certification. We cannot grant certifications to anyone who has not completed the required exams and projects.

14

Eso lo que queria preguntar estoy contra el tiempo y por eso solicitaba esa posibilidad mientras hacia los cursos los necesitaba ya que la ipp me lo solicita

15

We cannot give you the certificates if you have not done the projects and exams