redi/astro_avtourist
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Новые изменения в компоенты

Browse source
This commit is contained in:
Web-serfer 2026-04-28 01:58:37 +05:00
parent 60f0009ae2
commit 38bf5d7dcf
6 changed files with 218 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

56
frontend/src/components/blog/RelatedPosts.astro
View file

@ -22,11 +22,11 @@ interface Props {
const { posts, currentSlug } = Astro.props;
const formatDate = (date: string) => {
return new Date(date).toLocaleDateString('ru-RU', {
day: 'numeric',
month: 'long',
year: 'numeric'
});
const d = new Date(date);
const day = d.getDate().toString().padStart(2, '0');
const month = (d.getMonth() + 1).toString().padStart(2, '0');
const year = new Date().getFullYear().toString().slice(-2);
return `${day}/${month}/${year}`;
};
const filteredPosts = currentSlug
@ -50,8 +50,22 @@ const filteredPosts = currentSlug
<h3 class="card-title">{post.title}</h3>
<p class="card-description">{post.description}</p>
<div class="card-meta">
<span class="meta-item">{formatDate(post.date)}</span>
<span class="meta-item">{post.readTime} мин.</span>
<span class="meta-item">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="meta-icon">
<rect width="18" height="18" x="3" y="4" rx="2" ry="2"></rect>
<line x1="16" x2="16" y1="2" y2="6"></line>
<line x1="8" x2="8" y1="2" y2="6"></line>
<line x1="3" x2="21" y1="10" y2="10"></line>
</svg>
{formatDate(post.date)}
</span>
<span class="meta-item">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="meta-icon">
<circle cx="12" cy="12" r="10"></circle>
<polyline points="12 6 12 12 16 14"></polyline>
</svg>
{post.readmeTime || post.readTime} мин.
</span>
</div>
</div>
</a>
@ -136,12 +150,23 @@ const filteredPosts = currentSlug
position: absolute;
top: 1rem;
left: 1rem;
padding: 0.25rem 0.75rem;
padding: 0.35rem 0.85rem;
border-radius: 0.5rem;
font-size: 0.75rem;
font-size: 0.7rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
color: #fff;
}
.category-badge.bg-red { background: linear-gradient(135deg, #ef4444, #dc2626); }
.category-badge.bg-blue { background: linear-gradient(135deg, #3b82f6, #2563eb); }
.category-badge.bg-green { background: linear-gradient(135deg, #22c55e, #16a34a); }
.category-badge.bg-yellow { background: linear-gradient(135deg, #eab308, #ca8a04); color: #1e293b; }
.category-badge.bg-purple { background: linear-gradient(135deg, #a855f7, #9333ea); }
.category-badge.bg-orange { background: linear-gradient(135deg, #f97316, #ea580c); }
.category-badge.bg-gold { background: linear-gradient(135deg, #d4af37, #b8962e); }
.blog-card-wrapper .card-content {
padding: 1.25rem;
}
@ -165,11 +190,24 @@ const filteredPosts = currentSlug
.blog-card-wrapper .card-meta {
display: flex;
justify-content: space-between;
gap: 1rem;
font-size: 0.75rem;
color: #94a3b8;
}
.blog-card-wrapper .card-meta .meta-item {
display: flex;
align-items: center;
gap: 0.35rem;
}
.blog-card-wrapper .card-meta .meta-icon {
width: 14px;
height: 14px;
opacity: 0.7;
}
@media (max-width: 1024px) {
.related-grid {
grid-template-columns: repeat(2, 1fr);

4
frontend/src/pages/blog/[slug].astro
View file

@ -82,14 +82,12 @@ const heroImage = getPostImageUrl(post);
<div class="post-content" set:html={contentHtml} />
</article>
<!-- Комментарии и похожие статьи - ВНЕ article -->
{/*
<!-- Комментарии и похожие статьи -->
<div class="comments-wrapper">
<Comments postSlug={post.slug} client:load />
</div>
<RelatedPosts posts={filteredRelated} currentSlug={slug} />
*/}
<!-- Оглавление -->
<div slot="sidebar">

10
frontend/src/pages/blog/index.astro
View file

@ -15,11 +15,11 @@ const { posts, total, totalPages } = await getPosts({ page: currentPage, perPage
const categories = await getAllCategories();
const formatDate = (date: string) => {
return new Date(date).toLocaleDateString('ru-RU', {
day: 'numeric',
month: 'long',
year: 'numeric'
});
const d = new Date(date);
const day = d.getDate().toString().padStart(2, '0');
const month = (d.getMonth() + 1).toString().padStart(2, '0');
const year = new Date().getFullYear().toString().slice(-2);
return `${day}/${month}/${year}`;
};
---

10
frontend/src/pages/blog/page/[page].astro
View file

@ -18,11 +18,11 @@ const { posts, total, totalPages } = await getPosts({ page: currentPage, perPage
const categories = await getAllCategories();
const formatDate = (date: string) => {
return new Date(date).toLocaleDateString('ru-RU', {
day: 'numeric',
month: 'long',
year: 'numeric'
});
const d = new Date(date);
const day = d.getDate().toString().padStart(2, '0');
const month = (d.getMonth() + 1).toString().padStart(2, '0');
const year = new Date().getFullYear().toString().slice(-2);
return `${day}/${month}/${year}`;
};
---

10
frontend/src/pages/blog/search.astro
View file

@ -19,11 +19,11 @@ const breadcrumbsItems = [
];
const formatDate = (date: string) => {
return new Date(date).toLocaleDateString('ru-RU', {
day: 'numeric',
month: 'long',
year: 'numeric'
});
const d = new Date(date);
const day = d.getDate().toString().padStart(2, '0');
const month = (d.getMonth() + 1).toString().padStart(2, '0');
const year = new Date().getFullYear().toString().slice(-2);
return `${day}/${month}/${year}`;
};
---