nin0/website
1
0
Fork 3
Code Pull requests Packages 1 Activity

made window

Browse source
This commit is contained in:
nin0 2024-07-29 13:10:58 -04:00
parent 2e77b84df3
commit f9b8428d2b
6 changed files with 67 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

26
src/components/Window.astro Normal file
View 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
View file

@ -0,0 +1,5 @@
body {
background-color: #56a0d1;
padding: 30px;
font-family: sans-serif !important;
}

19
src/layouts/BaseLayout.astro Normal file
View 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>

22
src/pages/index.astro
View file

@ -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>