feat: add side bar components disclosure constants classes
This commit is contained in:
parent
f545b9cf9b
commit
b6192162b0
2 changed files with 17 additions and 5 deletions
|
|
@ -227,4 +227,16 @@ The cursor: default; property value restores the browser's default cursor style
|
||||||
.message-button-icon {
|
.message-button-icon {
|
||||||
@apply w-6 fill-chat-trigger stroke-chat-trigger stroke-1
|
@apply w-6 fill-chat-trigger stroke-chat-trigger stroke-1
|
||||||
}
|
}
|
||||||
|
.components-disclosure-arrangement {
|
||||||
|
@apply -mt-px flex w-full select-none items-center justify-between border-y border-y-input bg-muted px-3 py-2
|
||||||
|
}
|
||||||
|
.text-color {
|
||||||
|
@apply text-primary
|
||||||
|
}
|
||||||
|
.components-disclosure-title {
|
||||||
|
@apply flex items-center text-sm text-color
|
||||||
|
}
|
||||||
|
.components-disclosure-div {
|
||||||
|
@apply flex gap-2
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -12,14 +12,14 @@ export default function DisclosureComponent({
|
||||||
{({ open }) => (
|
{({ open }) => (
|
||||||
<>
|
<>
|
||||||
<div>
|
<div>
|
||||||
<Disclosure.Button className="-mt-px flex w-full select-none items-center justify-between border-y border-y-input bg-muted px-3 py-2">
|
<Disclosure.Button className="components-disclosure-arrangement">
|
||||||
<div className="flex gap-4">
|
<div className="flex gap-4">
|
||||||
<Icon strokeWidth={1.5} size={22} className="text-primary " />
|
<Icon strokeWidth={1.5} size={22} className="text-color" />
|
||||||
<span className="flex items-center text-sm text-primary">
|
<span className="components-disclosure-title">
|
||||||
{title}
|
{title}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex gap-2">
|
<div className="components-disclosure-div">
|
||||||
{buttons.map((x, index) => (
|
{buttons.map((x, index) => (
|
||||||
<button key={index} onClick={x.onClick}>
|
<button key={index} onClick={x.onClick}>
|
||||||
{x.Icon}
|
{x.Icon}
|
||||||
|
|
@ -35,7 +35,7 @@ export default function DisclosureComponent({
|
||||||
</div>
|
</div>
|
||||||
</Disclosure.Button>
|
</Disclosure.Button>
|
||||||
</div>
|
</div>
|
||||||
<Disclosure.Panel as="div" className="-mt-px" static={openDisc}>
|
<Disclosure.Panel as="div" static={openDisc}>
|
||||||
{children}
|
{children}
|
||||||
</Disclosure.Panel>
|
</Disclosure.Panel>
|
||||||
</>
|
</>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue