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

Fix tab content misaligned in RTL mode. Fix #3658

Browse source
This commit is contained in:
Tom Najdek 2024-02-01 15:35:17 +01:00
parent aee38791a7
commit 6efbf4c2ec
No known key found for this signature in database
GPG key ID: EEC61A7B4C667D77
2 changed files with 12 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
chrome/content/zotero/components/tabBar.jsx
View file

@ -289,7 +289,7 @@ const TabBar = forwardRef(function (props, ref) {
tabIndex="-1" tabIndex="-1"
> >
{icon} {icon}
<div className="tab-name" dir="auto">{title}</div> <div className="tab-name">{title}</div>
<div <div
className="tab-close" className="tab-close"
onClick={(event) => handleTabClose(event, id)} onClick={(event) => handleTabClose(event, id)}

13
scss/components/_tabBar.scss
View file

@ -161,8 +161,8 @@
min-width: 100px; min-width: 100px;
height: 28px; height: 28px;
line-height: 16px; line-height: 16px;
padding-right: 22px; padding-inline-end: 22px;
padding-left: 6px; padding-inline-start: 6px;
display: flex; display: flex;
align-items: center; align-items: center;
border-radius: 5px; border-radius: 5px;
@ -201,11 +201,18 @@
line-height: 1.38461538em; line-height: 1.38461538em;
margin-inline-start: 4px; margin-inline-start: 4px;
overflow: hidden; overflow: hidden;
text-align: left; text-align: start;
white-space: nowrap; white-space: nowrap;
&:dir(ltr) {
mask-image: linear-gradient(to left, transparent 0px, var(--fill-primary) 20px); mask-image: linear-gradient(to left, transparent 0px, var(--fill-primary) 20px);
} }
&:dir(rtl) {
mask-image: linear-gradient(to right, transparent 0px, var(--fill-primary) 20px);
}
}
.tab-icon { .tab-icon {
flex: 0 0 16px; flex: 0 0 16px;
height: 16px; height: 16px;