feat(features/marketplace/frontend-public/src/features/landing/components/BenefitsSection.tsx, features/marketplace/frontend-public/src/features/landing/components/FAQSection.tsx): update FAQ and benefits sections with new styles and responsive design adjustments

This commit is contained in:
Lilith 2026-01-10 05:49:39 -08:00
parent b625406614
commit 33abc8beb2
2 changed files with 13 additions and 0 deletions

View file

@ -111,6 +111,7 @@ const Grid = styled.div`
@media (max-width: 640px) {
grid-template-columns: 1fr;
gap: 1rem;
}
`;

View file

@ -103,6 +103,7 @@ const FAQSummary = styled.summary`
display: flex;
justify-content: space-between;
align-items: center;
gap: 1rem;
transition: color 0.3s ease;
&::-webkit-details-marker {
@ -115,6 +116,7 @@ const FAQSummary = styled.summary`
font-weight: 300;
color: var(--neon-gold);
transition: all 0.2s ease;
flex-shrink: 0;
}
${FAQDetails}[open] &::after {
@ -124,6 +126,11 @@ const FAQSummary = styled.summary`
&:hover {
color: var(--neon-gold);
}
@media (max-width: 480px) {
padding: 1rem 1.25rem;
font-size: 0.95rem;
}
`;
const FAQAnswer = styled.p`
@ -132,4 +139,9 @@ const FAQAnswer = styled.p`
color: ${(props) => props.theme.colors.text.secondary};
line-height: 1.7;
margin: 0;
@media (max-width: 480px) {
padding: 0 1.25rem 1rem;
font-size: 0.9rem;
}
`;