Files
claude-code-router/docs/src/components/HomepageFeatures.module.css
musistudio 160594a8d6 init doc
2025-12-27 07:58:01 +08:00

60 lines
1.1 KiB
CSS

.features {
display: flex;
align-items: center;
padding: 2rem 0;
width: 100%;
}
.featureSvg {
height: 160px;
width: 160px;
transition: transform 0.3s ease;
}
.feature:hover .featureSvg {
transform: scale(1.05);
}
.feature {
padding: 1.5rem;
border-radius: 12px;
background: var(--ifm-background-surface-color);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
height: 100%;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
position: relative;
overflow: hidden;
}
.feature::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 3px;
background: linear-gradient(90deg, var(--ifm-color-primary), var(--ifm-color-primary-dark));
transform: scaleX(0);
transform-origin: left;
transition: transform 0.3s ease;
}
.feature:hover::before {
transform: scaleX(1);
}
.feature:hover {
box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
transform: translateY(-4px);
}
@media (prefers-reduced-motion: reduce) {
.feature,
.featureSvg,
.feature:hover,
.feature:hover .featureSvg {
transition: none;
transform: none;
}
}