1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
|
import DefaultTheme from "vitepress/theme";
import type { Theme } from "vitepress";
import { h } from "vue";
import { useData, withBase } from "vitepress";
import "./custom.css";
// @ts-ignore
import CompilerModal from "./components/CompilerModal.vue";
// @ts-ignore
import HomeFooter from "./components/HomeFooter.vue";
// @ts-ignore
import YueCompiler from "./components/YueCompiler.vue";
// @ts-ignore
import YueDisplay from "./components/YueDisplay.vue";
const theme: Theme = {
extends: DefaultTheme,
Layout: () => {
const { frontmatter } = useData();
return h(DefaultTheme.Layout, null, {
"layout-bottom": () => [h(HomeFooter), h(CompilerModal)],
"home-hero-image": () => {
const fm = frontmatter.value;
if (fm?.hero?.image?.src) {
const img = h("img", {
src: withBase(fm.hero.image.src),
alt: fm.hero.image.alt || "",
class: "VPImage",
style: "max-width: 100%; max-height: 100%; object-fit: contain;",
});
if (fm.hero.image.link) {
return h(
"a",
{
href: withBase(fm.hero.image.link),
class: "image-src",
style:
"display: flex; justify-content: center; align-items: center;",
},
[img],
);
}
return h(
"div",
{
class: "image-src",
style:
"display: flex; justify-content: center; align-items: center;",
},
[img],
);
}
return null;
},
});
},
enhanceApp({ app }) {
app.component("CompilerModal", CompilerModal);
app.component("YueCompiler", YueCompiler);
app.component("YueDisplay", YueDisplay);
},
};
export default theme;
|