kevisual/astro-simple-template
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UPDATE

Browse Source
This commit is contained in:
熊潇
2025-11-25 19:53:38 +08:00
parent 2c4ed896e8
commit db55d8fd83
6 changed files with 116 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
src/layouts/mdx.astro
View File

@@ -5,29 +5,34 @@ export interface Props {
import '../styles/global.css';
import '../styles/theme.css';
import 'github-markdown-css/github-markdown-light.css';
import { Menu, MenuItem } from '../apps/menu';
export interface Props {
title?: string;
description?: string;
lang?: string;
charset?: string;
showMenu?: boolean;
menu?: MenuItem[];
basename?: string;
}
const { title = 'Light Code', description = 'A lightweight code editor', lang = 'zh-CN', charset = 'UTF-8' } = Astro.props;
const {
title = 'Light Code',
description = 'A lightweight code editor',
lang = 'zh-CN',
charset = 'UTF-8',
showMenu = true,
menu,
basename = '',
} = Astro.props;
---
<html lang='zh-CN'>
<html lang={lang}>
<head>
<meta charset='UTF-8' />
<meta charset={charset} />
<meta name='viewport' content='width=device-width, initial-scale=1.0' />
<title>Docs</title>
<link
rel='stylesheet'
href='https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/5.8.1/github-markdown-light.min.css'
integrity='sha512-X175XRJAO6PHAUi8AA7GP8uUF5Wiv+w9bOi64i02CHKDQBsO1yy0jLSKaUKg/NhRCDYBmOLQCfKaTaXiyZlLrw=='
crossorigin='anonymous'
referrerpolicy='no-referrer'
/>
<title>{title}</title>
<meta name='description' content={description} />
<style>
html,
body {
@@ -37,25 +42,29 @@ const { title = 'Light Code', description = 'A lightweight code editor', lang =
padding: 0;
overflow: hidden;
}
body {
display: flex;
flex-direction: column;
align-items: center;
}
</style>
</head>
<body>
<div>
<body class='flex flex-col items-center bg-background'>
<div class='w-full'>
<slot name='header' />
</div>
<main class='p-2 flex-1 overflow-hidden'>
<div class='markdown-body h-full scrollbar border-gray-200 overflow-auto px-6 py-2 w-[800px] border my-4 rounded-md shadow-md'>
<slot />
<main class='flex-1 flex overflow-hidden w-full max-w-7xl px-4 py-4'>
{
showMenu && (
<aside class='w-64 min-w-64 h-full flex flex-col'>
<Menu items={menu!} client:only basename={basename} />
</aside>
)
}
<div class='flex-1 h-full flex items-start justify-center overflow-hidden'>
<article class='markdown-body h-full scrollbar overflow-auto px-8 py-6 w-full max-w-4xl border border-border rounded-lg shadow-sm bg-card'>
<slot />
</article>
</div>
</main>
<footer>
<footer class='w-full border-t border-border bg-card/50 backdrop-blur-sm'>
<slot name='footer'>
<p>Copyrignt &copy; 2025</p>
<div class='text-center text-sm text-muted-foreground py-4'>Copyright &copy; 2025</div>
</slot>
</footer>
</body>