pomp/pompy.dev
1
0
Fork 0
Code Issues 8 Pull requests Activity Actions

feat(list): add Main component

Browse source
This commit is contained in:
Kim, Jimin 2025-03-20 21:02:51 +09:00
parent c75b2385f2
commit fda8415efb
Signed by: pomp
GPG key ID: D3932F82A0667A3B
3 changed files with 53 additions and 44 deletions
Download patch file Download diff file Expand all files Collapse all files

5
apps/list/components/Main.vue Normal file
View file

@ -0,0 +1,5 @@
<template>
<main class="mx-auto max-w-screen-mobile px-2">
<slot />
</main>
</template>

84
apps/list/pages/content-creators.vue
View file

@ -45,47 +45,49 @@ const t = useVueTable({
<template> <template>
<Header highlight="Content creators" /> <Header highlight="Content creators" />
<h1 class="text-4xl font-black"> <Main>
pomp's biased and opinionated list of Content creators <h1 class="text-4xl font-black">
</h1> pomp's biased and opinionated list of Content creators
<NuxtLink href="/" class="underline">Back</NuxtLink> </h1>
<div class="p-2"> <NuxtLink href="/" class="underline">Back</NuxtLink>
<table class="border"> <div class="p-2">
<thead> <table class="border">
<tr <thead>
class="border" <tr
v-for="headerGroup in t.getHeaderGroups()" class="border"
:key="headerGroup.id" v-for="headerGroup in t.getHeaderGroups()"
> :key="headerGroup.id"
<th
class="border p-1"
v-for="header in headerGroup.headers"
:key="header.id"
:colSpan="header.colSpan"
> >
<FlexRender <th
v-if="!header.isPlaceholder" class="border p-1"
:render="header.column.columnDef.header" v-for="header in headerGroup.headers"
:props="header.getContext()" :key="header.id"
/> :colSpan="header.colSpan"
</th> >
</tr> <FlexRender
</thead> v-if="!header.isPlaceholder"
:render="header.column.columnDef.header"
:props="header.getContext()"
/>
</th>
</tr>
</thead>
<tbody class="border"> <tbody class="border">
<tr v-for="row in t.getRowModel().rows" :key="row.id"> <tr v-for="row in t.getRowModel().rows" :key="row.id">
<td <td
class="border p-1" class="border p-1"
v-for="cell in row.getVisibleCells()" v-for="cell in row.getVisibleCells()"
:key="cell.id" :key="cell.id"
> >
<FlexRender <FlexRender
:render="cell.column.columnDef.cell" :render="cell.column.columnDef.cell"
:props="cell.getContext()" :props="cell.getContext()"
/> />
</td> </td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div> </div>
</Main>
</template> </template>

8
apps/list/pages/index.vue
View file

@ -1,7 +1,9 @@
<template> <template>
<Header highlight="anything" /> <Header highlight="anything" />
<NuxtLink href="/content-creators" class="underline"> <Main>
Content Creators <NuxtLink href="/content-creators" class="underline">
</NuxtLink> Content Creators
</NuxtLink>
</Main>
</template> </template>