diff --git a/src/components/FAQ.astro b/src/components/FAQ.astro index c5df346..94b07ae 100644 --- a/src/components/FAQ.astro +++ b/src/components/FAQ.astro @@ -127,9 +127,9 @@ const faqsCol2 = faqs.slice(split); .faq-content { display: flex; gap: 32px; - width: 100%; + width: 62rem; align-items: flex-start; - padding: 0 15%; + margin: 0 auto; } .faq-container { display: flex; diff --git a/src/components/FAQDropdown/index.tsx b/src/components/FAQDropdown/index.tsx index 4103cff..534d687 100644 --- a/src/components/FAQDropdown/index.tsx +++ b/src/components/FAQDropdown/index.tsx @@ -46,13 +46,19 @@ const FAQDropdown = ({ question, defaultOpen }: FAQDropdownProps) => { ); }; + const handleKeyDown = (e: React.KeyboardEvent) => { + if (e.key === 'Enter') { + handleToggle(); + } + }; + return (
handleKeyDown(e)} >
{isOpen ? '-' : '+'}
{label} diff --git a/src/components/FAQDropdown/style.module.scss b/src/components/FAQDropdown/style.module.scss index 426abef..50f0dd7 100644 --- a/src/components/FAQDropdown/style.module.scss +++ b/src/components/FAQDropdown/style.module.scss @@ -18,6 +18,8 @@ .statusIcon { font-size: 1.5rem; text-align: center; + user-select: none; + width: 1rem; } b { @@ -27,7 +29,7 @@ .content { display: flex; - margin-left: 2.5rem; + margin-left: 2.75rem; p { font-style: normal;