From 117c3ca644de05f936c09e1b288ec3f597e02449 Mon Sep 17 00:00:00 2001
From: Angelina Filippova <linakirsanova@gmail.com>
Date: Thu, 10 Oct 2019 04:01:31 +0300
Subject: [PATCH] Add background for collapse headers

---
 src/views/emojiPacks/components/EmojiPack.vue | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/views/emojiPacks/components/EmojiPack.vue b/src/views/emojiPacks/components/EmojiPack.vue
index 3f819de8..a04ea5d1 100644
--- a/src/views/emojiPacks/components/EmojiPack.vue
+++ b/src/views/emojiPacks/components/EmojiPack.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-collapse-item :title="name" :name="name">
+  <el-collapse-item :title="name" :name="name" class="has-background">
     <el-form label-width="120px" label-position="left" size="small">
       <el-form-item :label="$t('settings.sharePack')">
         <el-switch v-model="share" :disabled="!isLocal" />
@@ -41,10 +41,10 @@
       </el-form-item>
     </el-form>
     <el-collapse v-model="showPackContent" class="contents-collapse">
-      <el-collapse-item v-if="isLocal" :title="$t('settings.addNewEmoji')" name="addEmoji">
+      <el-collapse-item v-if="isLocal" :title="$t('settings.addNewEmoji')" name="addEmoji" class="no-background">
         <new-emoji-uploader :pack-name="name"/>
       </el-collapse-item>
-      <el-collapse-item v-if="Object.keys(pack.files).length > 0" :title="$t('settings.manageEmoji')" name="manageEmoji">
+      <el-collapse-item v-if="Object.keys(pack.files).length > 0" :title="$t('settings.manageEmoji')" name="manageEmoji" class="no-background">
         <single-emoji-editor
           v-for="(file, ename) in pack.files"
           :key="ename"
@@ -54,7 +54,7 @@
           :file="file"
           :is-local="isLocal" />
       </el-collapse-item>
-      <el-collapse-item v-if="!isLocal" :title="$t('settings.downloadPack')" name="downloadPack">
+      <el-collapse-item v-if="!isLocal" :title="$t('settings.downloadPack')" name="downloadPack" class="no-background">
         <p>
           {{ $t('settings.thisWillDownload') }} "{{ name }}" {{ $t('settings.downloadToCurrentInstance') }}
           "{{ downloadSharedAs.trim() === '' ? name : downloadSharedAs }}" ({{ $t('settings.canBeChanged') }}).
@@ -189,7 +189,7 @@ export default {
 }
 </script>
 
-<style>
+<style rel='stylesheet/scss' lang='scss'>
 .download-archive {
   width: 250px
 }
@@ -212,6 +212,12 @@ export default {
 .emoji-pack-card {
   margin-top: 5px;
 }
+.has-background .el-collapse-item__header {
+  background: #f6f6f6;
+}
+.no-background .el-collapse-item__header {
+  background: white;
+}
 .save-pack-button {
   margin-bottom: 5px
 }