mirror of
https://github.com/SigNoz/signoz.git
synced 2026-04-25 13:20:24 +01:00
Some checks failed
build-staging / prepare (push) Has been cancelled
build-staging / js-build (push) Has been cancelled
build-staging / go-build (push) Has been cancelled
build-staging / staging (push) Has been cancelled
Release Drafter / update_release_draft (push) Has been cancelled
* refactor(tanstack): move table to components & convert to css modules * refactor(table): extract table to own component * refactor(table): optimize * chore(tests): cleanup tests and components * fix(styles): minor fixes on styles * fix(tests): use find by text * fix(row): missing active styles * refactor(tanstack-table): refine component based on infra monitoring * docs(tanstacktable): add more docs about usage * refactor(table): cleanup and fixes related to column and old preferences of logs * refactor(table): more cleanup * refactor(table): removed deprecated api * fix(tanstack): more cleanup * fix(sonner): removed old dependency * fix(resizing): better resizing support * fix(tanstack-header-row): use our version of popover * fix(column-view): remove unused file * fix(oxlint): alerts and issues * fix(test): rollback aria-sort and rename to data-sort
101 lines
1.8 KiB
SCSS
101 lines
1.8 KiB
SCSS
.tanStackTable {
|
|
width: 100%;
|
|
border-collapse: separate;
|
|
border-spacing: 0;
|
|
table-layout: fixed;
|
|
|
|
& td,
|
|
& th {
|
|
overflow: hidden;
|
|
min-width: 0;
|
|
box-sizing: border-box;
|
|
vertical-align: middle;
|
|
}
|
|
}
|
|
|
|
.tableCellText {
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
letter-spacing: -0.07px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
display: -webkit-box;
|
|
width: auto;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-line-clamp: var(--tanstack-plain-body-line-clamp, 1);
|
|
line-clamp: var(--tanstack-plain-body-line-clamp, 1);
|
|
font-size: var(--tanstack-plain-cell-font-size, 14px);
|
|
line-height: var(--tanstack-plain-cell-line-height, 18px);
|
|
color: var(--l2-foreground);
|
|
max-width: 100%;
|
|
word-break: break-all;
|
|
}
|
|
|
|
.tableViewRowActions {
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 8px;
|
|
left: auto;
|
|
transform: translateY(-50%);
|
|
margin: 0;
|
|
z-index: 5;
|
|
}
|
|
|
|
.tableCell {
|
|
padding: 0.3rem;
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
letter-spacing: -0.07px;
|
|
font-size: var(--tanstack-plain-cell-font-size, 14px);
|
|
line-height: var(--tanstack-plain-cell-line-height, 18px);
|
|
color: var(--l2-foreground);
|
|
}
|
|
|
|
.tableRow {
|
|
cursor: pointer;
|
|
position: relative;
|
|
overflow-anchor: none;
|
|
|
|
&:hover {
|
|
.tableCell {
|
|
background-color: var(--row-hover-bg) !important;
|
|
}
|
|
}
|
|
|
|
&.tableRowActive {
|
|
.tableCell {
|
|
background-color: var(--row-active-bg) !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
.tableHeaderCell {
|
|
padding: 0.3rem;
|
|
height: 36px;
|
|
text-align: left;
|
|
font-size: 14px;
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
line-height: 18px;
|
|
letter-spacing: -0.07px;
|
|
color: var(--l1-foreground);
|
|
|
|
// TODO: Remove this once background color (l1) is matching the actual background color of the page
|
|
&[data-dark-mode='true'] {
|
|
background: #0b0c0d;
|
|
}
|
|
|
|
&[data-dark-mode='false'] {
|
|
background: #fdfdfd;
|
|
}
|
|
}
|
|
|
|
.tableRowExpansion {
|
|
display: table-row;
|
|
}
|
|
|
|
.tableCellExpansion {
|
|
padding: 0.5rem;
|
|
vertical-align: top;
|
|
}
|