From 9913d7788de504b749e00df32b67bed998f23945 Mon Sep 17 00:00:00 2001
From: Javier Godoy <11554739+javier-godoy@users.noreply.github.com>
Date: Mon, 2 Mar 2026 14:36:09 -0300
Subject: [PATCH] fix(demo): fix demo styles in vaadin 25

---
 .../styles/granitealert/demo-styles.css       | 25 +++++++++++++++++--
 1 file changed, 23 insertions(+), 2 deletions(-)

diff --git a/src/test/resources/META-INF/resources/frontend/styles/granitealert/demo-styles.css b/src/test/resources/META-INF/resources/frontend/styles/granitealert/demo-styles.css
index 5849357..f2a22ce 100644
--- a/src/test/resources/META-INF/resources/frontend/styles/granitealert/demo-styles.css
+++ b/src/test/resources/META-INF/resources/frontend/styles/granitealert/demo-styles.css
@@ -33,13 +33,34 @@ granite-alert-mixin.funny::part(alert) {
    	border: none;
 }
 
+granite-alert-mixin {
+    position: relative;
+}
+
+granite-alert-mixin span {
+    padding-right: 20px;
+    display: block;
+}
+
 granite-alert-mixin vaadin-button {
 	background-color: transparent;
-	float: right;
+	--vaadin-button-background: transparent;
 	cursor: pointer;
-    height: 26px;
     margin: 0;
     padding: 0;
+    
+    position: absolute;
+    box-shadow: none;
+    border: none;
+    height: 100%;
+    margin-top: 0.5px;
+    top: 0;
+    bottom: 0;
+    right: 0;
+}
+
+#content.demos-v25 granite-alert-mixin vaadin-button {
+    right: calc(8px * (1 - var(--vaadin-lumo-theme, 0)));
 }
       
 granite-alert-mixin[level="success"] vaadin-button {