next.js app doesn't look the same as it looks in the local environment

[lithika-damnod]

This is the desired output: https://sampathmotors.vercel.app
What I get after deploying: https://ecommerce-nextjs-dun.vercel.app
Repo: https://github.com/lithika-damnod/ecommerce-nextjs

I'm stuck on this issue.
Can somebody help me plz.. 🙏

[icyJoseph]

At least when it comes to the .btn class a bunch of properties are missing on e-commerce site:

.btn {
    align-items: center;
    border-radius: 0.5em;
    color: #000;
    cursor: pointer;
    display: flex;
    font-family: Fira Sans,sans-serif;
    font-weight: bolder;
    height: 40px;
    justify-content: center;
    opacity: 62%;
    width: 130px;
}

The funny part is that I see them here: https://github.com/lithika-damnod/ecommerce-nextjs/blob/master/styles/Button.module.css

That in turn made me check the source code, and I found a floating ; in line 300.

Which made look into the Hero module, which at the last line, https://github.com/lithika-damnod/ecommerce-nextjs/blob/master/styles/Hero.module.css#L137, does indeed have a floating ;

I removed it, npm run build && npm run start and voila! It works.

Note: You might observe this only in production mode, because the CSS is minified, so the floating ; becomes into an issue

[lithika-damnod]

thank you very much .. @icyJoseph ( it worked 🙌 )