Components

Valaxy has several simple components built in.

You can use them directly when writing articles or themes.

Basic Components ​

Layout and Rendering ​

• ValaxyMain.vue: Basic page layout
• ValaxyMd.vue: Rendered Markdown content

Others ​

• AppLink.vue: The link automatically determines whether it is an intra-site link. Use <router-link/> for intra-site links and <a target=" blank"></a>for external links.
• ValaxyCopyright.vue: The copyright information in the article.
• ValaxyDecrypt.vue: Text decryption component
• ValaxyGalleryDecrypt.vue: Picture decryption component
• ValaxyLogo.vue: Valaxy Logo with gradient color
• ValaxySvgLogo.vue: Valaxy SVG Logo
• ValaxyPagination.vue: Paging component
• ValaxyOverlay.vue: Grey mask component
• ValaxyHamburger.vue: Hamburger button

<ValaxyLogo />

Helper Components ​

内置组件 ​

For users, can be used directly.

You can also extend public components by valaxy-addon-components.

Internationalization Component <VT /> ​

menu:
  posts: 博客文章

menu:
  posts: Posts

<!-- auto follow locale -->
<VT content="menu.posts" />

扩展公共组件 ​

pnpm add valaxy-addon-components

如：

• CodePen: CodePen code snippets
• VCLiveTime: The establishment time of the site

My Blog Content

<CodePen class="h-300px" name="Margin Collapse" id="WqXGpo" user="YunYouJun" tab="html,result" />

My Blog Content

See the Pen Margin Collapse by YunYouJun (@YunYouJun) on CodePen.

自定义 ​

For more usage, please refer to Custom Components。