msb-public
/
vitepress
mirror of https://github.com/vuejs/vitepress
2
1
Code Issues Projects Releases Wiki Activity

make dir consistent

Browse Source
pull/3353/head
Divyansh Singh 2 years ago
parent cd3bd7a0c2
commit ef8750174b
3 changed files with 5 additions and 17 deletions
Show Stats Download Patch File Download Diff File

2
src/client/app/data.ts
Unescape View File

@ -89,7 +89,7 @@ export function initData(route: Route): VitePressData {
frontmatter: computed(() => route.data.frontmatter), frontmatter: computed(() => route.data.frontmatter),
params: computed(() => route.data.params), params: computed(() => route.data.params),
lang: computed(() => site.value.lang), lang: computed(() => site.value.lang),
dir: computed(() => site.value.dir), dir: computed(() => route.data.frontmatter.dir || site.value.dir || 'ltr'),
localeIndex: computed(() => site.value.localeIndex || 'root'), localeIndex: computed(() => site.value.localeIndex || 'root'),
title: computed(() => { title: computed(() => {
return createTitle(site.value, route.data) return createTitle(site.value, route.data)

14
src/client/theme-default/Layout.vue
Unescape View File

@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { useRoute, inBrowser } from 'vitepress' import { useRoute } from 'vitepress'
import { computed, provide, useSlots, watch } from 'vue' import { computed, provide, useSlots, watch } from 'vue'
import VPBackdrop from './components/VPBackdrop.vue' import VPBackdrop from './components/VPBackdrop.vue'
import VPContent from './components/VPContent.vue' import VPContent from './components/VPContent.vue'
@ -22,22 +22,12 @@ watch(() => route.path, closeSidebar)
useCloseSidebarOnEscape(isSidebarOpen, closeSidebar) useCloseSidebarOnEscape(isSidebarOpen, closeSidebar)
const { frontmatter, dir } = useData() const { frontmatter } = useData()
const slots = useSlots() const slots = useSlots()
const heroImageSlotExists = computed(() => !!slots['home-hero-image']) const heroImageSlotExists = computed(() => !!slots['home-hero-image'])
provide('hero-image-slot-exists', heroImageSlotExists) provide('hero-image-slot-exists', heroImageSlotExists)
watch(() => frontmatter.value.dir, (metaDir) => {
if (!inBrowser) { return }
const pageDir = metaDir || dir.value || 'ltr'
// <html dir>
document.documentElement.dir = pageDir
// <body dir> and <body style="direction">
document.body.dir = pageDir
document.body.style.direction = pageDir
}, { immediate: true })
</script> </script>
<template> <template>

6
src/node/build/render.ts
Unescape View File

@ -148,10 +148,8 @@ export async function renderPage(
} }
} }
const pageDir = pageData.frontmatter.dir || siteData.dir || 'ltr'
const html = `<!DOCTYPE html> const html = `<!DOCTYPE html>
<html lang="${siteData.lang}" dir="${pageDir}"> <html lang="${siteData.lang}" dir="${siteData.dir}">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
${ ${
@ -175,7 +173,7 @@ export async function renderPage(
} }
${await renderHead(head)} ${await renderHead(head)}
</head> </head>
<body dir="${pageDir}" style="direction: ${pageDir}">${teleports?.body || ''} <body>${teleports?.body || ''}
<div id="app">${content}</div> <div id="app">${content}</div>
${metadataScript.inHead ? '' : metadataScript.html} ${metadataScript.inHead ? '' : metadataScript.html}
${inlinedScript} ${inlinedScript}

Write Preview
Loading…
Cancel
Save