added dates to projects

This commit is contained in:
2025-08-16 21:40:51 +02:00
parent 71cb69a290
commit 9e023291ae
5 changed files with 54 additions and 30 deletions

View File

@@ -194,6 +194,7 @@
a:link {
color: var(--color-link-unvisited);
text-decoration-style: dashed;
}
/* visited link */
a:visited {
@@ -248,6 +249,7 @@
.project-banner {
margin: 0; /* reset left/right margins */
width: 100%;
}
.project-icon {
@@ -259,19 +261,23 @@
.project-date {
font-size: 1rem;
font-weight: 700;
position: absolute;
left: 0;
bottom: 0;
line-height: 1rem;
width: fit-content;
margin: 0;
padding: 0;
line-height: 1rem;
color: var(--color-text-dark);
background-color: var(--color-highlight);
font-family: 'Space Mono', monospace;
padding: 4px;
}
.project-date-embed {
position: absolute;
left: 0;
bottom: 0;
}
.pixelated-img {
image-rendering: pixelated;
}

View File

@@ -44,7 +44,7 @@
<div class="project-banner-container">
<img class="project-banner" src="{game.banner}">
{#if game.date}
<p class="project-date">{game.date}</p>
<p class="project-date project-date-embed">{game.date}</p>
{/if}
</div>
{/if}

View File

@@ -52,7 +52,16 @@
<p class="project-subtitle">» {project.subtitle}</p>
{/if}
{#if project.banner}
<img class="project-banner" src="{project.banner}">
<div class="project-banner-container">
<img class="project-banner" src="{project.banner}">
{#if project.date}
<p class="project-date project-date-embed">{project.date}</p>
{/if}
</div>
{:else}
{#if project.date}
<p class="project-date">{project.date}</p>
{/if}
{/if}
{#if project.icon}
<img class="project-icon" src="{project.icon}">