fx-compat: Item box: Fix field sizing on all platforms

Layout should no longer shift when editing creators or fields.
(Linux untested.)
This commit is contained in:
Abe Jellinek 2023-04-04 14:23:40 -04:00
parent 16411422c8
commit aea1303119
3 changed files with 21 additions and 28 deletions

View file

@ -1,4 +1,6 @@
item-box { item-box {
--row-height: 1.5em;
display: flex; display: flex;
min-width: 0; min-width: 0;
width: 100%; width: 100%;
@ -14,7 +16,9 @@ item-box {
#info-table { #info-table {
display: grid; display: grid;
grid-template-columns: max-content 1fr; grid-template-columns: max-content 1fr;
grid-auto-rows: min-content; // Make sure rows are at least --row-height tall, but no taller than their tallest child
// This lets rows expand for multi-line editors
grid-auto-rows: minmax(var(--row-height), max-content);
align-items: center; align-items: center;
width: 100%; width: 100%;
} }
@ -31,8 +35,17 @@ item-box {
margin-inline-end: 5px; margin-inline-end: 5px;
} }
td > input, .creator-name-box > input {
align-self: center;
// Fields have 3px borders; cancel them out
margin-top: -3px;
margin-bottom: -3px;
margin-inline-start: 0;
padding: 0;
}
td > input { td > input {
align-self: stretch; margin-inline-end: 5px;
} }
th > label { th > label {
@ -119,9 +132,12 @@ item-box {
/* metadata field names */ /* metadata field names */
th { th {
align-self: stretch; display: flex;
height: var(--row-height);
align-self: start;
align-items: center;
justify-content: end;
font-weight: normal; font-weight: normal;
text-align: right;
margin-inline-start: 5px !important; margin-inline-start: 5px !important;
margin-inline-end: 2px !important; margin-inline-end: 2px !important;
} }

View file

@ -1,20 +1,5 @@
item-box { item-box {
th {
margin-top: 1px;
}
.zotero-clicky { .zotero-clicky {
min-height: 17px; min-height: 17px;
} }
td input {
margin: -2px 0 0;
padding: 1px;
border-width: 1px;
border-radius: 6px;
}
.creator-name-box input {
margin-bottom: -1px;
}
} }

View file

@ -24,14 +24,6 @@ item-box {
max-width: 7px; max-width: 7px;
max-height: 7px; max-height: 7px;
} }
td > input {
margin-top: -1px;
margin-bottom: -2.5px;
margin-inline-start: 0;
margin-inline-end: 5px;
padding: 0;
}
} }
/* BEGIN 2X BLOCK -- DO NOT EDIT MANUALLY -- USE 2XIZE */ /* BEGIN 2X BLOCK -- DO NOT EDIT MANUALLY -- USE 2XIZE */