=> !!ref)
+ .map(ref => ref.nativeElement);
+ let active = true;
+ const measure = () => {
+ if (!active) return;
+ this.truncated.set(
+ elements.some(
+ el => el.scrollHeight > el.clientHeight + 1 || el.scrollWidth > el.clientWidth + 1,
+ ),
+ );
+ };
+ measure();
+ const observer = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(measure);
+ elements.forEach(el => observer?.observe(el));
+ void document.fonts?.ready.then(measure);
+ document.fonts?.addEventListener("loadingdone", measure);
+ onCleanup(() => {
+ active = false;
+ observer?.disconnect();
+ document.fonts?.removeEventListener("loadingdone", measure);
+ });
+ });
+ }
+
+ /** Свободная область открывает чтение; нативные вложенные действия сохраняют своё назначение. */
+ protected onCardClick(event: MouseEvent): void {
+ if (
+ event.target instanceof Element &&
+ event.target.closest("a, button, input, textarea, select")
+ )
+ return;
+ this.openModal(event.currentTarget as HTMLElement);
+ }
+
+ /** Enter/Space обрабатываются только на самой карточке, без перехвата клавиш её ссылок и кнопок. */
+ protected onCardKeydown(event: Event): void {
+ if (event.target !== event.currentTarget) return;
+ event.preventDefault();
+ this.openModal(event.currentTarget as HTMLElement);
+ }
+
+ /** Запоминаем реальный trigger для возврата фокуса; новость не копируется и не запрашивается повторно. */
+ protected openModal(trigger: HTMLElement): void {
+ this.trigger = trigger;
+ this.modalOpen.set(true);
+ }
+}
diff --git a/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.html b/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.html
index d346074b9..a15663a3c 100644
--- a/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.html
+++ b/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.html
@@ -1,125 +1,22 @@
@if (feedType() && !editMode) {
-
-
- {{
- feedType() === "people" ? "Новости людей" : "Новости проекта"
- }}
-
-
-
-
- {{ feedText().headline }}
-
-
-
- {{
- feedType() === "people" ? "Перейти в профиль" : "Перейти в проект"
- }}
-
+
} @else {
@if (feedType()) {
diff --git a/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.scss b/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.scss
index fd5013e68..7dc41a241 100644
--- a/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.scss
+++ b/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.scss
@@ -1,4 +1,5 @@
-@use "styles/feed-card";
+/** @format */
+
@use "styles/typography";
@use "styles/responsive";
@@ -250,69 +251,3 @@
}
}
}
-
-// Ограничения применяются только к preview ленты: файлы и изображения не меняют высоту ряда.
-.card--feed {
- @include feed-card.layout;
-
- .feed-card__source-text { flex: 1; }
-
- .card__feed-extras {
- gap: 6px;
- align-items: stretch;
- }
-
- .card__feed-industry { align-self: flex-start; }
-
- .card__feed-media {
- display: flex;
- flex: 1;
- gap: 8px;
- min-height: 0;
- }
-
- app-carousel {
- --carousel-height: 100%;
-
- display: block;
- flex: 1;
- min-width: 0;
- min-height: 0;
- }
-
- .card__feed-files {
- flex: 1;
- min-width: 0;
- padding: 3px;
- margin: 0;
- overflow: hidden auto;
- list-style: none;
-
- a {
- display: block;
- padding: 4px 0;
- overflow: hidden;
- font-size: 11px;
- line-height: 16px;
- color: var(--accent-dark);
- text-overflow: ellipsis;
- white-space: nowrap;
- }
- }
-
- .card__feed-actions {
- flex: 0 0 22px;
- margin-top: auto;
- font-size: 11px;
- }
-
- button {
- padding: 0;
- font: inherit;
- cursor: pointer;
- background: transparent;
- border: 0;
- }
-
- .card__option { padding: 5px 20px; }
-}
diff --git a/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.spec.ts b/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.spec.ts
index 6bb8d1ca2..442539fce 100644
--- a/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.spec.ts
+++ b/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.spec.ts
@@ -79,7 +79,7 @@ describe("NewsCardComponent", () => {
);
});
- it("сохраняет лайк, ссылку на скачивание и полное имя источника в компактной ленте", () => {
+ it("сохраняет лайк, индикатор вложений и полное имя источника в компактной ленте", () => {
const name = "Очень длинное название проекта ".repeat(8);
const news = {
...FeedNews.default(),
@@ -103,10 +103,8 @@ describe("NewsCardComponent", () => {
const emit = vi.spyOn(component.like, "emit");
root.querySelector('button[aria-label="Нравится"]')!.click();
expect(emit).toHaveBeenCalledExactlyOnceWith(news.id);
- expect(root.querySelector(".card__feed-files a")?.getAttribute("href")).toBe("/test.pdf");
- expect(root.querySelector(".card__feed-files a")?.getAttribute("download")).toBe(
- "Тестовый документ.pdf",
- );
+ expect(root.querySelector(".feed-preview__attachments")?.textContent).toContain("1");
+ expect(root.querySelector(".feed-preview a[download]")).toBeNull();
});
it("вне ленты сохраняет обычную карточку и действия владельца", () => {
diff --git a/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.ts b/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.ts
index bd445fbd5..c6345dafe 100644
--- a/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.ts
+++ b/projects/social_platform/src/app/ui/widgets/news-card/news-card.component.ts
@@ -32,6 +32,7 @@ import {
import { FileService } from "@core/lib/services/file/file.service";
import { nanoid } from "nanoid";
import { ClickOutsideModule } from "ng-click-outside";
+import { FeedNewsPreviewComponent } from "./feed-news-preview/feed-news-preview.component";
import { CarouselComponent } from "./carousel/carousel.component";
import { ImgCardComponent } from "@ui/primitives/img-card/img-card.component";
import { FeedNews } from "@domain/news/project-news.model";
@@ -51,6 +52,7 @@ import { IndustryRepositoryPort } from "@domain/industry/ports/industry.reposito
templateUrl: "./news-card.component.html",
styleUrl: "./news-card.component.scss",
imports: [
+ FeedNewsPreviewComponent,
ClickOutsideModule,
RouterLink,
IconComponent,
diff --git a/projects/social_platform/src/styles/_feed-card.scss b/projects/social_platform/src/styles/_feed-card.scss
index fa8e278a3..9ab53c322 100644
--- a/projects/social_platform/src/styles/_feed-card.scss
+++ b/projects/social_platform/src/styles/_feed-card.scss
@@ -1,13 +1,15 @@
-// Общие строки удерживают CTA и заголовки на одном уровне даже при отсутствующих данных.
-// Миксин подключается только карточками ленты; detail/profile сохраняют свою геометрию.
+/** @format */
+
+// Высоту задаёт содержимое самого высокого соседа в строке grid, а не общий media slot.
+// CTA остаётся снизу строки; detail/profile этот миксин не используют.
@mixin layout {
box-sizing: border-box;
- display: grid;
- grid-template-rows: 26px 44px 44px 54px minmax(0, 1fr) 36px;
+ display: flex;
+ flex-direction: column;
gap: 10px;
width: 100%;
min-width: 0;
- height: 420px;
+ height: 100%;
padding: 20px;
color: var(--feed-text, var(--black));
background: var(--feed-background, var(--light-white));
@@ -15,6 +17,7 @@
border-radius: var(--rounded-xl);
> * {
+ flex-shrink: 0;
min-width: 0;
min-height: 0;
}
@@ -30,6 +33,7 @@
gap: 8px;
align-items: center;
justify-content: space-between;
+ min-height: 26px;
}
.feed-card__type {
@@ -61,6 +65,7 @@
display: flex;
gap: 10px;
align-items: center;
+ min-height: 40px;
}
.feed-card__avatar {
@@ -126,6 +131,10 @@
gap: 8px;
align-items: flex-start;
min-width: 0;
+
+ &:empty {
+ display: none;
+ }
}
.feed-card__skills {
@@ -172,6 +181,7 @@
width: 100%;
height: 36px;
padding: 0 12px;
+ margin-top: auto;
font-size: 12px;
font-weight: 600;
line-height: 16px;