Simplify structure and fix styling
Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
@@ -30,55 +30,48 @@
|
|||||||
style="display: none;"
|
style="display: none;"
|
||||||
multiple
|
multiple
|
||||||
@change="handleUploadFile">
|
@change="handleUploadFile">
|
||||||
<div class="attachment-list">
|
<ul class="attachment-list">
|
||||||
<ul>
|
<li v-for="attachment in uploadQueue" :key="attachment.name" class="attachment">
|
||||||
<li v-for="attachment in uploadQueue" :key="attachment.name" class="attachment">
|
<a class="fileicon" :style="mimetypeForAttachment('none')" />
|
||||||
<a class="fileicon" :style="mimetypeForAttachment('none')" />
|
<div class="details">
|
||||||
<div class="details">
|
<a>
|
||||||
<a>
|
<div class="filename">
|
||||||
<div class="filename">
|
<span class="basename">{{ attachment.name }}</span>
|
||||||
<span class="basename">{{ attachment.name }}</span>
|
</div>
|
||||||
</div>
|
<progress :value="attachment.progress" max="100" />
|
||||||
<progress :value="attachment.progress" max="100" />
|
</a>
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<div class="attachment-list">
|
|
||||||
<ul>
|
|
||||||
<li v-for="attachment in attachments"
|
|
||||||
:key="attachment.id"
|
|
||||||
class="attachment">
|
|
||||||
<a class="fileicon" :style="mimetypeForAttachment(attachment.extendedData.mimetype)" :href="attachmentUrl(attachment)" />
|
|
||||||
<div class="details">
|
|
||||||
<a :href="attachmentUrl(attachment)" target="_blank">
|
|
||||||
<div class="filename">
|
|
||||||
<span class="basename">{{ attachment.data }}</span>
|
|
||||||
</div>
|
|
||||||
<span class="filesize">{{ formattedFileSize(attachment.extendedData.filesize) }}</span>
|
|
||||||
<span class="filedate">{{ relativeDate(attachment.createdAt*1000) }}</span>
|
|
||||||
<span class="filedate">{{ attachment.createdBy }}</span>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<Actions v-if="selectable">
|
|
||||||
<ActionButton icon="icon-confirm" @click="$emit('selectAttachment', attachment)">
|
|
||||||
{{ t('deck', 'Add this attachment') }}
|
|
||||||
</ActionButton>
|
|
||||||
</Actions>
|
|
||||||
<Actions v-if="removable">
|
|
||||||
<ActionButton v-if="attachment.deletedAt === 0" icon="icon-delete" @click="$emit('deleteAttachment', attachment)">
|
|
||||||
{{ t('deck', 'Delete Attachment') }}
|
|
||||||
</ActionButton>
|
|
||||||
|
|
||||||
<ActionButton v-else icon="icon-history" @click="$emit('restoreAttachment', attachment)">
|
|
||||||
{{ t('deck', 'Restore Attachment') }}
|
|
||||||
</ActionButton>
|
|
||||||
</Actions>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
</div>
|
||||||
</ul>
|
</li>
|
||||||
</div>
|
<li v-for="attachment in attachments"
|
||||||
|
:key="attachment.id"
|
||||||
|
class="attachment">
|
||||||
|
<a class="fileicon" :style="mimetypeForAttachment(attachment.extendedData.mimetype)" :href="attachmentUrl(attachment)" />
|
||||||
|
<div class="details">
|
||||||
|
<a :href="attachmentUrl(attachment)" target="_blank">
|
||||||
|
<div class="filename">
|
||||||
|
<span class="basename">{{ attachment.data }}</span>
|
||||||
|
</div>
|
||||||
|
<span class="filesize">{{ formattedFileSize(attachment.extendedData.filesize) }}</span>
|
||||||
|
<span class="filedate">{{ relativeDate(attachment.createdAt*1000) }}</span>
|
||||||
|
<span class="filedate">{{ attachment.createdBy }}</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<Actions v-if="selectable">
|
||||||
|
<ActionButton icon="icon-confirm" @click="$emit('selectAttachment', attachment)">
|
||||||
|
{{ t('deck', 'Add this attachment') }}
|
||||||
|
</ActionButton>
|
||||||
|
</Actions>
|
||||||
|
<Actions v-if="removable">
|
||||||
|
<ActionButton v-if="attachment.deletedAt === 0" icon="icon-delete" @click="$emit('deleteAttachment', attachment)">
|
||||||
|
{{ t('deck', 'Delete Attachment') }}
|
||||||
|
</ActionButton>
|
||||||
|
|
||||||
|
<ActionButton v-else icon="icon-history" @click="$emit('restoreAttachment', attachment)">
|
||||||
|
{{ t('deck', 'Restore Attachment') }}
|
||||||
|
</ActionButton>
|
||||||
|
</Actions>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
</AttachmentDragAndDrop>
|
</AttachmentDragAndDrop>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@@ -633,13 +633,16 @@ export default {
|
|||||||
width: 25vw;
|
width: 25vw;
|
||||||
min-width: 250px;
|
min-width: 250px;
|
||||||
min-height: 120px;
|
min-height: 120px;
|
||||||
margin: 20px 20px 60px 20px;
|
margin: 20px;
|
||||||
padding-bottom: 20px;
|
padding-bottom: 20px;
|
||||||
}
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
.modal__content button {
|
&::v-deep .attachment-list {
|
||||||
float: right;
|
flex-shrink: 1;
|
||||||
margin: 40px 3px 3px 0;
|
overflow: scroll;
|
||||||
|
max-height: 50vh;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -32,5 +32,5 @@ const config = {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
module.exports = merge(config, webpackConfig)
|
module.exports = merge(webpackConfig, config)
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user