diff --git a/docs/pt/reference/default-theme-config.md b/docs/pt/reference/default-theme-config.md new file mode 100644 index 00000000..98e24bbb --- /dev/null +++ b/docs/pt/reference/default-theme-config.md @@ -0,0 +1,451 @@ +# Configuração do Tema Padrão + +A configuração do tema permite que você personalize seu tema. Você pode definir a configuração do tema através da opção `themeConfig` no arquivo de configuração: + +```ts +export default { + lang: 'en-US', + title: 'VitePress', + description: 'Vite & Vue powered static site generator.', + + // Configurações relacionadas ao tema. + themeConfig: { + logo: '/logo.svg', + nav: [...], + sidebar: { ... } + } +} +``` + +**As opções documentadas nesta página se aplicam apenas ao tema padrão.** Temas diferentes esperam configurações de tema diferentes. Ao usar um tema personalizado, o objeto de configuração do tema será passado para o tema para que se possam definir comportamentos condicionais. + +## i18nRouting + +- Tipo: `boolean` + +Alterar o local para, por exemplo, `zh` alterará a URL de `/foo` (ou `/en/foo/`) para `/zh/foo`. Você pode desativar esse comportamento definindo `themeConfig.i18nRouting` como `false`. + +## logo + +- Tipo: `ThemeableImage` + +Arquivo de logo a ser exibido na barra de navegação, logo antes do título do site. Aceita um caminho em string, ou um objeto para definir um logo diferente para os modos claro/escuro. + +```ts +export default { + themeConfig: { + logo: '/logo.svg' + } +} +``` + +```ts +type ThemeableImage = + | string + | { src: string; alt?: string } + | { light: string; dark: string; alt?: string } +``` + +## siteTitle + +- Tipo: `string | false` + +Você pode personalizar este item para substituir o título padrão do site (`title` na configuração da aplicação) na navegação. Quando definido como `false`, o título na navegação será desativado. Útil quando você tem um `logo` que já contém o título do site. + +```ts +export default { + themeConfig: { + siteTitle: 'Hello World' + } +} +``` + +## nav + +- Tipo: `NavItem` + +A configuração para o item do menu de navegação. Mais detalhes em [Tema Padrão: Navegação](./default-theme-nav#navigation-links). + +```ts +export default { + themeConfig: { + nav: [ + { text: 'Guia', link: '/guide' }, + { + text: 'Menu Dropdown', + items: [ + { text: 'Item A', link: '/item-1' }, + { text: 'Item B', link: '/item-2' }, + { text: 'Item C', link: '/item-3' } + ] + } + ] + } +} +``` + +```ts +type NavItem = NavItemWithLink | NavItemWithChildren + +interface NavItemWithLink { + text: string + link: string + activeMatch?: string + target?: string + rel?: string +} + +interface NavItemChildren { + text?: string + items: NavItemWithLink[] +} + +interface NavItemWithChildren { + text?: string + items: (NavItemChildren | NavItemWithLink)[] + activeMatch?: string +} +``` + +## sidebar + +- Tipo: `Sidebar` + +A configuração para o item do menu da barra lateral. Mais detalhes em [Tema Padrão: Barra Lateral](./default-theme-sidebar). + +```ts +export default { + themeConfig: { + sidebar: [ + { + text: 'Guia', + items: [ + { text: 'Introdução', link: '/introduction' }, + { text: 'Começando', link: '/getting-started' }, + ... + ] + } + ] + } +} +``` + +```ts +export type Sidebar = SidebarItem[] | SidebarMulti + +export interface SidebarMulti { + [path: string]: SidebarItem[] +} + +export type SidebarItem = { + /** + * O rótulo de texto do item. + */ + text?: string + + /** + * O link do item. + */ + link?: string + + /** + * Os filhos do item. + */ + items?: SidebarItem[] + + /** + * Se não especificado, o grupo não é retrátil. + * + * Se `true`, o grupo é retrátil e é colapsado por padrão. + * + * Se `false`, o grupo é retrátil, mas expandido por padrão. + */ + collapsed?: boolean +} +``` + +## aside + +- Tipo: `boolean | 'left'` +- Padrão: `true` +- Pode ser anulado por página via [frontmatter](./frontmatter-config#aside) + +Definir este valor como `false` impede a apresentação do elemento aside.\ +Definir este valor como `true` apresenta o aside à direita.\ +Definir este valor como `left` apresenta o aside à esquerda. + +Se você quiser desativá-lo para todas as visualizações, você deve usar `outline: false` em vez disso. + +## outline + +- Tipo: `Outline | Outline['level'] | false` +- O nível pode ser sobreposto por página via [frontmatter](./frontmatter-config#outline) + +Definir este valor como `false` impede a apresentação do elemento _outline_. Consulte a interface para obter mais detalhes: + +```ts +interface Outline { + /** + * Os níveis de títulos a serem exibidos na outline. + * Um único número significa que apenas os títulos desse nível serão exibidos. + * Se uma tupla for passada, o primeiro número é o nível mínimo e o segundo número é o nível máximo. + * `'deep'` é o mesmo que `[2, 6]`, o que significa que todos os títulos de `

` a `

