vitepress icon indicating copy to clipboard operation
vitepress copied to clipboard

feat(theme-default): Add icons on action buttons

Open 0xlau opened this issue 10 months ago • 4 comments

close #3783

Usages

actions:
    - theme: brand
      text: lorem ipsum
      link: https://test.com
      startIcon:
          src: /test.svg
          alt: test
          width: 18
          height: 18

or

actions:
    - theme: brand
      text: lorem ipsum
      link: https://test.com
      endIcon: <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m16.172 11l-5.364-5.364l1.414-1.414L20 12l-7.778 7.778l-1.414-1.414L16.172 13H4v-2z"/></svg>

About Docs

interface HeroAction {

  // .....

  // Show the left icon on action button.
  startIcon?: ActionIcon

  // Show the right icon on action button.
  endIcon?: ActionIcon
}

type ActionIcon =
  | string
  | { src: string; alt?: string; width?: string; height: string }
  | {
      light: string
      dark: string
      alt?: string
      width?: string
      height: string
    }

ScreenShot

image

0xlau avatar Apr 17 '24 02:04 0xlau

Hi @brc-dd , May I ask when you plan to merge this commit, because I need this feature very much in the future version. : )

0xlau avatar Aug 22 '24 16:08 0xlau

Ah, sorry. Slipped my notice. Looks good. I'll check the styles once maybe (grid-related styles aren't needed?) and merge it before next minor release. Also, can you rebase it to resolve conflicts? That should trigger a preview release now, which you can use in meanwhile.

brc-dd avatar Aug 22 '24 16:08 brc-dd

commit: 930dbc7

pnpm add https://pkg.pr.new/vitepress@3795

Open in Stackblitz

pkg-pr-new[bot] avatar Aug 22 '24 16:08 pkg-pr-new[bot]

Hey, our team could really use this feature! Is there any way I can help to promote its release?

yamcodes avatar Sep 03 '24 07:09 yamcodes