fix: changed sidebar/body bg color and changed tab active color to black

This commit is contained in:
Shariq Ansari 2023-08-01 14:28:32 +05:30
parent dbaccdf238
commit f95d17dca5
3 changed files with 7 additions and 7 deletions

View File

@ -7,8 +7,8 @@
<NavLinks <NavLinks
:links="navigations" :links="navigations"
class="flex items-center rounded px-2 py-1 text-gray-800 transition-all duration-300 ease-in-out" class="flex items-center rounded px-2 py-1 text-gray-800 transition-all duration-300 ease-in-out"
active="bg-gray-100 hover:bg-gray-200" active="bg-white shadow-sm"
inactive="hover:bg-gray-50" inactive="hover:bg-gray-100"
> >
<template v-slot="{ link }"> <template v-slot="{ link }">
<div class="flex w-full items-center space-x-2"> <div class="flex w-full items-center space-x-2">

View File

@ -1,6 +1,6 @@
<template> <template>
<div class="flex h-screen w-screen"> <div class="flex h-screen w-screen">
<div class="h-full border-r w-[220px]"> <div class="h-full border-r bg-gray-50 w-[220px]">
<AppSidebar /> <AppSidebar />
</div> </div>
<div class="flex-1 flex flex-col h-full overflow-auto"> <div class="flex-1 flex flex-col h-full overflow-auto">
@ -9,5 +9,5 @@
</div> </div>
</template> </template>
<script setup> <script setup>
import AppSidebar from './AppSidebar.vue' import AppSidebar from '@/components/AppSidebar.vue'
</script> </script>

View File

@ -73,15 +73,15 @@
</Tab> </Tab>
<div <div
ref="indicator" ref="indicator"
class="h-[1px] bg-blue-500 w-[82px] absolute -bottom-[1px]" class="h-[1px] bg-gray-900 w-[82px] absolute -bottom-[1px]"
:style="{ left: `${indicatorLeftValue}px` }" :style="{ left: `${indicatorLeftValue}px` }"
/> />
</TabList> </TabList>
<TabPanels class="flex h-full bg-gray-50"> <TabPanels class="flex h-full">
<TabPanel class="flex-1" v-for="tab in tabs" :key="tab.label"> <TabPanel class="flex-1" v-for="tab in tabs" :key="tab.label">
<Activities :activities="tab.content" /> <Activities :activities="tab.content" />
</TabPanel> </TabPanel>
<div class="flex flex-col gap-6.5 border-l px-6 py-3 w-[390px] bg-white"> <div class="flex flex-col gap-6.5 border-l px-6 py-3 w-[390px]">
<div <div
v-for="section in detailSections" v-for="section in detailSections"
:key="section.label" :key="section.label"