nick_wireless Comments - Answer Overflow

nick_wireless

•Created by Alexandre Nédélec on 4/7/2024 in #❓・help

Customize links font size in Header component of Nuxt UI Pro

I have in my mind to use a computed composable, something like:

const route = useRouter()

const isActive = computed(() => route.currentRoute.value.path.startsWith('/newsroom/news/'))

const route = useRouter()

const isActive = computed(() => route.currentRoute.value.path.startsWith('/newsroom/news/'))

However... like you, I don't know how to target the #center slot.

9 replies

NNuxt

•Created by Alexandre Nédélec on 4/7/2024 in #❓・help

Customize links font size in Header component of Nuxt UI Pro

Here is my repo link with more details: https://github.com/nick-wireless/simplified-base/tree/6c512b6a47cb2d7569029f7bc585061e07309c99

9 replies

NNuxt

•Created by Alexandre Nédélec on 4/7/2024 in #❓・help

Customize links font size in Header component of Nuxt UI Pro

I'd like to keep this issue open. I have a different question on the same Heading. I have a setup with my links provided in the Header.vue component. I land on these links to a specific link such as /progress/project-updates or /newsroom/comms_centre . The links work, however I'd like to have the isActive class within the Header always active for /progress/ links within the header... not just the single /project-updates. Like you, I'm wondering how to target the #center slot...

9 replies

NNuxt

•Created by Alexandre Nédélec on 4/7/2024 in #❓・help

Customize links font size in Header component of Nuxt UI Pro

The above did seem to work, placing it within the UHeader.

9 replies

NNuxt

•Created by Alexandre Nédélec on 4/7/2024 in #❓・help

Customize links font size in Header component of Nuxt UI Pro

 <template #center>
      <UButton
        v-for="(link, index) of links"
        :key="index"
        class=" text-2xl "
      />
    </template>

 <template #center>
      <UButton
        v-for="(link, index) of links"
        :key="index"
        class=" text-2xl "
      />
    </template>

9 replies

NNuxt

•Created by Alexandre Nédélec on 4/7/2024 in #❓・help

Customize links font size in Header component of Nuxt UI Pro

Like you, I tried what you have but with centre: 'italic' ... this worked, but I couldn't make the text-2xl work. This makes me think it happens elsewhere... I tried configuration in app.config.ts for master over-ride, I couldn't get that to work either, however...

9 replies

NNuxt

•Created by Alexandre Nédélec on 4/7/2024 in #❓・help

Customize links font size in Header component of Nuxt UI Pro

Hi Alexandre... I think I was able to find a work around on this one for you...

9 replies

Gaming

Programming