adjusted sizing and spacing of body and header text, images, video
This commit is contained in:
@@ -72,46 +72,39 @@
|
||||
<Content>
|
||||
<h1 class="gradient-title"><i>Moin!</i> ~ welcome to my website :)</h1>
|
||||
|
||||
<div class="container">
|
||||
<div class="subcontainer">
|
||||
<Gallery entries={galleryEntries}/>
|
||||
</div>
|
||||
<div class="subcontainer">
|
||||
<div class="quote-marquee-container">
|
||||
{@render marqueeContent({quote: marqueeQuote, ignoreA11y: false})}
|
||||
{@render marqueeContent({quote: marqueeQuote, ignoreA11y: true})}
|
||||
{@render marqueeContent({quote: marqueeQuote, ignoreA11y: true})}
|
||||
</div>
|
||||
|
||||
<h3>about ↬<img id="me-img" class="me-img" title="hi there" src={meImg} alt="Deniz, the website developer, small and pixelated">↫ me </h3>
|
||||
|
||||
<p>Hi! I'm Deniz. I'm a programmer, sometimes a music producer, and student from Northern Germany. Welcome to my webpage!</p>
|
||||
|
||||
<p>I share my projects on this website. Check them out – the devlog of the game I'm working on especially!</p>
|
||||
|
||||
<h3>where to find me</h3>
|
||||
|
||||
<LinkList entries={[
|
||||
{
|
||||
icon: "icons/bluesky.svg",
|
||||
text: "Bluesky",
|
||||
link: "https://bsky.app/profile/denizk0461.dev",
|
||||
},
|
||||
{
|
||||
icon: "icons/codeberg.svg",
|
||||
text: "Codeberg",
|
||||
link: "https://codeberg.org/denizk0461",
|
||||
},
|
||||
{
|
||||
icon: "icons/github.svg",
|
||||
text: "GitHub",
|
||||
link: "https://github.com/denizk0461",
|
||||
},
|
||||
]}/>
|
||||
|
||||
<GamedevWebring />
|
||||
</div>
|
||||
<div class="quote-marquee-container">
|
||||
{@render marqueeContent({quote: marqueeQuote, ignoreA11y: false})}
|
||||
{@render marqueeContent({quote: marqueeQuote, ignoreA11y: true})}
|
||||
{@render marqueeContent({quote: marqueeQuote, ignoreA11y: true})}
|
||||
</div>
|
||||
|
||||
<h3>about ↬<img id="me-img" class="me-img" title="hi there" src={meImg} alt="Deniz, the website developer, small and pixelated">↫ me </h3>
|
||||
|
||||
<p>Hi! I'm Deniz. I'm a programmer, sometimes a music producer, and student from Northern Germany. Welcome to my webpage! I share my projects on this website. Check them out – the devlog of the game I'm working on especially!</p>
|
||||
|
||||
<h3>where to find me</h3>
|
||||
|
||||
<LinkList entries={[
|
||||
{
|
||||
icon: "icons/bluesky.svg",
|
||||
text: "Bluesky",
|
||||
link: "https://bsky.app/profile/denizk0461.dev",
|
||||
},
|
||||
{
|
||||
icon: "icons/codeberg.svg",
|
||||
text: "Codeberg",
|
||||
link: "https://codeberg.org/denizk0461",
|
||||
},
|
||||
{
|
||||
icon: "icons/github.svg",
|
||||
text: "GitHub",
|
||||
link: "https://github.com/denizk0461",
|
||||
},
|
||||
]}/>
|
||||
|
||||
<GamedevWebring />
|
||||
|
||||
<Gallery entries={galleryEntries} />
|
||||
</Content>
|
||||
|
||||
{#snippet marqueeContent({quote, ignoreA11y}: {quote: Quote, ignoreA11y: boolean})}
|
||||
@@ -119,24 +112,17 @@
|
||||
{/snippet}
|
||||
|
||||
<style>
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
}
|
||||
.subcontainer {
|
||||
max-width: 50%;
|
||||
}
|
||||
.subcontainer:last-child {
|
||||
margin-left: 16px;
|
||||
}
|
||||
.me-img {
|
||||
width: 32px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.gradient-title {
|
||||
background: -webkit-linear-gradient(0deg, #96C9DC, #9CE391, #E03E59);
|
||||
background: linear-gradient(
|
||||
90deg,
|
||||
var(--color-highlight) 30%,
|
||||
var(--color-highlight-alt) 90%
|
||||
);
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
@@ -173,18 +159,4 @@
|
||||
transform: translateX( -100% );
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 800px) {
|
||||
.container {
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
|
||||
.subcontainer {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.subcontainer:last-child {
|
||||
margin-left: 0px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user