Sagar Kapoor Posts - Answer Overflow

Sagar Kapoor

•Created by Sagar Kapoor on 11/14/2024 in #❓・help

CSS class nomenclature for components and pages

What's the recommended way to structure root element class names in Nuxt 3 components and pages with SCSS? For example, should ProductCard.vue use .product-card and products.vue use .products-page as their root classes?

5 replies

NNuxt

•Created by Sagar Kapoor on 11/9/2024 in #❓・help

Does Vercel has issues with NuxtImg?

I am getting this error when I am building my project error: [404] Page not found: /_vercel/image?url=%252Fservices%252Fall-services.webp&w=1536&q=100

5 replies

NNuxt

•Created by Sagar Kapoor on 10/30/2024 in #❓・help

Nuxt SiteMap

I am using the Nuxt SEO Module out of box without much configuration (except for the basic one). I am not able to get the dynamic pages indexed on the sitemap. What am I doing wrong?

14 replies

NNuxt

•Created by Sagar Kapoor on 10/19/2024 in #❓・help

How to password protect a site?

I want to quickly share a project I made with a client. But I want to password protect it so that it cannot be accessed by anyone else. The site would be up for a very short time so I don't want to mess with Authentication and stuff. I am searching for a very simple solution. Thanks in advance.

3 replies

NNuxt

•Created by Sagar Kapoor on 10/2/2024 in #❓・help

Cookie consent banner for Google Analytics

I want to implement a cookie consent banner for a Nuxt3 project, how can I go about it? Do you guys use an external library for this?

3 replies

NNuxt

•Created by Sagar Kapoor on 9/6/2024 in #❓・help

Responsive Header Menu

I am working on a responsive menu and this is what I came up with: https://gist.github.com/Sagar-Kap/abdbac1380f76cc36d3297ff9dead1b2 The only thing about this menu that is bugging me out is that I am using this piece of code to change the visibility of the menu buttons:

watchEffect(() => {
  if (isClient.value) {
    if (mobileNav.value) {
      document.body.style.overflow = "hidden";
    } else {
      document.body.style.overflow = "";
    }
  }
});

watchEffect(() => {
  if (isClient.value) {
    if (mobileNav.value) {
      document.body.style.overflow = "hidden";
    } else {
      document.body.style.overflow = "";
    }
  }
});

Is this acceptable in this case? is there a workaround?

3 replies

NNuxt

•Created by Sagar Kapoor on 8/25/2024 in #❓・help

Getting error when running ESLint & Prettier"Disallow self-closing on HTML void elements (<img/>)"

I am using ESLint and Prettier in the project and when I try to remove the / and save, it gets restored when I save because of Prettier. How can I fix this issue? Is there a plugin that i have to install which will make it so that ESLint and Prettier will not interfere with each other?

2 replies

NNuxt

•Created by Sagar Kapoor on 8/17/2024 in #❓・help

How to dynamically render images in Nuxt3

How do I dynamically render images in Nuxt 3? I want to do something like this:

<img src=`/assets/icons/${imageName}.svg`>

<img src=`/assets/icons/${imageName}.svg`>

7 replies

NNuxt

•Created by Sagar Kapoor on 7/15/2024 in #❓・help

I want to have a logo as a link, how should I go about it?

As the title says, I am trying to embed a link within a logo. What would be the best way to do it? should I use NuxtLink and then some kind of Nuxt Image component?

4 replies

Gaming

Programming