Browse Source

Fixed double tooltip positioning issues in song item

Owen Diffey 3 years ago
parent
commit
227319f87e

+ 8 - 2
frontend/src/components/Confirm.vue

@@ -1,14 +1,14 @@
 <template>
 	<tippy
 		interactive="true"
-		placement="top"
+		:placement="placement"
 		theme="confirm"
 		ref="confirm"
 		trigger="click"
 		@hide="confirm(false)"
 	>
 		<template #trigger>
-			<div @click.shift="confirm(true)" @click.exact="confirm()">
+			<div @click.shift.stop="confirm(true)" @click.exact="confirm()">
 				<slot />
 			</div>
 		</template>
@@ -18,6 +18,12 @@
 
 <script>
 export default {
+	props: {
+		placement: {
+			type: String,
+			default: "top"
+		}
+	},
 	data() {
 		return {
 			clickedOnce: false

+ 1 - 0
frontend/src/components/modals/EditPlaylist.vue

@@ -274,6 +274,7 @@
 														playlist.createdBy ||
 														isEditable()
 												"
+												placement="left"
 												@confirm="
 													removeSongFromPlaylist(
 														song.youtubeId

+ 4 - 1
frontend/src/pages/Admin/tabs/UnverifiedSongs.vue

@@ -102,7 +102,10 @@
 							>
 								<i class="material-icons">check_circle</i>
 							</button>
-							<confirm @confirm="hide(song._id, index)">
+							<confirm
+								placement="left"
+								@confirm="hide(song._id, index)"
+							>
 								<button
 									class="button is-danger"
 									content="Hide Song"

+ 4 - 1
frontend/src/pages/Admin/tabs/VerifiedSongs.vue

@@ -123,7 +123,10 @@
 							>
 								<i class="material-icons">edit</i>
 							</button>
-							<confirm @confirm="remove(song._id, index)">
+							<confirm
+								placement="left"
+								@confirm="remove(song._id, index)"
+							>
 								<button
 									class="button is-danger"
 									content="Unverify Song"

+ 1 - 0
frontend/src/pages/Profile/tabs/RecentActivity.vue

@@ -21,6 +21,7 @@
 					<div slot="actions">
 						<confirm
 							v-if="userId === myUserId"
+							placement="left"
 							@confirm="hideActivity(activity._id)"
 						>
 							<a content="Hide Activity" v-tippy>

+ 1 - 0
frontend/src/pages/Station/Sidebar/Queue.vue

@@ -35,6 +35,7 @@
 					>
 						<confirm
 							v-if="isOwnerOnly() || isAdminOnly()"
+							placement="left"
 							@confirm="removeFromQueue(song.youtubeId)"
 						>
 							<i