tweak tooltip

taiyme · Feb 22, 2024 · 9a00745 · 9a00745
1 parent d15f114
commit 9a00745
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 3 deletions.
diff --git a/packages/frontend/src/components/MkTooltip.vue b/packages/frontend/src/components/MkTooltip.vue
@@ -11,7 +11,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 	:leaveToClass="defaultStore.state.animation ? $style.transition_tooltip_leaveTo : ''"
 	appear @afterLeave="emit('closed')"
 >
-	<div v-show="showing" ref="el" :class="$style.root" class="_acrylic _shadow" :style="{ zIndex, maxWidth: maxWidth + 'px' }">
+	<div v-show="showing" ref="el" :class="[$style.root, { [$style.primary]: primary }]" class="_acrylic _shadow" :style="{ zIndex, maxWidth: maxWidth + 'px' }">
 		<slot>
 			<template v-if="text">
 				<Mfm v-if="asMfm" :text="text"/>
@@ -38,6 +38,7 @@ const props = withDefaults(defineProps<{
 	maxWidth?: number;
 	direction?: 'top' | 'bottom' | 'right' | 'left';
 	innerMargin?: number;
+	primary?: boolean;
 }>(), {
 	maxWidth: 250,
 	direction: 'top',
@@ -113,5 +114,11 @@ onUnmounted(() => {
 	border: solid 0.5px var(--divider);
 	pointer-events: none;
 	transform-origin: center center;
+
+	&.primary {
+		border: none;
+		background: var(--accent);
+		color: var(--fgOnAccent);
+	}
 }
 </style>
diff --git a/packages/frontend/src/scripts/get-note-menu.ts b/packages/frontend/src/scripts/get-note-menu.ts
@@ -565,6 +565,7 @@ export function getRenoteMenu(props: {
 							// @ts-expect-error
 							targetElement: props.renoteButton.value,
 							text: i18n.ts._tms.didPakuru,
+							primary: true,
 						});
 					}).catch((err) => {
 						os.alert({
@@ -588,6 +589,7 @@ export function getRenoteMenu(props: {
 							// @ts-expect-error
 							targetElement: props.renoteButton.value,
 							text: i18n.ts._tms.didNumberquote,
+							primary: true,
 						});
 					}).catch((err) => {
 						os.alert({

diff --git a/packages/frontend/src/scripts/tms/tooltip-from-element.ts b/packages/frontend/src/scripts/tms/tooltip-from-element.ts
@@ -9,6 +9,10 @@ import { popup } from '@/os.js';
 export const tooltipFromElement = (props: {
 	targetElement: HTMLElement;
 	text: string;
+	asMfm?: boolean;
+	maxWidth?: number;
+	direction?: 'top' | 'bottom' | 'right' | 'left';
+	primary?: boolean;
 }) => {
 	const showing = ref(true);
 	window.setTimeout(() => {
@@ -17,7 +21,6 @@ export const tooltipFromElement = (props: {
 	popup(defineAsyncComponent(() => import('@/components/MkTooltip.vue')), {
 		// @ts-expect-error
 		showing,
-		targetElement: props.targetElement,
-		text: props.text,
+		...props,
 	}, {}, 'closed');
 };