Skip to content
OverviewSolutions
31
Comments
25

Nadji CHABANE

@CHBNDJ590 points

Starting my career in the transportation business, I began learning coding in April 2023 to gain true freedom — freedom to work anywhere, anytime. I have a passion for building things, and my goal is to create apps that can make a real difference in people's lives every day.

I’m currently learning...

Javascript & React.

Latest solutions

View more solutions

Latest comments

  • Nadji CHABANE•590
    @CHBNDJ

    hi i coudnt go back to the home page once i left it

  • dullarzee•600
    @dullarzee
    What are you most proud of, and what would you do differently next time?

    my first project built with tailwindcss

    What challenges did you encounter, and how did you overcome them?

    well..newly using tailwind is like learning a new language with new syntax

    Bookmark company

    1
    Nadji CHABANE•590
    @CHBNDJ

    nice job overall just a little bit of work for the style but its not the most important i think. I really like your animation for the bookmark, searching and sharing. keep building my friend :)

  • Nadji CHABANE•590
    @CHBNDJ

    Nice I like the slide right and back good effect keep building

  • Nadji CHABANE•590
    @CHBNDJ

    Nice overall great jobs however you should try something like that for the bar below the links nav in your header and footer .navlinks ul { width: 380px; height: 25px; display: flex; align-items: center; flex-direction: row; gap: 32px; list-style-type: none; }

    .navlinks ul li a { position: relative; text-decoration: none; color: white; font-family: "Alata", sans-serif; font-size: 15px; line-height: 25px; font-weight: 400; }

    .navlinks ul li a::before { content: ''; position: absolute; width: 0; height: 2px; background-color: white; top: 30px; left: 10.75px; transition: width 0.3s ease-in-out; }

    .navlinks ul li a:hover::before { width: 24px; }

    Keep building :)

  • Nadji CHABANE•590
    @CHBNDJ

    Hi nice design job just i can give you some tips for the background-color on th img when the hover is used thats what ive done .img-logo { width: auto; height: 302px; border-radius: 8px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; overflow: hidden;

    }

    .img-logo img { width: 100%; height: 302px; border-radius: 8px; display: block; }

    .img-logo::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #00FFF8; opacity: 0; border-radius: 8px; transition: opacity 0.3s ease; }

    .img-logo::before { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 48px; height: 48px; background-image: url('data:image/svg+xml;utf8,<svg width="48" height="48" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><path d="M0 0h48v48H0z"/><path d="M24 9C14 9 5.46 15.22 2 24c3.46 8.78 12 15 22 15 10.01 0 18.54-6.22 22-15-3.46-8.78-11.99-15-22-15Zm0 25c-5.52 0-10-4.48-10-10s4.48-10 10-10 10 4.48 10 10-4.48 10-10 10Zm0-16c-3.31 0-6 2.69-6 6s2.69 6 6 6 6-2.69 6-6-2.69-6-6-6Z" fill="%23FFF" fill-rule="nonzero"/></g></svg>'); opacity: 0; transition: opacity 0.3s ease; }

    .img-logo:hover::after { opacity: 0.5; }

    .img-logo:hover::before { opacity: 1; }

  • Nadji CHABANE•590
    @CHBNDJ

    Nice job overall congrats i see no big improvment to do on this project the most important things are all here nice job !!!

View more comments