/
DevDenzo
/
DigitalStore
Обзор
Документация
Войти
/
DevDenzo
/
DigitalStore
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
master
src/components/Catalog/CatalogCard.css
89 строк
2 KB
Denis Sklyarskij
последние доработки перед релизом
28 ноя 2025, 18:43
28 ноя 2025, 18:43
6bdaafb
Код
Авторство
О чём код?
.catalog-card { display: flex; flex-direction: column; border-radius: 8px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); } .catalog-card__image { width: 100%; height: auto; border-radius: 8px; } .catalog-card__body { display: flex; flex-direction: column; gap: 12px; padding: 12px; } .catalog-card__title { font-size: 14px; font-weight: 600; color: #6c757d; max-width: 365px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-transform: capitalize; } .catalog-card__text { font-size: 18px; color: #cc4c4c; font-weight: 600; } .catalog-card__actions { display: flex; gap: 6px; } .catalog-card__button { display: inline-block; width: 50%; padding: 12px 24px; border: 0; font-size: 14px; font-weight: 600; text-decoration: none; background-color: #cc4c4c; color: #ffffff; text-align: center; border-radius: 8px; cursor: pointer; transition: background-color 0.3s ease-in-out; } .catalog-card__button--added { background-color: #e0e0e0; color: #212529; } .catalog-card__button--small { width: 42px; height: 42px; padding: 6px 12px; } .catalog-card__button:hover { background-color: #a83d3d; } .catalog-card__button--added:hover { background-color: #b3b3b3; } .catalog-card__button:focus-visible { outline: none; } /* Адаптируем под мобильные устройства и планшеты */ @media (max-width: 768px) { .catalog-card__button { width: 100%; font-size: 16px; padding: 10px; } }