` serão exibidos. + * + * @default 2 + */ + level?: number | [number, number] | 'deep' + + /** + * O título a ser exibido na outline. + * + * @default 'On this page' + */ + label?: string +} +``` + +## socialLinks + +- Tipo: `SocialLink[]` + +Você pode definir esta opção para mostrar os links de redes sociais com ícones na navegação. + +```ts +export default { + themeConfig: { + socialLinks: [ + { icon: 'github', link: 'https://github.com/vuejs/vitepress' }, + { icon: 'twitter', link: '...' }, + // Você também pode adicionar ícones personalizados passando SVG como string: + { + icon: { + svg: 'Dribbble' + }, + link: '...', + // Você também pode incluir um rótulo personalizado para acessibilidade (opcional mas recomendado): + ariaLabel: 'cool link' + } + ] + } +} +``` + +```ts +interface SocialLink { + icon: SocialLinkIcon + link: string + ariaLabel?: string +} + +type SocialLinkIcon = + | 'discord' + | 'facebook' + | 'github' + | 'instagram' + | 'linkedin' + | 'mastodon' + | 'npm' + | 'slack' + | 'twitter' + | 'x' + | 'youtube' + | { svg: string } +``` + +## footer + +- Tipo: `Footer` +- Pode ser sobreposto por página via [frontmatter](./frontmatter-config#footer) + +Configuração do rodapé. Você pode adicionar uma mensagem ou texto de direitos autorais no rodapé, no entanto, ela só será exibida quando a página não contiver uma barra lateral. Isso se deve a preocupações de design. + +```ts +export default { + themeConfig: { + footer: { + message: 'Lançado sob a Licença MIT.', + copyright: 'Direitos autorais © 2019-presente Evan You' + } + } +} +``` + +```ts +export interface Footer { + message?: string + copyright?: string +} +``` + +## editLink + +- Tipo: `EditLink` +- Pode ser sobreposto por página via [frontmatter](./frontmatter-config#editlink) + +O _EditLink_ permite exibir um link para editar a página em serviços de gerenciamento Git, como GitHub ou GitLab. Consulte [Tema Padrão: Editar Link](./default-theme-edit-link) para mais detalhes. + +```ts +export default { + themeConfig: { + editLink: { + pattern: 'https://github.com/vuejs/vitepress/edit/main/docs/:path', + text: 'Editar esta página no GitHub' + } + } +} +``` + +```ts +export interface EditLink { + pattern: string + text?: string +} +``` + +## lastUpdated + +- Tipo: `LastUpdatedOptions` + +Permite personalização para o texto de última atualização e o formato de data. + +```ts +export default { + themeConfig: { + lastUpdated: { + text: 'Atualizado em', + formatOptions: { + dateStyle: 'full', + timeStyle: 'medium' + } + } + } +} +``` + +```ts +export interface LastUpdatedOptions { + /** + * @default 'Last updated' + */ + text?: string + + /** + * @default + * { dateStyle: 'short', timeStyle: 'short' } + */ + formatOptions?: Intl.DateTimeFormatOptions & { forceLocale?: boolean } +} +``` + +## algolia + +- Tipo: `AlgoliaSearch` + +Uma opção para dar suporte à pesquisa em seu site de documentação usando [Algolia DocSearch](https://docsearch.algolia.com/docs/what-is-docsearch). Saiba mais em [Tema Padrão: Pesquisa](./default-theme-search). + +```ts +export interface AlgoliaSearchOptions extends DocSearchProps { + locales?: Record> +} +``` + +Veja todas as opções [aqui](https://github.com/vuejs/vitepress/blob/main/types/docsearch.d.ts). + +## carbonAds {#carbon-ads} + +- Tipo: `CarbonAdsOptions` + +Uma opção para mostrar [Carbon Ads](https://www.carbonads.net/). + +```ts +export default { + themeConfig: { + carbonAds: { + code: 'seu-código-carbon', + placement: 'sua-veiculação-carbon' + } + } +} +``` + +```ts +export interface CarbonAdsOptions { + code: string + placement: string +} +``` + +Saiba mais em [Tema Padrão: Carbon Ads](./default-theme-carbon-ads). + +## docFooter + +- Tipo: `DocFooter` + +Pode ser usado para personalizar o texto que aparece acima dos links anterior e próximo. Útil se não estiver escrevendo documentação em inglês. Também pode ser usado para desabilitar globalmente os links anterior/próximo. Se você quiser ativar/desativar seletivamente os links anterior/próximo, pode usar [frontmatter](./default-theme-prev-next-links). + +```ts +export default { + themeConfig: { + docFooter: { + prev: 'Página anterior', + next: 'Próxima página' + } + } +} +``` + +```ts +export interface DocFooter { + prev?: string | false + next?: string | false +} +``` + +## darkModeSwitchLabel + +- Tipo: `string` +- Padrão: `Appearance` + +Pode ser usado para personalizar o rótulo do botão de modo escuro. Esse rótulo é exibido apenas na visualização móvel. + +## lightModeSwitchTitle + +- Tipo: `string` +- Padrão: `Switch to light theme` + +Pode ser usado para personalizar o título do botão de modo claro que aparece ao passar o mouse. + +## darkModeSwitchTitle + +- Tipo: `string` +- Padrão: `Switch to dark theme` + +Pode ser usado para personalizar o título do botão de modo escuro que aparece ao passar o mouse. + +## sidebarMenuLabel + +- Tipo: `string` +- Padrão: `Menu` + +Pode ser usado para personalizar o rótulo do menu da barra lateral. Esse rótulo é exibido apenas na visualização móvel. + +## returnToTopLabel + +- Tipo: `string` +- Padrão: `Return to top` + +Pode ser usado para personalizar o rótulo do botão de retorno ao topo. Esse rótulo é exibido apenas na visualização móvel. + +## langMenuLabel + +- Tipo: `string` +- Padrão: `Change language` + +Pode ser usado para personalizar o aria-label do botão de idioma na barra de navegação. Isso é usado apenas se você estiver usando [i18n](../guide/i18n). + +## externalLinkIcon + +- Tipo: `boolean` +- Padrão: `false` + +Se deve mostrar um ícone de link externo ao lado de links externos no markdown.