punkfairie/library
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Extract StateSecondaryInfo component

Browse source
This commit is contained in:
Marley 2023-07-13 16:35:42 -07:00
parent 989629b0b6
commit 3d9ba89fe8
2 changed files with 17 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
frontend/components/State/SecondaryInfo.vue Normal file
View file

@ -0,0 +1,13 @@
<script setup lang="ts">
</script>
<template>
<span class="secondary-info"><slot /></span>
</template>
<style lang="postcss">
.secondary-info {
@apply text-black/50;
}
</style>

10
frontend/pages/patrons/index.vue
View file

@ -33,7 +33,7 @@ const patrons = [
<tr v-for="(patron, index) in patrons" :key="index"> <tr v-for="(patron, index) in patrons" :key="index">
<TableTd> <TableTd>
<div>{{ patron.name }}</div> <div>{{ patron.name }}</div>
<div class="secondary-info">{{ patron.email }}</div> <StateSecondaryInfo>{{ patron.email }}</StateSecondaryInfo>
</TableTd> </TableTd>
<TableTd> <TableTd>
@ -44,7 +44,9 @@ const patrons = [
<TableTd> <TableTd>
<div>{{ patron.checkedOut }} books</div> <div>{{ patron.checkedOut }} books</div>
<div class="secondary-info">{{ patron.overdue }} overdue</div> <StateSecondaryInfo>
{{ patron.overdue }} overdue
</StateSecondaryInfo>
</TableTd> </TableTd>
<TableTd> <TableTd>
@ -70,8 +72,4 @@ const patrons = [
section { section {
@apply w-full px-10; @apply w-full px-10;
} }
.secondary-info {
@apply text-black/50;
}
</style> </style>