migrate to astro #1
6 changed files with 67 additions and 14 deletions
|
@ -10,6 +10,7 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"7.css": "^0.16.0",
|
||||
"@astrojs/node": "^8.3.2",
|
||||
"astro": "^4.12.2"
|
||||
}
|
||||
|
|
|
@ -8,6 +8,9 @@ importers:
|
|||
|
||||
.:
|
||||
dependencies:
|
||||
7.css:
|
||||
specifier: ^0.16.0
|
||||
version: 0.16.0
|
||||
'@astrojs/node':
|
||||
specifier: ^8.3.2
|
||||
version: 8.3.2(astro@4.12.2)
|
||||
|
@ -17,6 +20,9 @@ importers:
|
|||
|
||||
packages:
|
||||
|
||||
7.css@0.16.0:
|
||||
resolution: {integrity: sha512-qZleAhXgVqtAc8Wb4mAJRczbGBcUMv6i2wNogXzHgf9Dztky0CqrehWOJtzU05tMw9a9xLeyvumnJeD+WjLiNQ==}
|
||||
|
||||
'@ampproject/remapping@2.3.0':
|
||||
resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==}
|
||||
engines: {node: '>=6.0.0'}
|
||||
|
@ -1693,6 +1699,8 @@ packages:
|
|||
|
||||
snapshots:
|
||||
|
||||
7.css@0.16.0: {}
|
||||
|
||||
'@ampproject/remapping@2.3.0':
|
||||
dependencies:
|
||||
'@jridgewell/gen-mapping': 0.3.5
|
||||
|
|
26
src/components/Window.astro
Normal file
26
src/components/Window.astro
Normal file
|
@ -0,0 +1,26 @@
|
|||
---
|
||||
const {title, showClose, maxWidth} = Astro.props
|
||||
---
|
||||
|
||||
<style define:vars={{ maxWidth }}>
|
||||
#window {
|
||||
max-width: var(--maxWidth);
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="background" id="window">
|
||||
<div class="window glass active" style="max-width: 100%">
|
||||
<div class="title-bar">
|
||||
<div class="title-bar-text">{title}</div>
|
||||
{
|
||||
showClose &&
|
||||
<div class="title-bar-controls">
|
||||
<button aria-label="Close"></button>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="window-body has-space">
|
||||
<slot />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
5
src/css/style.css
Normal file
5
src/css/style.css
Normal file
|
@ -0,0 +1,5 @@
|
|||
body {
|
||||
background-color: #56a0d1;
|
||||
padding: 30px;
|
||||
font-family: sans-serif !important;
|
||||
}
|
19
src/layouts/BaseLayout.astro
Normal file
19
src/layouts/BaseLayout.astro
Normal file
|
@ -0,0 +1,19 @@
|
|||
---
|
||||
import "7.css/dist/7.css";
|
||||
import "../css/style.css";
|
||||
|
||||
const {tabTitle} = Astro.props;
|
||||
---
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<title>{tabTitle}</title>
|
||||
</head>
|
||||
<body>
|
||||
<slot />
|
||||
</body>
|
||||
</html>
|
|
@ -1,16 +1,10 @@
|
|||
---
|
||||
import Window from "../components/Window.astro";
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
---
|
||||
|
||||
---
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<title>Astro</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Astro</h1>
|
||||
</body>
|
||||
</html>
|
||||
<BaseLayout tabTitle="Home - nin0dev">
|
||||
<Window title="Home" maxWidth="600px">
|
||||
<p>I love astro</p>
|
||||
</Window>
|
||||
</BaseLayout>
|
||||
|
|
Loading…
Reference in a new issue