324 lines
6.7 KiB
CSS
324 lines
6.7 KiB
CSS
/* RS Tab Component */
|
|
.tab {
|
|
@apply rounded-md;
|
|
}
|
|
|
|
.tab.vertical {
|
|
@apply flex flex-col md:flex-row;
|
|
}
|
|
|
|
.tab.tab-card {
|
|
@apply shadow-md pt-4;
|
|
}
|
|
|
|
.tab.card-vertical {
|
|
@apply shadow-md;
|
|
}
|
|
|
|
.tab.card-primary {
|
|
@apply bg-primary;
|
|
}
|
|
|
|
.tab.card-secondary {
|
|
@apply bg-secondary;
|
|
}
|
|
|
|
.tab.card-success {
|
|
@apply bg-success;
|
|
}
|
|
|
|
.tab.card-info {
|
|
@apply bg-info;
|
|
}
|
|
|
|
.tab.card-warning {
|
|
@apply bg-warning;
|
|
}
|
|
|
|
.tab.card-danger {
|
|
@apply bg-danger;
|
|
}
|
|
|
|
.tab .tab-nav {
|
|
@apply flex flex-wrap list-none pl-0;
|
|
}
|
|
|
|
.tab .tab-nav.tab-nav-card {
|
|
@apply mx-4 mb-0;
|
|
}
|
|
|
|
.tab .tab-nav.card-vertical {
|
|
@apply py-0 pt-4 md:py-4;
|
|
}
|
|
|
|
.tab .tab-nav.vertical {
|
|
@apply flex-row md:flex-col gap-2;
|
|
}
|
|
|
|
.tab .tab-nav.vertical-fill {
|
|
@apply flex-1;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item {
|
|
@apply cursor-pointer;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.fill {
|
|
@apply flex-1 w-full;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-horizontal {
|
|
@apply border-0 hover:border hover:border-b-0 rounded-t-md px-6;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-horizontal-active {
|
|
@apply border rounded-t-md border-b-0;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-vertical {
|
|
@apply border-0 hover:border hover:border-r-0 rounded-l-md px-6;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-vertical-active {
|
|
@apply border rounded-t-md rounded-bl-none md:rounded-r-none md:rounded-l-md border-r border-b-0 md:border-b md:border-r-0;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-hover-primary {
|
|
@apply hover:border-primary;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-hover-secondary {
|
|
@apply hover:border-secondary;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-hover-success {
|
|
@apply hover:border-success;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-hover-info {
|
|
@apply hover:border-info;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-hover-warning {
|
|
@apply hover:border-warning;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-hover-danger {
|
|
@apply hover:border-danger;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-active-primary {
|
|
@apply border-primary text-primary;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-active-secondary {
|
|
@apply border-secondary text-secondary;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-active-success {
|
|
@apply border-success text-success;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-active-info {
|
|
@apply border-info text-info;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-active-warning {
|
|
@apply border-warning text-warning;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item.border-active-danger {
|
|
@apply border-danger text-danger;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link {
|
|
@apply block font-medium text-base leading-tight capitalize border-x-0 border-t-0 py-3;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default {
|
|
@apply hover:border-b-2 mx-2 px-4;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default-vertical {
|
|
@apply hover:border-l-2 mx-2 px-4;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default-active {
|
|
@apply border-b-2;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default-vertical-active {
|
|
@apply border-l-2;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default-hover-primary {
|
|
@apply hover:border-primary hover:text-primary;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default-hover-secondary {
|
|
@apply hover:border-secondary hover:text-secondary;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default-hover-success {
|
|
@apply hover:border-success hover:text-success;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default-hover-info {
|
|
@apply hover:border-info hover:text-info;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default-hover-warning {
|
|
@apply hover:border-warning hover:text-warning;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default-hover-danger {
|
|
@apply hover:border-danger hover:text-danger;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default-primary {
|
|
@apply text-primary border-primary;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default-secondary {
|
|
@apply text-secondary border-secondary;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default-success {
|
|
@apply text-success border-success;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default-info {
|
|
@apply text-info border-info;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default-warning {
|
|
@apply text-warning border-warning;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.default-danger {
|
|
@apply text-danger border-danger;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-card {
|
|
@apply px-5 mx-1 text-white rounded-t-md;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-card-vertical {
|
|
@apply px-5 my-0 text-white rounded-bl-none rounded-t-md md:rounded-tr-none md:rounded-l-md;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-card-primary {
|
|
@apply bg-primary/90;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-card-secondary {
|
|
@apply bg-secondary/90;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-card-success {
|
|
@apply bg-success/90;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-card-info {
|
|
@apply bg-info/90;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-card-warning {
|
|
@apply bg-warning/90;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-card-danger {
|
|
@apply bg-danger/90;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-card-primary-active {
|
|
@apply text-primary/90;
|
|
background-color: rgb(var(--bg-2));
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-card-secondary-active {
|
|
@apply text-secondary/90;
|
|
background-color: rgb(var(--bg-2));
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-card-success-active {
|
|
@apply text-success/90;
|
|
background-color: rgb(var(--bg-2));
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-card-info-active {
|
|
@apply text-info/90;
|
|
background-color: rgb(var(--bg-2));
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-card-warning-active {
|
|
@apply text-warning/90;
|
|
background-color: rgb(var(--bg-2));
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-card-danger-active {
|
|
@apply text-danger/90;
|
|
background-color: rgb(var(--bg-2));
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-justify-left {
|
|
@apply flex flex-wrap justify-start;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-justify-center {
|
|
@apply flex flex-wrap justify-center;
|
|
}
|
|
|
|
.tab .tab-nav .tab-item .tab-item-link.link-justify-right {
|
|
@apply flex flex-wrap justify-end;
|
|
}
|
|
|
|
.tab .tab-content {
|
|
@apply rounded-lg;
|
|
background-color: rgb(var(--bg-2));
|
|
}
|
|
|
|
.tab .tab-content.content-vertical {
|
|
@apply flex-grow;
|
|
}
|
|
|
|
.tab .tab-content.content-vertical-fill {
|
|
@apply flex-1;
|
|
}
|
|
|
|
.tab .tab-content.content-border {
|
|
@apply border rounded-b-md;
|
|
}
|
|
|
|
.tab .tab-content.content-border-vertical {
|
|
@apply border rounded-md rounded-l-none;
|
|
}
|
|
|
|
.tab .tab-content.content-border-primary {
|
|
@apply border-primary;
|
|
}
|
|
|
|
.tab .tab-content.content-border-secondary {
|
|
@apply border-secondary;
|
|
}
|
|
|
|
.tab .tab-content.content-border-success {
|
|
@apply border-success;
|
|
}
|
|
|
|
.tab .tab-content.content-border-info {
|
|
@apply border-info;
|
|
}
|
|
|
|
.tab .tab-content.content-border-warning {
|
|
@apply border-warning;
|
|
}
|
|
|
|
.tab .tab-content.content-border-danger {
|
|
@apply border-danger;
|
|
}
|
|
|
|
.tab .tab-content .tab-pane {
|
|
@apply py-4 px-4;
|
|
}
|