file note layout tweaks

This commit is contained in:
zadam 2020-01-19 10:29:21 +01:00
parent 37f279fab0
commit a99c016818
3 changed files with 37 additions and 35 deletions

View File

@ -6,39 +6,51 @@ import TabAwareWidget from "../tab_aware_widget.js";
const TPL = `
<div class="note-detail-file note-detail-component">
<style>
.note-detail-file {
padding: 10px;
}
.file-table th, .file-table td {
padding: 10px;
font-size: larger;
}
.file-preview-content {
background-color: var(--accented-background-color);
padding: 15px;
max-height: 300px;
overflow: auto;
margin: 10px;
}
</style>
<table class="file-table">
<tr>
<th>Note ID:</th>
<th nowrap>Note ID:</th>
<td class="file-note-id"></td>
</tr>
<tr>
<th>Original file name:</th>
<th nowrap>Original file name:</th>
<td class="file-filename"></td>
</tr>
<tr>
<th>File type:</th>
<th nowrap>File type:</th>
<td class="file-filetype"></td>
</tr>
<tr>
<th>File size:</th>
<th nowrap>File size:</th>
<td class="file-filesize"></td>
</tr>
<tr class="file-preview-row">
<th>Preview:</th>
<td>
<pre class="file-preview-content"></pre>
</td>
</tr>
<tr>
<td colspan="2">
<button class="file-download btn btn-sm btn-primary" type="button">Download</button>
&nbsp;
<button class="file-open btn btn-sm btn-primary" type="button">Open</button>
&nbsp;
<button class="file-upload-new-revision btn btn-sm btn-primary">Upload new revision</button>
</td>
</tr>
</table>
<pre class="file-preview-content"></pre>
<button class="file-download btn btn-sm btn-primary" type="button">Download</button>
&nbsp;
<button class="file-open btn btn-sm btn-primary" type="button">Open</button>
&nbsp;
<button class="file-upload-new-revision btn btn-sm btn-primary">Upload new revision</button>
<input type="file" class="file-upload-new-revision-input" style="display: none">
</div>`;
@ -50,7 +62,6 @@ class NoteDetailFile extends TabAwareWidget{
this.$fileName = this.$widget.find(".file-filename");
this.$fileType = this.$widget.find(".file-filetype");
this.$fileSize = this.$widget.find(".file-filesize");
this.$previewRow = this.$widget.find(".file-preview-row");
this.$previewContent = this.$widget.find(".file-preview-content");
this.$downloadButton = this.$widget.find(".file-download");
this.$openButton = this.$widget.find(".file-open");
@ -116,11 +127,11 @@ class NoteDetailFile extends TabAwareWidget{
this.$fileType.text(this.tabContext.note.mime);
if (this.tabContext.note.content) {
this.$previewRow.show();
this.$previewContent.show();
this.$previewContent.text(this.tabContext.note.content);
}
else {
this.$previewRow.hide();
this.$previewContent.empty().hide();
}
// open doesn't work for protected notes since it works through browser which isn't in protected session

View File

@ -79,6 +79,10 @@ export default class PromotedAttributesWidget extends TabAwareWidget {
// we replace the whole content in one step so there can't be any race conditions
// (previously we saw promoted attributes doubling)
this.$container.empty().append($tbody);
this.$widget.show();
}
else {
this.$widget.hide();
}
return attributes;

View File

@ -353,11 +353,6 @@ div.ui-tooltip {
background-color: #eeeeee
}
.file-table th, .file-table td {
padding: 10px;
font-size: larger;
}
#sql-console-query {
height: 150px;
width: 100%;
@ -440,14 +435,6 @@ pre:not(.CodeMirror-line) {
white-space: pre-wrap;
}
.file-preview-content {
background-color: var(--accented-background-color);
padding: 15px;
max-width: 600px;
max-height: 300px;
overflow: auto;
}
.pointer {
cursor: pointer;
}