qbism/qb-admin-fe
1
0
Fork 0
forked from AkkomaGang/admin-fe
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add headers in table that manages emojis

Browse source
This commit is contained in:
Angelina Filippova 2020-10-09 13:03:38 +03:00
parent efbd75834f
commit dcfee0f5de
3 changed files with 15 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/lang/en.js
View file

@ -525,6 +525,8 @@ export default {
copy: 'Copy',
copyToLocalPack: 'Copy to local pack',
emptyPack: 'This emoji pack is empty',
emojiWarning: 'Pack names cannot include any of the following characters: # / < > & +'
emojiWarning: 'Pack names cannot include any of the following characters: # / < > & +',
image: 'Image'
}
}

10
src/views/emojiPacks/components/LocalEmojiPack.vue
View file

@ -44,6 +44,11 @@
</el-collapse-item>
<el-collapse-item :title=" $t('emoji.manageEmoji')" name="manageEmoji" class="no-background">
<div v-if="pack.files && Object.keys(pack.files).length > 0">
<div :class="isMobile ? 'emoji-container-flex' : 'emoji-container-grid'">
<span class="emoji-preview-img emoji-table-head">{{ $t('emoji.image') }}</span>
<span class="emoji-table-head">{{ $t('emoji.shortcode') }}</span>
<span class="emoji-table-head">{{ $t('emoji.file') }}</span>
</div>
<single-emoji-editor
v-for="(file, shortcode) in pack.files"
:key="shortcode"
@ -252,6 +257,11 @@ export default {
font-weight: 700;
color: #606266;
}
.emoji-table-head {
color: #909399;
font-size: 14px;
font-weight: 700;
}
.emoji-pack-card {
margin-top: 5px;
}

4
src/views/emojiPacks/components/SingleEmojiEditor.vue
View file

@ -178,7 +178,7 @@ export default {
}
.emoji-container-grid {
display: grid;
grid-template-columns: 75px auto auto 200px;
grid-template-columns: 75px 1fr 1fr 200px;
grid-column-gap: 15px;
margin-bottom: 10px;
}
@ -197,7 +197,7 @@ export default {
}
.remote-emoji-container-grid {
display: grid;
grid-template-columns: 75px auto auto 160px;
grid-template-columns: 75px 1fr 1fr 160px;
grid-column-gap: 15px;
margin-bottom: 10px;
}