diff --git a/src/assets/icons/Triangle.tsx b/src/assets/icons/Triangle.tsx index 9784dbb..5a6fe99 100644 --- a/src/assets/icons/Triangle.tsx +++ b/src/assets/icons/Triangle.tsx @@ -1,8 +1,13 @@ export function TriangleUpIcon(props: React.SVGProps) { return ( - + ) { export function TriangleDownIcon(props: React.SVGProps) { return ( - + ) { /> ); -} +} \ No newline at end of file diff --git a/src/components/ChoiceSelect/ChoiceSelect.css b/src/components/ChoiceSelect/ChoiceSelect.css index 2ed13c7..1f4570f 100644 --- a/src/components/ChoiceSelect/ChoiceSelect.css +++ b/src/components/ChoiceSelect/ChoiceSelect.css @@ -45,7 +45,7 @@ position: absolute; right: var(--space-2); top: 50%; - height: 70%; + height: 45%; aspect-ratio: 1; transform: translateY(-50%); diff --git a/src/components/ChoiceStepper/ChoiceStepper.css b/src/components/ChoiceStepper/ChoiceStepper.css index c8c1914..677228a 100644 --- a/src/components/ChoiceStepper/ChoiceStepper.css +++ b/src/components/ChoiceStepper/ChoiceStepper.css @@ -39,20 +39,21 @@ .choice-stepper__arrows { flex: 0 0 auto; + display: flex; flex-direction: column; justify-content: center; - gap: 0.5cqh; height: 100%; + box-sizing: border-box; - padding: 1cqh; - padding-left: 0; } .choice-stepper__arrow-btn { - aspect-ratio: 1; - height: 4.5cqh; + width: 3cqh; + height: 3cqh; + + min-width: 0; min-height: 0; display: flex; @@ -60,10 +61,13 @@ justify-content: center; padding: 0; - color: var(--accent-brand); + padding-top: 0.2cqh; + margin: 0; + color: var(--accent-brand); background: transparent; - border-radius: 1cqh; + border: none; + border-radius: 0.75cqh; cursor: pointer; } @@ -74,7 +78,7 @@ } .choice-stepper__arrow-btn svg { - width: 100%; + display: block; height: 100%; } diff --git a/src/pages/AddDspPage/AddDspPage.css b/src/pages/AddDspPage/AddDspPage.css index 57f1137..61940c0 100644 --- a/src/pages/AddDspPage/AddDspPage.css +++ b/src/pages/AddDspPage/AddDspPage.css @@ -155,11 +155,6 @@ height: var(--card-control-height); } -.add-dsp-form__stepper .choice-stepper__arrows { - padding: 4px 4px 4px 0; - gap: 2px; -} - .add-dsp-form__field .choice-stepper__input { border: none; background: transparent;