Update paste modal sizing and scrolling

Signed-off-by: Joe Ma <rikkaneko23@gmail.com>
This commit is contained in:
Joe Ma 2024-02-04 22:46:11 +08:00
parent 2d2cb5e804
commit c5569ea30f
No known key found for this signature in database
GPG key ID: 7A0ECF5F5EDC587F
3 changed files with 24 additions and 11 deletions

View file

@ -217,10 +217,10 @@
</button>
</div>
<img src="" class="mb-3 rounded mx-auto d-block w-75" alt="" id="paste_qrcode" style="max-width: 280px">
<div class="mb-3 w-75 mx-auto">
<table class="table table-striped table-bordered align-middle caption-top">
<div class="mb-3 mx-auto">
<table class="table table-striped table-bordered align-middle caption-top mx-auto" style="max-width: 280px;">
<caption>Paste information</caption>
<tbody>
<tbody id="paste_info_table">
<tr>
<td class="text-center col-3 text-nowrap">Paste ID</td>
<td class="text-center col-6" id="paste_info_uuid">-</td>
@ -247,11 +247,11 @@
</tr>
<tr>
<td class="text-center col-3 text-nowrap">Created</td>
<td class="text-center col-6 text-nowrap" id="paste_info_created">-</td>
<td class="text-center col-6 text-nowrap text-truncate" id="paste_info_created">-</td>
</tr>
<tr>
<td class="text-center col-3 text-nowrap">Expired</td>
<td class="text-center col-6 text-nowrap" id="paste_info_expired">-</td>
<td class="text-center col-6 text-nowrap text-truncate" id="paste_info_expired">-</td>
</tr>
</tbody>
</table>

View file

@ -23,3 +23,19 @@
.card-header .collapsed .fa-chevron-down {
transform: rotate(90deg);
}
#paste_info_table td.col-6 {
max-width: 200px;
}
#paste_info_title {
overflow: scroll;
white-space: nowrap;
scrollbar-width: none; /* Firefox */
}
#paste_info_title::-webkit-scrollbar {
width: 0px;
height: 0px;
background: transparent;
}

View file

@ -113,6 +113,7 @@ function build_paste_modal(paste_info, show_qrcode = true, saved = true, build_o
let modal = new bootstrap.Modal(paste_modal.modal);
if (!build_only) modal.show();
$('.modal-body').scrollTop('0');
}
/**
@ -376,7 +377,7 @@ $(function () {
}
try {
const res = await fetch(`${ENDPOINT}/${uuid}/settings?${new URLSearchParams({ json: '1' })}`);
const res = await fetch(`https://pb.nekoid.cc/${uuid}/settings?${new URLSearchParams({ json: '1' })}`);
if (res.ok) {
const paste_info = await res.json();
build_paste_modal(paste_info, show_qrcode, false);
@ -401,11 +402,7 @@ $(function () {
paste_modal.id_copy_btn.removeClass('btn-primary');
paste_modal.id_copy_btn.addClass('btn-success');
tooltip.setContent({ '.tooltip-inner': 'Copied' });
} catch (err) {
tooltip.setContent({ '.tooltip-inner': 'Copied failed' });
}
} else {
tooltip.setContent({ '.tooltip-inner': 'Copied failed' });
} catch (err) {}
}
});