Skip to content

Commit 10ad9af

Browse files
committed
style: refine toast close button styles for improved layout
- Simplified the CSS for the toast close button by removing unnecessary properties and adjusting its position. - Updated the button's top and right offsets to enhance its alignment within the toast notification. These changes aim to improve the visual consistency and usability of toast notifications. Signed-off-by: Innei <tukon479@gmail.com>
1 parent 2589db3 commit 10ad9af

1 file changed

Lines changed: 3 additions & 10 deletions

File tree

src/index.css

Lines changed: 3 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -194,23 +194,16 @@ html.dark .sonner-description {
194194
@apply !text-neutral-400;
195195
}
196196

197-
/* Toast 关闭按钮 - 20x20px,在内容区域 */
197+
/* Toast 关闭按钮 - 20x20px */
198198
[data-sonner-toast][data-styled='true'] [data-close-button] {
199-
--toast-close-button-transform: none !important;
200199
@apply !border-0 !bg-transparent;
201200
width: 20px !important;
202201
height: 20px !important;
203202
padding: 0 !important;
204203
border-radius: 4px !important;
205-
display: flex !important;
206-
align-items: center !important;
207-
justify-content: center !important;
208-
position: relative !important;
209-
top: auto !important;
210-
right: auto !important;
204+
top: 12px !important;
205+
right: 12px !important;
211206
left: auto !important;
212-
margin-left: auto !important;
213-
flex-shrink: 0 !important;
214207
transition: all 0.2s !important;
215208
}
216209

0 commit comments

Comments
 (0)