Began adding UI to client detail page.

This commit is contained in:
rocketdebris 2025-11-17 11:50:17 -05:00
parent 0b280cec8e
commit f510645a31

View File

@ -1,28 +1,23 @@
<template>
<div>{{ clientName }}</div>
<Tabs value="0">
<TabList>
<Tab value="0">Overview</Tab>
<Tab value="1">Contact Info</Tab>
<Tab value="2">Project Status</Tab>
<Tab value="3">Accounting</Tab>
<Tab value="4">History</Tab>
<Tab value="1">Projects <span class=tab-info-alert>1</span></Tab>
<Tab value="2">Financials</Tab>
<Tab value="3">History</Tab>
</TabList>
<TabPanels>
<TabPanel value="0">
<h1>Overview</h1>
<div id=overview-tab><h3>Overview</h3></div>
</TabPanel>
<TabPanel value="1">
<h1>Contact Info</h1>
<div id=projects-tab><h3>Project Status</h3></div>
</TabPanel>
<TabPanel value="2">
<h1>Project Status</h1>
<div id=financials-tab><h3>Accounting</h3></div>
</TabPanel>
<TabPanel value="3">
<h1>Accounting</h1>
</TabPanel>
<TabPanel value="4">
<h1>History</h1>
<div id=history-tab><h3>History</h3></div>
</TabPanel>
</TabPanels>
</Tabs>
@ -81,11 +76,13 @@ onMounted(async () => {
});
</script>
<style lang="css">
.tab-bar {
display: flex;
}
.tab-button {
border: black 1px;
border-radius: 5px;
.tab-info-alert {
background-color: a95e46;
border-radius: 10px;
color: white;
padding-left: 5px;
padding-right: 5px;
padding-top: 2px;
padding-bottom: 2px;
}
</style>