diff --git a/src/lib/lists/gallery-row.svelte b/src/lib/lists/link-row.svelte similarity index 68% rename from src/lib/lists/gallery-row.svelte rename to src/lib/lists/link-row.svelte index 29a975e..4709a1f 100644 --- a/src/lib/lists/gallery-row.svelte +++ b/src/lib/lists/link-row.svelte @@ -1,8 +1,9 @@ @@ -23,6 +24,9 @@

> {entry.title}

{@html entry.description}

+ {#if entry.latestUpdate} +

updated: {entry.latestUpdate}

+ {/if}
{/each} @@ -78,6 +82,7 @@ .row-text-container { margin-top: 8px; + margin-bottom: 4px; } .row-title { @@ -90,7 +95,38 @@ .row-description { font-size: 1.0rem; line-height: 1.3rem; - margin: 0 0 4px 0; + margin: 0; + } + + .row-updated, .row-updated-date { + font-size: 0.9rem; + line-height: 1.2rem; + margin: 0; + font-style: italic; + width: fit-content; + transition: color var(--duration-animation) var(--anim-curve), + background-color var(--duration-animation) var(--anim-curve); + } + + .row-updated { + margin-top: 2px; + padding: 4px 8px; + font-weight: 500; + background-color: var(--color-background-highlight); + border-radius: var(--border-radius); + } + + .row-entry:hover .row-updated { + color: var(--color-text-dark); + background-color: var(--color-highlight); + } + + .row-updated-date { + font-weight: 600; + } + + .row-entry:hover .row-updated-date { + color: var(--color-text-dark); } @media screen and (max-width: 600px) { diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index bdf069c..41d27fc 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -1,6 +1,6 @@