36 lines
896 B
CSS
36 lines
896 B
CSS
/* 8. AppearanceTabs Component */
|
|
.appearance-tabs {
|
|
@apply inline-flex gap-1 p-1;
|
|
border-radius: var(--radius);
|
|
background-color: var(--muted);
|
|
|
|
.appearance-tabs__tab {
|
|
@apply flex cursor-pointer items-center px-3.5 py-1.5 transition-colors;
|
|
border-radius: calc(var(--radius) - 2px);
|
|
color: var(--muted-foreground);
|
|
|
|
&:hover {
|
|
color: var(--foreground);
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|
}
|
|
|
|
&.appearance-tabs__tab--active {
|
|
background-color: var(--card);
|
|
color: var(--card-foreground);
|
|
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
|
|
|
|
&:hover {
|
|
background-color: var(--card);
|
|
}
|
|
}
|
|
}
|
|
|
|
.appearance-tabs__icon {
|
|
@apply -ml-1 h-4 w-4;
|
|
}
|
|
|
|
.appearance-tabs__label {
|
|
@apply ml-1.5 text-sm;
|
|
}
|
|
}
|