added some shadowing to the wip

This commit is contained in:
Yannik
2023-05-20 17:47:59 +02:00
parent bc881fd129
commit 8bf6e2814b
3 changed files with 22 additions and 6 deletions

View File

@@ -1,5 +1,6 @@
--- ---
let { title } = Astro.props; let { title } = Astro.props;
import "../styles/global.scss"
--- ---
<html lang="en"> <html lang="en">
@@ -10,5 +11,9 @@ let { title } = Astro.props;
<meta name="generator" content={Astro.generator} /> <meta name="generator" content={Astro.generator} />
<title>{title}</title> <title>{title}</title>
</head> </head>
<body><slot /></body> <body>
<div class="page">
<slot />
</div>
</body>
</html> </html>

View File

@@ -1,6 +1,5 @@
--- ---
import Base from "../layouts/Base.astro"; import Base from "../layouts/Base.astro";
import "../styles/global.scss";
--- ---
<Base title="Work in progress"> <Base title="Work in progress">
@@ -9,9 +8,9 @@ import "../styles/global.scss";
<p> <p>
Hey👋,<br> Hey👋,<br>
<br> <br>
this is my personal website wich gets a rewrite rignt now. <br> this is my personal website wich gets a rewrite rignt now.<br>
My name is Yannik aka vaporvee and I'm 19 years old. My name is Yannik aka vaporvee and I'm 19 years old.<br>
In my freetime i'm a gamedev and i code in C++, Godot Engine's GDScript and C#. In my freetime i'm a gamedev and i code in C++, Godot Engine's GDScript and C#.<br>
If you want to see the progress on this website visit <a href="https://github.com/vaporvee/web">github.com/vaporvee/web</a> If you want to see the progress on this website visit <a href="https://github.com/vaporvee/web">github.com/vaporvee/web</a>
</p> </p>
</div> </div>

View File

@@ -4,6 +4,15 @@ body {
font-family: system-ui, sans-serif; font-family: system-ui, sans-serif;
background-color: #0a0a0a; background-color: #0a0a0a;
} }
.page{
margin: -10px;
width: 100%;
height: 100%;
box-shadow:
inset 60px 0 120px rgba($primary-color, 0.2),
inset -60px 0 120px rgba($accent-color, 0.07);
position: absolute;
}
.wip-title { .wip-title {
margin-top: 100px; margin-top: 100px;
@@ -23,9 +32,12 @@ body {
.card { .card {
position: absolute; position: absolute;
background-color: #1d1d1d; background-color: #1d1d1d;
border-style: solid;
border-color: #2d2d2d;
border-width: 1px;
color: white; color: white;
padding: 35px; padding: 35px;
width: 50%; width: 45%;
margin:0; margin:0;
top: 50%; top: 50%;
left: 50%; left: 50%;