From c37d8cd1aaaf0474642ea950e2c52bc4769b5641 Mon Sep 17 00:00:00 2001 From: Tinhone Date: Tue, 8 Aug 2023 21:22:41 +0800 Subject: [PATCH 1/3] =?UTF-8?q?=E5=AE=8C=E6=88=90=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../style/custom-navbar/_nav-link.scss | 17 +++++++++++++ .../components/style/custom-navbar/entry.ts | 2 ++ .../components/style/custom-navbar/index.ts | 6 +++++ .../link-popup-content-align-style.ts | 25 +++++++++++++++++++ 4 files changed, 50 insertions(+) create mode 100644 registry/lib/components/style/custom-navbar/link-popup-content-align-style.ts diff --git a/registry/lib/components/style/custom-navbar/_nav-link.scss b/registry/lib/components/style/custom-navbar/_nav-link.scss index aa96e87b88..8d0349379e 100644 --- a/registry/lib/components/style/custom-navbar/_nav-link.scss +++ b/registry/lib/components/style/custom-navbar/_nav-link.scss @@ -6,6 +6,7 @@ border-bottom: 2px solid transparent; font-size: 15px; line-height: normal; + &::before { content: ""; position: absolute; @@ -18,7 +19,23 @@ transition: 0.16s 0.1s ease-out; transform: scaleX(0); } + &:hover::before { transform: scaleX(1); } + + html[data-navbar-link-popup-content-align-style='left'] &, + &.left { + justify-content: left; + } + + html[data-navbar-link-popup-content-align-style='center'] &, + &.center { + justify-content: center; + } + + html[data-navbar-link-popup-content-align-style='right'] &, + &.right { + justify-content: right; + } } \ No newline at end of file diff --git a/registry/lib/components/style/custom-navbar/entry.ts b/registry/lib/components/style/custom-navbar/entry.ts index 4f0bbb98e8..d6dc4fa102 100644 --- a/registry/lib/components/style/custom-navbar/entry.ts +++ b/registry/lib/components/style/custom-navbar/entry.ts @@ -2,6 +2,7 @@ import { ComponentEntry } from '@/components/types' import { addComponentListener } from '@/core/settings' import { isIframe, isNotHtml, matchUrlPattern, mountVueComponent } from '@/core/utils' import { setupNotifyStyle } from './notify-style' +import { setupLinkPopupContentAlignStyle } from './link-popup-content-align-style' export const entry: ComponentEntry = async ({ metadata: { name } }) => { // const url = document.URL.replace(location.search, '') @@ -52,4 +53,5 @@ export const entry: ComponentEntry = async ({ metadata: { name } }) => { addComponentListener(`${name}.${style}`, value => customNavbar.toggleStyle(value, style), true) }) setupNotifyStyle() + setupLinkPopupContentAlignStyle() } diff --git a/registry/lib/components/style/custom-navbar/index.ts b/registry/lib/components/style/custom-navbar/index.ts index 5b6add2d94..6720e3bdf8 100644 --- a/registry/lib/components/style/custom-navbar/index.ts +++ b/registry/lib/components/style/custom-navbar/index.ts @@ -8,6 +8,7 @@ import { urlInclude, urlExclude } from './urls' import { entry } from './entry' import { getNumberValidator } from '@/core/utils' import { NavbarNotifyStyle } from './notify-style' +import { NavbarLinkPopupContentAlignStyle } from './link-popup-content-align-style' const styleID = 'custom-navbar-style' const options = defineOptionsMetadata({ @@ -91,6 +92,11 @@ const options = defineOptionsMetadata({ dropdownEnum: NavbarNotifyStyle, displayName: '消息提醒样式', }, + linkPopupContentAlignStyle: { + defaultValue: NavbarLinkPopupContentAlignStyle.Left, + dropdownEnum: NavbarLinkPopupContentAlignStyle, + displayName: '仅包含链接的导航栏弹窗文字对齐样式', + }, searchBarWidth: { defaultValue: 15, slider: { diff --git a/registry/lib/components/style/custom-navbar/link-popup-content-align-style.ts b/registry/lib/components/style/custom-navbar/link-popup-content-align-style.ts new file mode 100644 index 0000000000..38f1832fd1 --- /dev/null +++ b/registry/lib/components/style/custom-navbar/link-popup-content-align-style.ts @@ -0,0 +1,25 @@ +import { addComponentListener } from '@/core/settings' + +export enum NavbarLinkPopupContentAlignStyle { + Left = '左侧对齐', + Center = '居中对齐', + Right = '右侧对齐', +} + +export const setupLinkPopupContentAlignStyle = () => { + const map = { + [NavbarLinkPopupContentAlignStyle.Left]: 'left', + [NavbarLinkPopupContentAlignStyle.Center]: 'center', + [NavbarLinkPopupContentAlignStyle.Right]: 'right', + } + addComponentListener( + 'customNavbar.linkPopupContentAlignStyle', + (value: NavbarLinkPopupContentAlignStyle) => { + document.documentElement.setAttribute( + 'data-navbar-link-popup-content-align-style', + map[value], + ) + }, + true, + ) +} From 7378a6db5d6e91360f042d816c6c40a27d9e287e Mon Sep 17 00:00:00 2001 From: Tinhone Date: Wed, 9 Aug 2023 23:57:57 +0800 Subject: [PATCH 2/3] =?UTF-8?q?feat:=20=E4=B8=BA=E5=AF=BC=E8=88=AA?= =?UTF-8?q?=E6=A0=8F=E4=BD=BF=E7=94=A8=20nav-link=20style=20=E7=9A=84?= =?UTF-8?q?=E5=BC=B9=E7=AA=97=E5=A2=9E=E5=8A=A0=E6=9B=B4=E5=A4=9A=E7=9A=84?= =?UTF-8?q?=E5=AF=B9=E9=BD=90=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 补一下 commit message（ --- .../lib/components/style/custom-navbar/_nav-link.scss | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/registry/lib/components/style/custom-navbar/_nav-link.scss b/registry/lib/components/style/custom-navbar/_nav-link.scss index 8d0349379e..64d2fcbb8b 100644 --- a/registry/lib/components/style/custom-navbar/_nav-link.scss +++ b/registry/lib/components/style/custom-navbar/_nav-link.scss @@ -8,7 +8,7 @@ line-height: normal; &::before { - content: ""; + content: ''; position: absolute; top: calc(100% - 4px); left: 8px; @@ -26,7 +26,7 @@ html[data-navbar-link-popup-content-align-style='left'] &, &.left { - justify-content: left; + justify-content: flex-start; } html[data-navbar-link-popup-content-align-style='center'] &, @@ -36,6 +36,6 @@ html[data-navbar-link-popup-content-align-style='right'] &, &.right { - justify-content: right; + justify-content: flex-end; } -} \ No newline at end of file +} From ae19ff5e2c3d776ed5d6286b4e2c87e7888ac39b Mon Sep 17 00:00:00 2001 From: Tinhone <81268244+Tinhone@users.noreply.github.com> Date: Thu, 10 Aug 2023 16:52:49 +0800 Subject: [PATCH 3/3] Update registry/lib/components/style/custom-navbar/index.ts Co-authored-by: Grant Howard --- registry/lib/components/style/custom-navbar/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/registry/lib/components/style/custom-navbar/index.ts b/registry/lib/components/style/custom-navbar/index.ts index 6720e3bdf8..98eaf05797 100644 --- a/registry/lib/components/style/custom-navbar/index.ts +++ b/registry/lib/components/style/custom-navbar/index.ts @@ -95,7 +95,7 @@ const options = defineOptionsMetadata({ linkPopupContentAlignStyle: { defaultValue: NavbarLinkPopupContentAlignStyle.Left, dropdownEnum: NavbarLinkPopupContentAlignStyle, - displayName: '仅包含链接的导航栏弹窗文字对齐样式', + displayName: '链接对齐样式', }, searchBarWidth: { defaultValue: 15,