Игорь Надеин
263a7cbe90
- Заменен лишний div.container на стандартный container для единообразия - Заменен класс .card на .ios-card в секции активности для устранения конфликтов стилей - Добавлен card-list.css в base.html для корректного отображения карточек новостей - Добавлены CSS правила для правильного поведения .row и колонок в grid-layout - Исправлена проблема с выходом календаря за границы страницы - Убраны видимые скроллбары у modal-body и modal-content для чистого UI
106 lines
2.3 KiB
CSS
106 lines
2.3 KiB
CSS
/**
|
|
* Feed-Specific Styles (feed-specific.css)
|
|
*
|
|
* Стили, специфичные только для постов в ленте новостей.
|
|
* Эти классы используются только в feed приложении.
|
|
*
|
|
* Использование:
|
|
* <link rel="stylesheet" href="{% static 'css/components/feed-specific.css' %}">
|
|
*/
|
|
|
|
/* ===== Значок закрепления ===== */
|
|
.feed-pin {
|
|
margin-left: auto;
|
|
font-size: 0.75rem;
|
|
padding: var(--space-1, 0.25rem);
|
|
border-radius: 999px;
|
|
background: #fff3cd;
|
|
color: #664d03;
|
|
border: 1px solid #ffe69c;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
[data-bs-theme="dark"] .feed-pin {
|
|
background: #3b2e04;
|
|
color: #ffda6a;
|
|
border-color: #4f3f0a;
|
|
}
|
|
|
|
/* ===== Заголовок поста ===== */
|
|
.feed-title {
|
|
font: 700 1.3rem/1.5 var(--bs-body-font-family);
|
|
margin: var(--space-1, 0.25rem) 0;
|
|
color: #4b4b4b;
|
|
}
|
|
|
|
[data-bs-theme="dark"] .feed-title {
|
|
color: var(--bs-body-color);
|
|
}
|
|
|
|
/* ===== Текст поста ===== */
|
|
.feed-text {
|
|
font-size: 0.95rem;
|
|
line-height: 1.6;
|
|
color: var(--bs-body-color);
|
|
margin: 0;
|
|
}
|
|
|
|
/* ===== Изображение поста ===== */
|
|
.feed-img {
|
|
position: relative;
|
|
border-top: 1px solid var(--bs-border-color);
|
|
background: var(--bs-tertiary-bg);
|
|
}
|
|
|
|
.feed-img img {
|
|
display: block;
|
|
width: 100%;
|
|
height: auto;
|
|
aspect-ratio: 16/9;
|
|
object-fit: cover;
|
|
}
|
|
|
|
/* ===== Кнопки действий (лайки, комментарии) ===== */
|
|
.feed-action {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: var(--space-1, 0.25rem);
|
|
padding: var(--space-1, 0.25rem);
|
|
border-radius: var(--radius-md, 10px);
|
|
background: transparent;
|
|
border: none;
|
|
color: var(--bs-secondary-color);
|
|
font-size: 0.875rem;
|
|
cursor: pointer;
|
|
transition: background 0.2s ease, color 0.2s ease;
|
|
}
|
|
|
|
.feed-action:hover {
|
|
background: var(--bs-tertiary-bg);
|
|
color: var(--bs-body-color);
|
|
}
|
|
|
|
.feed-action.active {
|
|
color: var(--bs-primary);
|
|
font-weight: 600;
|
|
}
|
|
|
|
.feed-action i {
|
|
font-size: 1rem;
|
|
}
|
|
|
|
/* ===== Футер поста ===== */
|
|
.feed-footer {
|
|
padding: var(--space-2, 0.5rem) var(--card-padding, 1rem);
|
|
border-top: 1px solid var(--bs-border-color);
|
|
font-size: 0.875rem;
|
|
color: var(--bs-secondary-color);
|
|
}
|
|
|
|
/* ===== Адаптивность ===== */
|
|
@media (max-width: 576px) {
|
|
.feed-title {
|
|
font-size: 1.1rem;
|
|
}
|
|
}
|