From b4636631751449da34e2bad7e7276546c6fd3967 Mon Sep 17 00:00:00 2001 From: syuilo Date: Fri, 24 Dec 2021 12:34:24 +0900 Subject: [PATCH] enhance(client): tweak ui --- .../client/src/components/page-window.vue | 26 ++++++++++++++++++- packages/client/src/components/ui/window.vue | 5 +++- packages/client/src/scripts/use-tooltip.ts | 7 ++++- 3 files changed, 35 insertions(+), 3 deletions(-) diff --git a/packages/client/src/components/page-window.vue b/packages/client/src/components/page-window.vue index 39c185b3e0..ec7451d5aa 100644 --- a/packages/client/src/components/page-window.vue +++ b/packages/client/src/components/page-window.vue @@ -16,7 +16,13 @@ -
+ + +
@@ -33,6 +39,7 @@ import copyToClipboard from '@/scripts/copy-to-clipboard'; import { resolve } from '@/router'; import { url } from '@/config'; import * as symbols from '@/symbols'; +import * as os from '@/os'; export default defineComponent({ components: { @@ -139,6 +146,23 @@ export default defineComponent({ this.props = props; }, + menu(ev) { + os.popupMenu([{ + icon: 'fas fa-external-link-alt', + text: this.$ts.openInNewTab, + action: () => { + window.open(this.url, '_blank'); + this.$refs.window.close(); + } + }, { + icon: 'fas fa-link', + text: this.$ts.copyLink, + action: () => { + copyToClipboard(this.url); + } + }], ev.currentTarget || ev.target); + }, + back() { this.navigate(this.history.pop(), false); }, diff --git a/packages/client/src/components/ui/window.vue b/packages/client/src/components/ui/window.vue index d01498d8df..bd33289ccc 100644 --- a/packages/client/src/components/ui/window.vue +++ b/packages/client/src/components/ui/window.vue @@ -414,6 +414,10 @@ export default defineComponent({ } } + > .left { + min-width: 16px; + } + > .title { flex: 1; position: relative; @@ -421,7 +425,6 @@ export default defineComponent({ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; - text-align: center; cursor: move; } } diff --git a/packages/client/src/scripts/use-tooltip.ts b/packages/client/src/scripts/use-tooltip.ts index d0c6756eb1..bc8f27a038 100644 --- a/packages/client/src/scripts/use-tooltip.ts +++ b/packages/client/src/scripts/use-tooltip.ts @@ -1,4 +1,4 @@ -import { Ref, ref, watch } from 'vue'; +import { Ref, ref, watch, onUnmounted } from 'vue'; export function useTooltip( elRef: Ref, @@ -72,9 +72,14 @@ export function useTooltip( el.addEventListener('mouseleave', onMouseleave, { passive: true }); el.addEventListener('touchstart', onTouchstart, { passive: true }); el.addEventListener('touchend', onTouchend, { passive: true }); + el.addEventListener('click', close, { passive: true }); } }, { immediate: true, flush: 'post', }); + + onUnmounted(() => { + close(); + }); }