diff --git a/changes/changelog.d/702.bugfix b/changes/changelog.d/702.bugfix
new file mode 100644
index 0000000000000000000000000000000000000000..3c8090fc43a93ce3c7e7f0000a6c3f12de0e6385
--- /dev/null
+++ b/changes/changelog.d/702.bugfix
@@ -0,0 +1 @@
+Fixed alignement/size issue with some buttons (#702)
\ No newline at end of file
diff --git a/front/src/components/auth/Settings.vue b/front/src/components/auth/Settings.vue
index 73515a1ba3a901c049ea0cf7d3205fc17d3f281a..3098d43f7d649aa895002fc697173b7e1104dbb7 100644
--- a/front/src/components/auth/Settings.vue
+++ b/front/src/components/auth/Settings.vue
@@ -102,7 +102,7 @@
<li><translate :translate-context="'Popup/Settings/List item'">Your Subsonic password will be changed to a new, random one, logging you out from devices that used the old Subsonic password</translate></li>
</ul>
</div>
- <p slot="modal-confirm"><translate :translate-context="'Popup/Setting/Button.Label'">Disable access</translate></p>
+ <div slot="modal-confirm"><translate :translate-context="'Popup/Setting/Button.Label'">Disable access</translate></div>
</dangerous-button>
</form>
<div class="ui hidden divider" />
diff --git a/front/src/components/auth/SubsonicTokenForm.vue b/front/src/components/auth/SubsonicTokenForm.vue
index 1e179dd95f215d316d32b1a3a77d9cd61ca0f786..496d69eaaf1c2f6a3b438d14904c41fc6574e797 100644
--- a/front/src/components/auth/SubsonicTokenForm.vue
+++ b/front/src/components/auth/SubsonicTokenForm.vue
@@ -34,7 +34,7 @@
<translate :translate-context="'Content/Settings/Button.Label/Verb'">Request a new password</translate>
<p slot="modal-header"><translate :translate-context="'Popup/Settings/Title'">Request a new Subsonic API password?</translate></p>
<p slot="modal-content"><translate :translate-context="'Popup/Settings/Paragraph'">This will log you out from existing devices that use the current password.</translate></p>
- <p slot="modal-confirm"><translate :translate-context="'Popup/Settings/Button.Label/Verb'">Request a new password</translate></p>
+ <div slot="modal-confirm"><translate :translate-context="'Popup/Settings/Button.Label/Verb'">Request a new password</translate></div>
</dangerous-button>
<button
v-else
@@ -49,7 +49,7 @@
<translate :translate-context="'Content/Settings/Button.Label/Verb'">Disable Subsonic access</translate>
<p slot="modal-header"><translate :translate-context="'Popup/Settings/Title'">Disable Subsonic API access?</translate></p>
<p slot="modal-content"><translate :translate-context="'Popup/Settings/Paragraph'">This will completely disable access to the Subsonic API using from account.</translate></p>
- <p slot="modal-confirm"><translate :translate-context="'Popup/Settings/Button.Label'">Disable access</translate></p>
+ <div slot="modal-confirm"><translate :translate-context="'Popup/Settings/Button.Label'">Disable access</translate></div>
</dangerous-button>
</template>
</form>
diff --git a/front/src/components/common/ActionTable.vue b/front/src/components/common/ActionTable.vue
index 5fcaceaacacf3c37629d4734e0fd700880463299..f1c5a400fe7fe84600149244e11e427e76622d55 100644
--- a/front/src/components/common/ActionTable.vue
+++ b/front/src/components/common/ActionTable.vue
@@ -45,7 +45,7 @@
<p slot="modal-content">
<translate>This may affect a lot of elements or have irreversible consequences, please double check this is really what you want.</translate>
</p>
- <p slot="modal-confirm"><translate>Launch</translate></p>
+ <div slot="modal-confirm"><translate>Launch</translate></div>
</dangerous-button>
<div
v-else
diff --git a/front/src/components/manage/moderation/InstancePolicyForm.vue b/front/src/components/manage/moderation/InstancePolicyForm.vue
index 05ccecc53cf25521bea30cb16e3b8765c818ffb5..7235b9417ad73b13f94cff292c50d3d04cabe842 100644
--- a/front/src/components/manage/moderation/InstancePolicyForm.vue
+++ b/front/src/components/manage/moderation/InstancePolicyForm.vue
@@ -66,9 +66,9 @@
<p slot="modal-content">
<translate :translate-context="'Popup/Moderation/Paragraph'">This action is irreversible.</translate>
</p>
- <p slot="modal-confirm">
+ <div slot="modal-confirm">
<translate :translate-context="'Popup/Moderation/Button.Label/Verb'">Delete moderation rule</translate>
- </p>
+ </div>
</dangerous-button>
</form>
</template>
diff --git a/front/src/components/playlists/Editor.vue b/front/src/components/playlists/Editor.vue
index fee9ef6b0baa5d940941f42a74cb415f01070a16..eb533fd01c3d2d642e60ebaa21b710977380e83c 100644
--- a/front/src/components/playlists/Editor.vue
+++ b/front/src/components/playlists/Editor.vue
@@ -43,7 +43,7 @@
<translate :translate-context="'Popup/Playlist/Title'" :translate-params="{playlist: playlist.name}">Do you want to clear the playlist "%{ playlist }"?</translate>
</p>
<p slot="modal-content"><translate :translate-context="'Popup/Playlist/Paragraph'">This will remove all tracks from this playlist and cannot be undone.</translate></p>
- <p slot="modal-confirm"><translate :translate-context="'Popup/Playlist/Button.Label'">Clear playlist</translate></p>
+ <div slot="modal-confirm"><translate :translate-context="'Popup/Playlist/Button.Label'">Clear playlist</translate></div>
</dangerous-button>
<div class="ui hidden divider"></div>
<template v-if="plts.length > 0">
diff --git a/front/src/views/content/libraries/Form.vue b/front/src/views/content/libraries/Form.vue
index 3ebbe152a5a8c20321aeab6c2308247c23b0e185..378ca9b06d9b700ee0dc865ca84dc3fa134e8075 100644
--- a/front/src/views/content/libraries/Form.vue
+++ b/front/src/views/content/libraries/Form.vue
@@ -36,9 +36,9 @@
The library and all its tracks will be deleted. This can not be undone.
</translate>
</p>
- <p slot="modal-confirm">
+ <div slot="modal-confirm">
<translate :translate-context="'Popup/Library/Button.Label/Verb'">Delete library</translate>
- </p>
+ </div>
</dangerous-button>
</form>
</template>
diff --git a/front/src/views/content/libraries/Quota.vue b/front/src/views/content/libraries/Quota.vue
index 5a817b333e003194f337edbd49e01c60cbd0c461..ddc304f771901632857284e77e70a6c833e04409 100644
--- a/front/src/views/content/libraries/Quota.vue
+++ b/front/src/views/content/libraries/Quota.vue
@@ -37,7 +37,7 @@
<translate :translate-context="'Content/Library/Button.Label/Verb'">Purge</translate>
<p slot="modal-header"><translate :translate-context="'Popup/Library/Title'">Purge pending files?</translate></p>
<p slot="modal-content"><translate :translate-context="'Popup/Library/Paragraph'">Removes uploaded but yet to be processed tracks completely, adding the corresponding data to your quota.</translate></p>
- <p slot="modal-confirm"><translate :translate-context="'Popup/Library/Button.Label'">Purge</translate></p>
+ <div slot="modal-confirm"><translate :translate-context="'Popup/Library/Button.Label'">Purge</translate></div>
</dangerous-button>
</div>
</div>
@@ -63,7 +63,7 @@
<translate :translate-context="'Content/Library/Button.Label/Verb'">Purge</translate>
<p slot="modal-header"><translate :translate-context="'Popup/Library/Title'">Purge skipped files?</translate></p>
<p slot="modal-content"><translate :translate-context="'Popup/Library/Paragraph'">Removes uploaded tracks skipped during the import processes completely, adding the corresponding data to your quota.</translate></p>
- <p slot="modal-confirm"><translate :translate-context="'Popup/Library/Button.Label'">Purge</translate></p>
+ <div slot="modal-confirm"><translate :translate-context="'Popup/Library/Button.Label'">Purge</translate></div>
</dangerous-button>
</div>
</div>
@@ -89,7 +89,7 @@
<translate :translate-context="'Content/Library/Button.Label/Verb'">Purge</translate>
<p slot="modal-header"><translate :translate-context="'Popup/Library/Title'">Purge errored files?</translate></p>
<p slot="modal-content"><translate :translate-context="'Popup/Library/Paragraph'">Removes uploaded tracks that could not be processed by the server completely, adding the corresponding data to your quota.</translate></p>
- <p slot="modal-confirm"><translate :translate-context="'Popup/Library/Button.Label'">Purge</translate></p>
+ <div slot="modal-confirm"><translate :translate-context="'Popup/Library/Button.Label'">Purge</translate></div>
</dangerous-button>
</div>
</div>
diff --git a/front/src/views/content/remote/Card.vue b/front/src/views/content/remote/Card.vue
index f596572959c24999c42c51e641cfa4ddf1654b1e..f42d0b06b9dd95822c3dd3c88579e6212184c615 100644
--- a/front/src/views/content/remote/Card.vue
+++ b/front/src/views/content/remote/Card.vue
@@ -103,7 +103,7 @@
<div slot="modal-content">
<p><translate :translate-context="'Popup/Library/Paragraph'">By unfollowing this library, you loose access to its content.</translate></p>
</div>
- <p slot="modal-confirm"><translate :translate-context="'Popup/Library/Button.Label'">Unfollow</translate></p>
+ <div slot="modal-confirm"><translate :translate-context="'Popup/Library/Button.Label'">Unfollow</translate></div>
</dangerous-button>
</div>
</div>
diff --git a/front/src/views/playlists/Detail.vue b/front/src/views/playlists/Detail.vue
index c96b8e3816da043e5749a46113b93263d5de4062..afaa2a9142c71681b06eacfe3dc36fc4f5ee3f7c 100644
--- a/front/src/views/playlists/Detail.vue
+++ b/front/src/views/playlists/Detail.vue
@@ -37,7 +37,7 @@
<translate :translate-params="{playlist: playlist.name}" :translate-context="'Popup/Playlist/Title/Call to action'">Do you want to delete the playlist "%{ playlist }"?</translate>
</p>
<p slot="modal-content"><translate :translate-context="'Popup/Playlist/Paragraph'">This will completely delete this playlist and cannot be undone.</translate></p>
- <p slot="modal-confirm"><translate :translate-context="'Popup/Playlist/Button.Label/Verb'">Delete playlist</translate></p>
+ <div slot="modal-confirm"><translate :translate-context="'Popup/Playlist/Button.Label/Verb'">Delete playlist</translate></div>
</dangerous-button>
</div>
</section>
diff --git a/front/src/views/radios/Detail.vue b/front/src/views/radios/Detail.vue
index c6cf51c52a562bbe2e5f20da85a5d8ba7fa2cfed..5669c7eec4a02685627f2c886efb7ebf9eaf5c48 100644
--- a/front/src/views/radios/Detail.vue
+++ b/front/src/views/radios/Detail.vue
@@ -26,7 +26,7 @@
<i class="trash icon"></i> Delete
<p slot="modal-header"><translate :translate-context="'Popup/Radio/Title'" :translate-params="{radio: radio.name}">Do you want to delete the radio "%{ radio }"?</translate></p>
<p slot="modal-content"><translate :translate-context="'Popup/Radio/Paragraph'">This will completely delete this radio and cannot be undone.</translate></p>
- <p slot="modal-confirm"><translate :translate-context="'Popup/Radio/Button.Label/Verb'">Delete radio</translate></p>
+ <div slot="modal-confirm"><translate :translate-context="'Popup/Radio/Button.Label/Verb'">Delete radio</translate></div>
</dangerous-button>
</template>
</div>