mirrors/zotero
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

HTML Tree: Fix column separators misaligned at startup. Closes #2153

Browse source
This commit is contained in:
Adomas Venčkauskas 2021-08-24 12:42:57 +03:00
parent d4e3a437fd
commit 6010390525
3 changed files with 14 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
chrome/content/zotero/components/virtualized-table.jsx
View file

@ -1084,10 +1084,13 @@ class VirtualizedTable extends React.Component {
const header = document.querySelector(`#${this.props.id} .virtualized-table-header`); const header = document.querySelector(`#${this.props.id} .virtualized-table-header`);
const scrollbarWidth = Math.max(0, const scrollbarWidth = Math.max(0,
tree.getBoundingClientRect().width - jsWindow.getBoundingClientRect().width); tree.getBoundingClientRect().width - jsWindow.getBoundingClientRect().width);
let paddingWidth = 0;
if (Zotero.isLinux) {
paddingWidth = 2; // from the border
}
// Should be kept up to date with the _virtualized-table.scss value // Should be kept up to date with the _virtualized-table.scss value
// for .virtualized-table-header // for .virtualized-table-header
const paddingInlineStart = 6; header.style.width = `calc(100% - ${scrollbarWidth-paddingWidth}px)`;
header.style.width = `calc(100% - ${scrollbarWidth+paddingInlineStart}px)`;
} }
/** /**

6
chrome/content/zotero/itemTree.jsx
View file

@ -87,7 +87,11 @@ function makeItemRenderer(itemTree) {
// Set depth indent // Set depth indent
const depth = itemTree.getLevel(index); const depth = itemTree.getLevel(index);
span.style.paddingInlineStart = (CHILD_INDENT * depth) + 'px'; let firstChildIndent = 0;
if (column.ordinal == 0) {
firstChildIndent = 6;
}
span.style.paddingInlineStart = ((CHILD_INDENT * depth) + firstChildIndent) + 'px';
return span; return span;
} }

9
scss/components/_virtualized-table.scss
View file

@ -39,6 +39,10 @@
} }
} }
.cell:first-child {
padding-inline-start: 6px;
}
.cell { .cell {
min-width: 30px; min-width: 30px;
cursor: default; cursor: default;
@ -142,7 +146,6 @@
height: 1.8em; height: 1.8em;
overflow: hidden; overflow: hidden;
border-inline-end: 1px solid #ddd; border-inline-end: 1px solid #ddd;
padding-inline-start: 6px;
&.static-columns { &.static-columns {
pointer-events: none; pointer-events: none;
@ -212,10 +215,6 @@
max-width: 100%; max-width: 100%;
overflow: auto; overflow: auto;
.row {
padding-inline-start: 6px;
}
.cell { .cell {
padding: 2px 5px; padding: 2px 5px;
text-overflow: ellipsis; text-overflow: ellipsis;