Various design improvements

This commit is contained in:
Martin Prokoph
2024-09-18 14:23:17 +02:00
parent b2e20fa63b
commit b8272c378f
11 changed files with 47 additions and 37 deletions

View File

@@ -9,12 +9,12 @@ const { src = '/motschensummer-cutout.png' } = Astro.props
<div class="grid grid-cols-1 items-center gap-24 lg:grid-cols-2">
<div class="flex flex-col items-center gap-8 md:items-start">
<h1 class="text-center text-6xl md:text-left lg:text-8xl">
<slot><span class="text-gradient">Modding</span> done with passion</slot>
<slot><span class="text-gradient drop-shadow-xl">Modding</span> done with passion</slot>
</h1>
<div class="flex flex-col gap-3 min-[500px]:flex-row">
<a class="button has-icon" href="https://github.com/Motschen">
<Icon name="ion:logo-github" />
Visit GitHub Profile
Visit my GitHub Profile
</a>
<a class="button has-icon color-secondary"
href="wiki/midnightlib">
@@ -28,16 +28,16 @@ const { src = '/motschensummer-cutout.png' } = Astro.props
</div>
</section>
<style lang="scss">
<style>
.text-gradient {
background: linear-gradient(315deg, var(--primary-200) 25%, var(--secondary-500));
background: linear-gradient(315deg, var(--secondary-300) 25%, var(--primary-300));
background-clip: border-box;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
:global(.darkmode .text-gradient) {
background: linear-gradient(315deg, var(--primary-200) 25%, var(--secondary-400));
background: linear-gradient(315deg, var(--secondary-300) 25%, var(--primary-200));
background-clip: border-box;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;