/
hey_yo
/
Notebook
Обзор
Документация
Войти
/
hey_yo
/
Notebook
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
master
src/components/UserCard/UserCard.styles.js
27 строк
891 B
mike.r
learn(styled.emotion): стилизация, доработки, структура
06 май 2026, 16:24
06 май 2026, 16:24
146d71e
Код
Авторство
О чём код?
import styled from "@emotion/styled"; export const Card = styled.div` border: 1px solid ${props => props.isOnline ? props.theme.colors.online : props.theme.colors.offline}; border-radius: ${props => props.theme.borderRadius.md}; padding: ${props => props.theme.spacing.md}; background-color: ${props => props.isOnline ? `rgba(46, 204, 113, 0.1)` : `rgba(231, 76, 60, 0.1)`}; transition: transform 0.2s, box-shadow 0.2s; &:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); } `; export const Name = styled.h4` margin: 0 0 ${props => props.theme.spacing.xs} 0; color: ${props => props.theme.colors.text}; `; export const Status = styled.div` font-size: 12px; font-weight: bold; color: ${props => props.isOnline ? props.theme.colors.online : props.theme.colors.offline}; `;