/* Start Table Styles */ // .table { // @apply dark:!text-defaulttextcolor/70 ; // } .table { @apply text-defaulttextcolor rounded-md mb-0 text-start; tr { @apply dark:border-defaultborder/10; } tbody { tr { th { @apply font-medium; } } } th, td { @apply p-[0.75rem] align-middle leading-[1.462] text-[0.813rem] font-medium text-start; } thead tr th { @apply font-semibold text-[0.85rem]; } &.table-sm> :not(caption)>*>* { @apply p-[0.3rem]; } &.table-dark { @apply text-white/70 border-white/10 dark:border-black/[0.025]; } &.table-primary { @apply text-primary/70 border-primary/10; } &.table-bordered { &.table-bordered-primary { tbody, td, tfoot, th, thead, tr { @apply border-primary/30!; } } &.table-bordered-info { tbody, td, tfoot, th, thead, tr { @apply border-info/30; } } &.table-bordered-secondary { tbody, td, tfoot, th, thead, tr { @apply border-secondary/30; } } &.table-bordered-warning { tbody, td, tfoot, th, thead, tr { @apply border-warning/30; } } &.table-bordered-success { tbody, td, tfoot, th, thead, tr { @apply border-success/30; } } &.table-bordered-danger { tbody, td, tfoot, th, thead, tr { @apply border-danger/30; } } } &.table-striped>tbody>tr:nth-of-type(odd)>* { @apply text-defaulttextcolor; } &.table-striped-columns> :not(caption)>tr> :nth-child(2n) { @apply text-defaulttextcolor; } tbody.table-group-divider { @apply border-t border-solid rounded-md; } &.table-hover>tbody>tr:hover>* { @apply text-defaulttextcolor; } .table-active { @apply text-defaulttextcolor; } } .ti-custom-table-head { @apply divide-y divide-gray-200 dark:divide-white/10; } .table-responsive, .table { @apply overflow-y-visible!; } .table-responsive { @apply block w-full overflow-x-auto; } .table-responsive { @apply overflow-x-auto; } .ti-custom-table { @apply min-w-full; th { @apply px-6 py-2 text-start leading-[1.462] font-semibold text-xs uppercase bg-gray-50 dark:bg-black/20 dark:text-white; } tbody { @apply divide-y divide-gray-200 dark:divide-white/10; } td { @apply px-6 py-4 whitespace-nowrap text-sm dark:text-gray-200 font-medium; } } .ti-striped-table { tbody { tr { @apply odd:bg-white even:bg-gray-100 dark:odd:dark:bg-bodybg dark:even:bg-black/20; } } } .ti-custom-table-hover { tbody { tr { @apply hover:bg-gray-100 dark:hover:bg-light; } } } .table-bordered { @apply border border-defaultborder dark:border-defaultborder/10; tr { @apply divide-x divide-gray-200 dark:divide-white/10; } } .table-bordered-primary { @apply border border-primary/30 dark:border-primary/30; .ti-custom-table-head { @apply divide-y divide-primary/30 dark:divide-primary/30; } tbody { @apply divide-y divide-primary/30 dark:divide-primary/30; } tr { @apply divide-x divide-primary/30 dark:divide-primary/30; } } .table-bordered-secondary { @apply border border-secondary/30 dark:border-secondary/30; .ti-custom-table-head { @apply divide-y divide-secondary/30 dark:divide-secondary/30; } tbody { @apply divide-y divide-secondary/30 dark:divide-secondary/30; } tr { @apply divide-x divide-secondary/30 dark:divide-secondary/30; } } .table-bordered-warning { @apply border border-warning/30 dark:border-warning/30; .ti-custom-table-head { @apply divide-y divide-warning/30 dark:divide-warning/30; } tbody { @apply divide-y divide-warning/30 dark:divide-warning/30; } tr { @apply divide-x divide-warning/30 dark:divide-warning/30; } } .table-bordered-danger { @apply border border-danger/30 dark:border-danger/30; .ti-custom-table-head { @apply divide-y divide-danger/30 dark:divide-danger/30; } tbody { @apply divide-y divide-danger/30 dark:divide-danger/30; } tr { @apply divide-x divide-danger/30 dark:divide-danger/30; } } .table-bordered-info { @apply border border-info/30 dark:border-info/30; .ti-custom-table-head { @apply divide-y divide-info/30 dark:divide-info/30; } tbody { @apply divide-y divide-info/30 dark:divide-info/30; } tr { @apply divide-x divide-info/30 dark:divide-info/30; } } .table-bordered-success { @apply border border-success/30 dark:border-success/30; .ti-custom-table-head { @apply divide-y divide-success/30 dark:divide-success/30; } tbody { @apply divide-y divide-success/30 dark:divide-success/30; } tr { @apply divide-x divide-success/30 dark:divide-success/30; } } .table-primary { @apply bg-primary/10; th { @apply text-black dark:text-white; } tbody { @apply divide-y divide-primary/10 dark:divide-primary/10; } td { @apply text-gray-800 dark:text-gray-200; } tr { @apply divide-x divide-primary/10 dark:divide-primary/10; } .ti-custom-table-head { @apply divide-y divide-primary/10 dark:divide-primary/10; } } .table-dark { @apply bg-black/10 dark:bg-bodybg2; th { @apply text-black dark:text-white; } tbody { @apply divide-y divide-black/10 dark:divide-black/[0.025]; } td { @apply text-black dark:text-white; } tr { @apply divide-x divide-black/10 dark:divide-black/[0.025]; } .ti-custom-table-head { @apply divide-y divide-black/10 dark:divide-black/[0.025]; } } .table-secondary { @apply bg-secondary/10; th { @apply text-black dark:text-white; } tbody { @apply divide-y divide-secondary/10 dark:divide-secondary/10; } td { @apply text-gray-800 dark:text-gray-200; } tr { @apply divide-x divide-secondary/10 dark:divide-secondary/10; } .ti-custom-table-head { @apply divide-y divide-secondary/10 dark:divide-secondary/10; } } .table-warning { @apply bg-warning/10; th { @apply text-black dark:text-white; } tbody { @apply divide-y divide-warning/10 dark:divide-warning/10; } td { @apply text-gray-800 dark:text-gray-200; } tr { @apply divide-x divide-warning/10 dark:divide-warning/10; } .ti-custom-table-head { @apply divide-y divide-warning/10 dark:divide-warning/10; } } .table-info { @apply bg-info/10; th { @apply text-black dark:text-white; } tbody { @apply divide-y divide-info/10 dark:divide-info/10; } td { @apply text-gray-800 dark:text-gray-200; } tr { @apply divide-x divide-info/10 dark:divide-info/10; } .ti-custom-table-head { @apply divide-y divide-info/10 dark:divide-info/10; } } .table-danger { @apply bg-danger/10; th { @apply text-black dark:text-white; } tbody { @apply divide-y divide-danger/10 dark:divide-danger/10; } td { @apply text-gray-800 dark:text-gray-200; } tr { @apply divide-x divide-danger/10 dark:divide-danger/10; } .ti-custom-table-head { @apply divide-y divide-danger/10 dark:divide-danger/10; } } .table-success { @apply bg-success/10; th { @apply text-black dark:text-white; } tbody { @apply divide-y divide-success/10 dark:divide-success/10; } td { @apply text-gray-800 dark:text-gray-200; } tr { @apply divide-x divide-success/10 dark:divide-success/10; } .ti-custom-table-head { @apply divide-y divide-success/10 dark:divide-success/10; } } .ti-head-primary { th { @apply bg-primary/20 dark:bg-primary/20; } } .ti-head-secondary { th { @apply bg-secondary/20 dark:bg-secondary/20; } } .ti-head-warning { th { @apply bg-warning/20 dark:bg-warning/20; } } .ti-head-success { th { @apply bg-success/20 dark:bg-success/20; } } .ti-head-info { th { @apply bg-info/20 dark:bg-info/20; } } .ti-head-danger { th { @apply bg-danger/20 dark:bg-danger/20; } } .table-striped>tbody>tr:nth-of-type(odd)>* { @apply bg-black/[0.0125] text-defaulttextcolor; } .table-striped-columns> :not(caption)>tr> :nth-child(2n) { @apply text-defaulttextcolor bg-[var(--color-light)]; } .table.table-success.table-striped>tbody>tr:nth-of-type(odd)>* { @apply bg-success/20; } caption { @apply text-textmuted pt-2 pb-2 text-start; } .table-active { @apply bg-light; } /* End Table Styles */