From 41633476625fca3a28a361f979da06895cea1c67 Mon Sep 17 00:00:00 2001 From: henry-deriv <118344354+henry-deriv@users.noreply.github.com> Date: Fri, 7 Apr 2023 09:26:21 +0800 Subject: [PATCH 1/3] Henry/92021/trade types cant change in responsive (#8160) * fix: make trade types clickable in responsive for digits contracts * fix: keep trade params collapsed initially * fix: merge issues * fix: merge issue solved * fix: Empty-Commit * Revert "henry/92021/fix: make trade types clickable in responsive for digits contracts (#8046)" This reverts commit c1453e40b124bdc0e5c80fb692d3db719cd0e50f. * fix: trade types not switchable for digits contracts in responsive --------- Co-authored-by: Henry Hein --- .../swipeable-wrapper/swipeable-wrapper.scss | 6 ++---- .../swipeable-wrapper/swipeable-wrapper.tsx | 18 ++++-------------- .../src/Modules/Trading/Containers/trade.jsx | 3 --- .../src/Stores/Modules/Trading/trade-store.js | 1 - 4 files changed, 6 insertions(+), 22 deletions(-) diff --git a/packages/components/src/components/swipeable-wrapper/swipeable-wrapper.scss b/packages/components/src/components/swipeable-wrapper/swipeable-wrapper.scss index dc9658c94c30..a485dd011055 100644 --- a/packages/components/src/components/swipeable-wrapper/swipeable-wrapper.scss +++ b/packages/components/src/components/swipeable-wrapper/swipeable-wrapper.scss @@ -25,13 +25,11 @@ position: absolute; bottom: 0; width: 100vw; - z-index: 3; display: flex; padding: 1.6rem 0.8rem; justify-content: space-between; - - &--is-expanded { - bottom: 9.8rem; + svg { + z-index: 3; } } } diff --git a/packages/components/src/components/swipeable-wrapper/swipeable-wrapper.tsx b/packages/components/src/components/swipeable-wrapper/swipeable-wrapper.tsx index 872257c3295c..4497cb97179f 100644 --- a/packages/components/src/components/swipeable-wrapper/swipeable-wrapper.tsx +++ b/packages/components/src/components/swipeable-wrapper/swipeable-wrapper.tsx @@ -1,22 +1,15 @@ +import classNames from 'classnames'; import React from 'react'; import { SwipeableProps, useSwipeable } from 'react-swipeable'; import Icon from '../icon'; -import classNames from 'classnames'; type TSwipeableWrapper = { className?: string; onChange?: (prop?: number) => void; is_disabled?: boolean; - is_trade_params_expanded?: boolean; } & SwipeableProps; -const SwipeableWrapper = ({ - children, - className, - onChange, - is_trade_params_expanded = false, - ...props -}: React.PropsWithChildren) => { +const SwipeableWrapper = ({ children, className, onChange, ...props }: React.PropsWithChildren) => { const [active_index, setActiveIndex] = React.useState(0); React.useEffect(() => { @@ -51,6 +44,7 @@ const SwipeableWrapper = ({ onSwipedRight: swipedRight, ...props, }); + return (
{!props.is_disabled && ( -