fix: reorder universe card content and update truncation logic
- Move embeds to display before text content in UniversePostCard - Show full content for non-essay posts (no truncation) - Increase essay truncation limit from 150 to 300 characters - Add styles to hide duplicate embeds in rendered content 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
2bbc306762
commit
ae15e7978c
1 changed files with 51 additions and 8 deletions
|
|
@ -1,6 +1,6 @@
|
|||
<script lang="ts">
|
||||
import UniverseCard from './UniverseCard.svelte'
|
||||
import { getContentExcerpt } from '$lib/utils/content'
|
||||
import { getContentExcerpt, renderEdraContent } from '$lib/utils/content'
|
||||
import { extractEmbeds } from '$lib/utils/extractEmbeds'
|
||||
import type { UniverseItem } from '../../routes/api/universe/+server'
|
||||
|
||||
|
|
@ -38,12 +38,6 @@
|
|||
</h2>
|
||||
{/if}
|
||||
|
||||
{#if post.content}
|
||||
<div class="post-excerpt">
|
||||
<p>{getContentExcerpt(post.content, 150)}</p>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{#if firstEmbed}
|
||||
<div class="embed-preview">
|
||||
{#if firstEmbed.type === 'youtube' && firstEmbed.videoId}
|
||||
|
|
@ -84,7 +78,17 @@
|
|||
</div>
|
||||
{/if}
|
||||
|
||||
{#if post.postType === 'essay' && isContentTruncated}
|
||||
{#if post.content}
|
||||
<div class="post-excerpt">
|
||||
{#if post.postType === 'essay'}
|
||||
<p>{getContentExcerpt(post.content, 300)}</p>
|
||||
{:else}
|
||||
{@html renderEdraContent(post.content)}
|
||||
{/if}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{#if post.postType === 'essay' && isContentTruncated()}
|
||||
<p>
|
||||
<a href="/universe/{post.slug}" class="read-more" tabindex="-1">Continue reading</a>
|
||||
</p>
|
||||
|
|
@ -146,11 +150,50 @@
|
|||
color: $grey-10;
|
||||
font-size: 1rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
// Only apply truncation for essay excerpts
|
||||
p:only-child {
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
// Styles for full content (non-essays)
|
||||
:global(p) {
|
||||
margin: 0 0 $unit-2x;
|
||||
color: $grey-10;
|
||||
font-size: 1rem;
|
||||
line-height: 1.5;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
:global(a) {
|
||||
color: $red-60;
|
||||
text-decoration: none;
|
||||
transition: all 0.2s ease;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
:global(strong) {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
:global(em) {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
// Hide embeds in the rendered content since we show them separately
|
||||
:global(.url-embed-rendered) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.attachments {
|
||||
|
|
|
|||
Loading…
Reference in a new issue