DTRA / Kate / Refactoring: resetting style (binary-com#154)

* refactor: trading and contract details * fix: reset button style in definition
kate-deriv · Jul 19, 2024 · a641233 · a641233
1 parent b8bc11f
commit a641233
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 4 deletions.
diff --git a/packages/trader/src/AppV2/Components/Guide/guide.scss b/packages/trader/src/AppV2/Components/Guide/guide.scss
@@ -109,6 +109,7 @@
 
     &__content {
         &--definition {
+            all: unset;
             color: var(--core-color-solid-coral-700);
         }
         &--bold {

diff --git a/packages/trader/src/AppV2/Components/RiskManagementItem/risk-management-item.scss b/packages/trader/src/AppV2/Components/RiskManagementItem/risk-management-item.scss
@@ -13,6 +13,10 @@
     &__title {
         display: flex;
         gap: var(--semantic-spacing-gap-md);
+
+        button {
+            all: unset;
+        }
     }
 
     .deal-cancellation-badge {

diff --git a/...der/src/AppV2/Components/TradeParameters/TradeTypeTabs/__tests__/trade-type-tabs.spec.tsx b/...der/src/AppV2/Components/TradeParameters/TradeTypeTabs/__tests__/trade-type-tabs.spec.tsx
@@ -35,6 +35,7 @@ describe('TradeTypeTabs', () => {
 
     it('should render correct tabs name for Vanillas', () => {
         default_mock_store.modules.trade.contract_type = TRADE_TYPES.VANILLA.CALL;
+        default_mock_store.modules.trade.is_vanilla = true;
         render(mockTradeTypeTabs({ is_minimized: true }));
 
         expect(screen.getByText('Call')).toBeInTheDocument();
@@ -45,6 +46,7 @@ describe('TradeTypeTabs', () => {
 
     it('should call onChange function if user clicks on another tab and not call it if he clicks on the already chosen one', () => {
         default_mock_store.modules.trade.contract_type = TRADE_TYPES.TURBOS.LONG;
+        default_mock_store.modules.trade.is_turbos = true;
         render(mockTradeTypeTabs());
 
         const current_tab = screen.getByText('Up');

diff --git a/packages/trader/src/AppV2/Components/TradeParameters/TradeTypeTabs/trade-type-tabs.tsx b/packages/trader/src/AppV2/Components/TradeParameters/TradeTypeTabs/trade-type-tabs.tsx
@@ -3,16 +3,14 @@ import { observer } from 'mobx-react';
 import clsx from 'clsx';
 import { SegmentedControlSingleChoice } from '@deriv-com/quill-ui';
 import { useTraderStore } from 'Stores/useTraderStores';
-import { isTurbosContract, isVanillaContract, TRADE_TYPES } from '@deriv/shared';
+import { TRADE_TYPES } from '@deriv/shared';
 
 type TTradeTypeTabsProps = {
     is_minimized?: boolean;
 };
 
 const TradeTypeTabs = observer(({ is_minimized }: TTradeTypeTabsProps) => {
-    const { contract_type, onChange } = useTraderStore();
-    const is_turbos = isTurbosContract(contract_type);
-    const is_vanilla = isVanillaContract(contract_type);
+    const { contract_type, is_turbos, is_vanilla, onChange } = useTraderStore();
     const tab_list = [
         { label: 'Up', value: TRADE_TYPES.TURBOS.LONG, is_displayed: is_turbos },
         { label: 'Down', value: TRADE_TYPES.TURBOS.SHORT, is_displayed: is_turbos },

diff --git a/packages/trader/src/AppV2/Containers/Trade/trade.scss b/packages/trader/src/AppV2/Containers/Trade/trade.scss
@@ -17,6 +17,10 @@
         min-height: var(--core-spacing-1600);
         white-space: nowrap;
         scrollbar-width: none;
+
+        button {
+            background-color: transparent;
+        }
     }
     &__assets {
         padding: 0 var(--core-spacing-800);