Fix overflow issues for info-row values in the dialogs

This commit is contained in:
Johannes Zellner
2025-08-13 16:54:38 +02:00
parent 39cad02e0d
commit 80f253e67c
3 changed files with 6 additions and 11 deletions
@@ -105,11 +105,11 @@ defineExpose({
</div>
<div class="info-row" v-if="target.provider !== 'noop'">
<div class="info-label">{{ $t('backups.location.location') }}</div>
<div class="info-value">
<div class="info-value" style="overflow: auto;">
<span v-if="mountlike(target.provider) || target.provider === 'filesystem'">
<span v-if="target.provider === 'filesystem'">{{ target.config.backupDir }}{{ (target.config.prefix ? `/${target.config.prefix}` : '') }}</span>
<span v-if="target.provider === 'disk' || target.provider === 'ext4' || target.provider === 'xfs' || target.provider === 'mountpoint'">{{ target.config.mountOptions.diskPath || target.config.mountPoint }}{{ (target.config.prefix ? '/' : '') + target.config.prefix }}</span>
<span v-if="target.provider === 'cifs' || target.provider === 'nfs' || target.provider === 'sshfs'">{{ target.config.mountOptions.host }}:{{ target.config.mountOptions.remoteDir }}{{ (target.prefix ? '/' : '') + target.config.prefix }}</span>
<span v-if="target.provider === 'cifs' || target.provider === 'nfs' || target.provider === 'sshfs'">{{ target.config.mountOptions.host }}:{{ target.config.mountOptions.remoteDir }}{{ (target.config.prefix ? '/' : '') + target.config.prefix }}</span>
</span>
<span v-if="target.provider !== 's3' && target.provider !== 'minio' && (s3like(target.provider) || target.provider === 'gcs')">{{ target.config.bucket + (target.config.prefix ? '/' : '') + target.config.prefix }}</span>
+2 -3
View File
@@ -233,16 +233,15 @@ tr:hover .table-actions {
.info-row {
display: flex;
margin-bottom: 10px;
justify-content: space-between;
}
.info-label {
font-weight: bold;
flex-basis: 50%;
text-wrap: nowrap;
}
.info-value {
flex-basis: 50%;
text-align: right;
text-overflow: ellipsis;
overflow: hidden;
text-wrap: nowrap;
+2 -6
View File
@@ -360,8 +360,8 @@ onMounted(async () => {
</div>
<div class="info-row">
<div class="info-label">{{ $t('backups.backupEdit.remotePath') }}</div>
<div class="info-value" style="cursor: pointer;">{{ infoBackup.remotePath }}</div>
<div style="cursor: pointer; padding-left: 6px;" @click="onCopyToClipboard(infoBackup.remotePath)"><i class="fa fa-clipboard"></i></div>
<div class="info-value" style="cursor: copy;" @click="onCopyToClipboard(infoBackup.remotePath)">{{ infoBackup.remotePath }}</div>
<div style="cursor: copy; padding-left: 6px;" @click="onCopyToClipboard(infoBackup.remotePath)"><i class="fa fa-clipboard"></i></div>
</div>
<div class="info-row">
<div class="info-label">{{ $t('backups.backupDetails.date') }}</div>
@@ -371,10 +371,6 @@ onMounted(async () => {
<div class="info-label">{{ $t('backups.backupDetails.version') }}</div>
<div class="info-value">{{ infoBackup.packageVersion }}</div>
</div>
<div class="info-row">
<div class="info-label">{{ $t('backups.backupDetails.format') }}</div>
<div class="info-value">{{ infoBackup.format }}</div>
</div>
<br/>