From c8b304c269e227810ca29509819b78c09cddee60 Mon Sep 17 00:00:00 2001
From: Ger Teck <changerteck@gmail.com>
Date: Tue, 23 Jul 2024 17:46:47 +0800
Subject: [PATCH] Fix dismissible-box styling issue (#2564)

Fix dismissible-box styling issue

Changes in #2487 renamed the class from alert-dismissible to
alert-dismissible-box, causing Bootstrap CSS styles on
.alert-dismissible .btn-close to lose effect.

This commit restores the original styling by adding back
the necessary CSS styles to .alert-dismissible-box .btn-close.
---
 packages/vue-components/src/Box.vue | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/packages/vue-components/src/Box.vue b/packages/vue-components/src/Box.vue
index 26bfba40b8..e44e984233 100644
--- a/packages/vue-components/src/Box.vue
+++ b/packages/vue-components/src/Box.vue
@@ -355,6 +355,10 @@ export default {
     }
 
     .alert-dismissible-box .btn-close {
+        position: absolute;
+        top: 0;
+        right: 0;
+        z-index: 2;
         padding: 1rem;
     }