From 38a2fbf79125b8093a970fe54f644d03c14162be Mon Sep 17 00:00:00 2001
From: Thomas Amland <thomas.amland@gmail.com>
Date: Sun, 28 Mar 2021 13:09:43 +0200
Subject: [PATCH] fix modal close button style

---
 src/playlist/PlaylistNav.vue        | 3 +++
 src/shared/components/EditModal.vue | 3 +++
 src/style/main.scss                 | 5 +++++
 3 files changed, 11 insertions(+)

diff --git a/src/playlist/PlaylistNav.vue b/src/playlist/PlaylistNav.vue
index 4e1038f..ca9981a 100644
--- a/src/playlist/PlaylistNav.vue
+++ b/src/playlist/PlaylistNav.vue
@@ -24,6 +24,9 @@
     </router-link>
 
     <b-modal v-model="showModal" title="New playlist">
+      <template #modal-header-close>
+        <Icon icon="x" />
+      </template>
       <b-form-group label="Name">
         <b-form-input v-model="playlistName" type="text" />
       </b-form-group>
diff --git a/src/shared/components/EditModal.vue b/src/shared/components/EditModal.vue
index c385b7e..2fc1080 100644
--- a/src/shared/components/EditModal.vue
+++ b/src/shared/components/EditModal.vue
@@ -1,5 +1,8 @@
 <template>
   <b-modal ok-title="Save" :visible="visible" @ok="confirm" @change="change">
+    <template #modal-header-close>
+      <Icon icon="x" />
+    </template>
     <template #modal-title>
       <slot name="title" :item="copy">
         {{ title }}
diff --git a/src/style/main.scss b/src/style/main.scss
index bf50d6b..fa9deff 100644
--- a/src/style/main.scss
+++ b/src/style/main.scss
@@ -74,3 +74,8 @@ $enable-responsive-font-sizes: true;
 
 @import '~bootstrap';
 @import '~bootstrap-vue';
+
+.modal-header .close {
+  color: $theme-text;
+  opacity: 1;
+}