mirror of
https://github.com/gitbutlerapp/gitbutler.git
synced 2024-11-25 18:42:08 +03:00
Fix fileitem path truncation (#5397)
* Update Textarea.svelte * fix file path and name strings truncation * add tooltip * fix tooltip word break * update tooltip name
This commit is contained in:
parent
0560feedeb
commit
ad2a37113d
@ -101,6 +101,7 @@
|
||||
max-width: 240px;
|
||||
padding: 4px 8px;
|
||||
z-index: var(--z-blocker);
|
||||
word-break: break-word;
|
||||
text-align: left;
|
||||
box-shadow: var(--fx-shadow-s);
|
||||
}
|
||||
|
@ -91,12 +91,15 @@
|
||||
{/if}
|
||||
<div class="info">
|
||||
<FileIcon fileName={fileInfo.filename} />
|
||||
<span class="text-12 name">
|
||||
<span class="text-12 name truncate">
|
||||
{fileInfo.filename}
|
||||
</span>
|
||||
<span class="text-12 path">
|
||||
|
||||
<Tooltip text={filePath} delay={1500}>
|
||||
<span class="text-12 path truncate">
|
||||
{fileInfo.path}
|
||||
</span>
|
||||
</Tooltip>
|
||||
</div>
|
||||
|
||||
<div class="details">
|
||||
@ -181,8 +184,8 @@
|
||||
opacity var(--transition-fast);
|
||||
}
|
||||
|
||||
/* INFO */
|
||||
.info {
|
||||
pointer-events: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-grow: 1;
|
||||
@ -192,21 +195,23 @@
|
||||
}
|
||||
|
||||
.name {
|
||||
color: var(--clr-scale-ntrl-0);
|
||||
white-space: nowrap;
|
||||
flex-shrink: 0;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
flex-shrink: 1;
|
||||
flex-grow: 0;
|
||||
min-width: 40px;
|
||||
pointer-events: none;
|
||||
color: var(--clt-text-1);
|
||||
}
|
||||
|
||||
.path {
|
||||
color: var(--clr-scale-ntrl-0);
|
||||
flex-shrink: 0;
|
||||
flex-grow: 1;
|
||||
flex-basis: 0px;
|
||||
min-width: 50px;
|
||||
color: var(--clt-text-1);
|
||||
line-height: 120%;
|
||||
flex-shrink: 1;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
opacity: 0.3;
|
||||
transition: opacity var(--transition-fast);
|
||||
}
|
||||
|
||||
/* DETAILS */
|
||||
|
Loading…
Reference in New Issue
Block a user