Nuxt•4mo ago

UDashboardPanel footer (@nuxt/ui-pro)

I'm trying to put a footer on the main (grow enabled) panel but I can't get the css right. in the following example I would like the footer to be at the bottom of the screen when NuxtPage is short, but not floating over the content when it's large. suggestions?

  <u-dashboard-panel grow>
    <u-dashboard-panel-content class="overflow-y-scroll py-2">
      <NuxtPage />
      <app-dashboard-footer />
    </u-dashboard-panel-content>
  </u-dashboard-panel>

  <u-dashboard-panel grow>
    <u-dashboard-panel-content class="overflow-y-scroll py-2">
      <NuxtPage />
      <app-dashboard-footer />
    </u-dashboard-panel-content>
  </u-dashboard-panel>

1 Reply

Alejandro Mery•4mo ago

https://github.com/nuxt/ui-pro/issues/325 @benjamincanac solved this on the ticket above. adding <div class="flex-1" /> between <NuxtPage /> and the footer does exactly what I needed. thank you!

Gaming

Programming

UDashboardPanel footer (@nuxt/ui-pro)