mirror of
https://github.com/zadam/trilium.git
synced 2025-11-03 04:59:04 +01:00
165 lines
4.7 KiB
CSS
165 lines
4.7 KiB
CSS
.tabulator {
|
|
--col-header-background-color: var(--main-background-color);
|
|
--col-header-hover-background-color: var(--accented-background-color);
|
|
--col-header-text-color: var(--main-text-color);
|
|
--col-header-arrow-active-color: var(--main-text-color);
|
|
--col-header-arrow-inactive-color: var(--more-accented-background-color);
|
|
--col-header-separator-border: none;
|
|
--col-header-bottom-border: 2px solid var(--main-border-color);
|
|
|
|
--row-background-color: var(--main-background-color);
|
|
--row-alternate-background-color: var(--main-background-color);
|
|
--row-moving-background-color: var(--accented-background-color);
|
|
--row-text-color: var(--main-text-color);
|
|
|
|
--grid-horizontal-color: var(--more-accented-background-color);
|
|
--grid-vertical-color: red;
|
|
|
|
--cell-editable-hover-outline-color: var(--main-border-color);
|
|
--cell-read-only-text-color: var(--muted-text-color);
|
|
|
|
--cell-editing-border-color: var(--main-border-color);
|
|
--cell-editing-border-width: 2px;
|
|
--cell-editing-background-color: var(--ck-color-selector-focused-cell-background);
|
|
--cell-editing-text-color: initial;
|
|
|
|
background: unset;
|
|
border: unset;
|
|
}
|
|
|
|
.tabulator .tabulator-tableholder .tabulator-table {
|
|
background: unset;
|
|
}
|
|
|
|
/* Column headers */
|
|
|
|
.tabulator div.tabulator-header {
|
|
border-bottom: var(--col-header-bottom-border);
|
|
background: var(--col-header-background-color);
|
|
color: var(--col-header-text-color);
|
|
}
|
|
|
|
.tabulator div.tabulator-header .tabulator-col.tabulator-moving {
|
|
border: none;
|
|
background: var(--col-header-hover-background-color);
|
|
}
|
|
|
|
.tabulator .tabulator-col-content {
|
|
padding: 8px 4px !important;
|
|
}
|
|
|
|
@media (hover: hover) and (pointer: fine) {
|
|
.tabulator .tabulator-header .tabulator-col.tabulator-sortable.tabulator-col-sorter-element:hover {
|
|
background-color: var(--col-header-hover-background-color);
|
|
}
|
|
}
|
|
|
|
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow {
|
|
border-bottom-color: var(--col-header-arrow-active-color);
|
|
border-top-color: var(--col-header-arrow-active-color);
|
|
}
|
|
|
|
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="none"] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow {
|
|
border-bottom-color: var(--col-header-arrow-inactive-color);
|
|
}
|
|
|
|
.tabulator div.tabulator-header .tabulator-col,
|
|
.tabulator div.tabulator-header .tabulator-frozen.tabulator-frozen-left {
|
|
background: var(--col-header-background-color);
|
|
border-right: var(--col-header-separator-border);
|
|
}
|
|
|
|
/* Table body */
|
|
|
|
.tabulator-tableholder {
|
|
padding-top: 10px;
|
|
}
|
|
|
|
/* Rows */
|
|
|
|
.tabulator-row .tabulator-cell,
|
|
.tabulator-row .tabulator-cell input {
|
|
padding: 8px 4px;
|
|
}
|
|
|
|
.tabulator-row {
|
|
background: transparent;
|
|
border-top: none;
|
|
border-bottom: 1px solid var(--grid-horizontal-color);
|
|
color: var(--row-text-color);
|
|
}
|
|
|
|
.tabulator-row.tabulator-row-odd {
|
|
background: var(--row-background-color);
|
|
}
|
|
|
|
.tabulator-row.tabulator-row-even {
|
|
background: var(--row-alternate-background-color);
|
|
}
|
|
|
|
.tabulator-row.tabulator-moving {
|
|
border-color: transparent;
|
|
background-color: var(--row-moving-background-color);
|
|
}
|
|
|
|
/* Cell */
|
|
|
|
.tabulator-row .tabulator-cell.tabulator-frozen.tabulator-frozen-left,
|
|
.tabulator-row .tabulator-cell {
|
|
border-right-color: transparent;
|
|
}
|
|
|
|
.tabulator-row .tabulator-cell:not(.tabulator-editable) {
|
|
color: var(--cell-read-only-text-color);
|
|
}
|
|
|
|
.tabulator:not(.tabulator-editing) .tabulator-row .tabulator-cell.tabulator-editable:hover {
|
|
outline: 2px solid var(--cell-editable-hover-outline-color);
|
|
outline-offset: -1px;
|
|
}
|
|
|
|
.tabulator-row .tabulator-cell.tabulator-editing {
|
|
border-color: transparent;
|
|
}
|
|
|
|
.tabulator-row:not(.tabulator-moving) .tabulator-cell.tabulator-editing {
|
|
outline: calc(var(--cell-editing-border-width) - 1px) solid var(--cell-editing-border-color);
|
|
border-color: var(--cell-editing-border-color);
|
|
background: var(--cell-editing-background-color);
|
|
}
|
|
|
|
.tabulator-row:not(.tabulator-moving) .tabulator-cell.tabulator-editing > * {
|
|
color: var(--cell-editing-text-color);
|
|
}
|
|
|
|
/* Checkbox cells */
|
|
|
|
.tabulator .tabulator-cell:has(svg),
|
|
.tabulator .tabulator-cell:has(input[type="checkbox"]) {
|
|
padding-left: 8px;
|
|
display: inline-flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.tabulator .tabulator-cell input[type="checkbox"] {
|
|
margin: 0;
|
|
}
|
|
|
|
.tabulator .tabulator-footer {
|
|
color: var(--main-text-color);
|
|
}
|
|
|
|
/* Context menus */
|
|
|
|
.tabulator-popup-container {
|
|
min-width: 10em;
|
|
border-radius: var(--bs-border-radius);
|
|
}
|
|
|
|
.tabulator-menu .tabulator-menu-item {
|
|
border: 1px solid transparent;
|
|
color: var(--menu-text-color);
|
|
font-size: 16px;
|
|
} |