scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: make special requests block togglable

Browse Source
This commit is contained in:
Christel Westerberg
2024-12-12 11:42:06 +01:00
parent 4872847ecb
commit a1a36e80d5
6 changed files with 166 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
components/HotelReservation/EnterDetails/SectionAccordion/index.tsx
View File

@@ -67,7 +67,11 @@ export default function SectionAccordion({
const textColor =
isComplete || isOpen ? "uiTextHighContrast" : "baseTextDisabled"
return (
<div className={styles.accordion} data-open={isOpen} data-step={step}>
<div
className={styles.accordion}
data-section-open={isOpen}
data-step={step}
>
<div className={styles.iconWrapper}>
<div className={styles.circle} data-checked={isComplete}>
{isComplete ? (

10
components/HotelReservation/EnterDetails/SectionAccordion/sectionAccordion.module.css
View File

@@ -72,15 +72,15 @@
background-color: var(--UI-Input-Controls-Fill-Selected);
}
.accordion[data-open="true"] .circle[data-checked="false"] {
.accordion[data-section-open="true"] .circle[data-checked="false"] {
background-color: var(--UI-Text-Placeholder);
}
.accordion[data-open="false"] .circle[data-checked="false"] {
.accordion[data-section-open="false"] .circle[data-checked="false"] {
background-color: var(--Base-Surface-Subtle-Hover);
}
.accordion[data-open="true"] {
.accordion[data-section-open="true"] {
grid-template-rows: var(--header-height) 1fr;
}
@@ -97,11 +97,11 @@
transition: opacity 0.2s linear;
}
.accordion[data-open="true"] .content {
.accordion[data-section-open="true"] .content {
opacity: 1;
}
.content:has([data-open="true"]) {
.content:has([data-section-open="true"]) {
overflow: visible;
}