From 65980423c9ea69029f221c394833d59e1e93d7df Mon Sep 17 00:00:00 2001
From: kolaente <k@knt.li>
Date: Thu, 8 Jan 2026 13:10:15 +0100
Subject: [PATCH] fix: remove usage of .buttons

---
 frontend/src/components/misc/Notification.vue   |  4 ++--
 .../components/tasks/partials/RepeatAfter.vue   | 17 ++++++++++++++++-
 frontend/src/views/migrate/MigrationHandler.vue | 10 +++++++++-
 3 files changed, 27 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/misc/Notification.vue b/frontend/src/components/misc/Notification.vue
index b9c7d755f..639282948 100644
--- a/frontend/src/components/misc/Notification.vue
+++ b/frontend/src/components/misc/Notification.vue
@@ -41,7 +41,7 @@
 				</div>
 				<div
 					v-if="item.data?.actions?.length > 0"
-					class="buttons is-right"
+					class="tw-flex tw-justify-end tw-gap-2"
 				>
 					<XButton
 						v-for="(action, i) in item.data.actions"
@@ -64,7 +64,7 @@
 	z-index: 9999;
 }
 
-.buttons {
+.tw-flex {
 	margin-block-start: 0.5rem;
 }
 </style>
diff --git a/frontend/src/components/tasks/partials/RepeatAfter.vue b/frontend/src/components/tasks/partials/RepeatAfter.vue
index 3e2854f86..654aad076 100644
--- a/frontend/src/components/tasks/partials/RepeatAfter.vue
+++ b/frontend/src/components/tasks/partials/RepeatAfter.vue
@@ -1,6 +1,6 @@
 <template>
 	<div class="control repeat-after-input">
-		<div class="buttons has-addons is-centered mbs-2">
+		<div class="button-group mbs-2">
 			<XButton
 				variant="secondary"
 				class="is-small"
@@ -168,4 +168,19 @@ p {
 .input {
 	min-inline-size: 2rem;
 }
+
+.button-group {
+	display: flex;
+	justify-content: center;
+
+	:deep(.button:not(:last-child)) {
+		border-start-end-radius: 0;
+		border-end-end-radius: 0;
+	}
+
+	:deep(.button:not(:first-child)) {
+		border-start-start-radius: 0;
+		border-end-start-radius: 0;
+	}
+}
 </style>
diff --git a/frontend/src/views/migrate/MigrationHandler.vue b/frontend/src/views/migrate/MigrationHandler.vue
index 953407a40..b75b4123b 100644
--- a/frontend/src/views/migrate/MigrationHandler.vue
+++ b/frontend/src/views/migrate/MigrationHandler.vue
@@ -76,7 +76,7 @@
 				}}<br>
 				{{ $t('migrate.alreadyMigrated2') }}
 			</p>
-			<div class="buttons">
+			<div class="migration-buttons">
 				<XButton @click="migrate">
 					{{ $t('migrate.confirm') }}
 				</XButton>
@@ -326,4 +326,12 @@ async function migrate() {
 		}
 	}
 }
+
+.migration-buttons {
+	display: flex;
+	flex-wrap: wrap;
+	align-items: center;
+	justify-content: flex-start;
+	gap: 0.5rem;
+}
 </style>