Began adding UI to client detail page.
This commit is contained in:
parent
0b280cec8e
commit
f510645a31
@ -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>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user