From f77339d0af78730dfe74f57c7f0593cbca4a6f9a Mon Sep 17 00:00:00 2001 From: kate-deriv Date: Fri, 8 Nov 2024 13:38:32 +0300 Subject: [PATCH 1/7] refactor: dark theme colors --- chart_app/lib/main.dart | 3 +- chart_app/lib/src/models/chart_config.dart | 3 +- .../src/models/chart_default_dark_theme.dart | 44 +++++ sass/_themes.scss | 157 +++++++++--------- sass/components/_barrier.scss | 9 +- src/components/Barrier.tsx | 4 +- 6 files changed, 132 insertions(+), 88 deletions(-) create mode 100644 chart_app/lib/src/models/chart_default_dark_theme.dart diff --git a/chart_app/lib/main.dart b/chart_app/lib/main.dart index 9470114775..4c2a73da39 100644 --- a/chart_app/lib/main.dart +++ b/chart_app/lib/main.dart @@ -1,6 +1,7 @@ import 'dart:async'; import 'package:chart_app/deriv_chart_wrapper.dart'; import 'package:chart_app/src/chart_app.dart'; +import 'package:chart_app/src/helpers/color.dart'; import 'package:chart_app/src/misc/no_navigation_strategy.dart'; import 'package:chart_app/src/models/drawing_tool.dart'; import 'package:chart_app/src/models/indicators.dart'; @@ -112,7 +113,7 @@ class _DerivChartWebAdapterState extends State<_DerivChartWebAdapter> { return Container( color: configModel.theme is ChartDefaultLightTheme ? Colors.white - : Colors.black, + : getColorFromString('rgba(24, 28, 37, 1)'), constraints: const BoxConstraints.expand(), ); } diff --git a/chart_app/lib/src/models/chart_config.dart b/chart_app/lib/src/models/chart_config.dart index 834499a637..bda48f34ad 100644 --- a/chart_app/lib/src/models/chart_config.dart +++ b/chart_app/lib/src/models/chart_config.dart @@ -1,9 +1,10 @@ import 'package:chart_app/src/helpers/color.dart'; import 'package:chart_app/src/markers/marker_group.dart'; import 'package:chart_app/src/markers/web_marker.dart'; -import 'package:deriv_chart/deriv_chart.dart'; +import 'package:deriv_chart/deriv_chart.dart' hide ChartDefaultDarkTheme; import 'package:flutter/material.dart'; import 'package:chart_app/src/interop/js_interop.dart'; +import './chart_default_dark_theme.dart'; /// State and methods of chart web adapter config. class ChartConfigModel extends ChangeNotifier { diff --git a/chart_app/lib/src/models/chart_default_dark_theme.dart b/chart_app/lib/src/models/chart_default_dark_theme.dart new file mode 100644 index 0000000000..1f54f8583d --- /dev/null +++ b/chart_app/lib/src/models/chart_default_dark_theme.dart @@ -0,0 +1,44 @@ +import 'package:deriv_chart/src/theme/text_styles.dart'; +import 'package:flutter/material.dart'; +import 'package:deriv_chart/deriv_chart.dart'; +import '../helpers/color.dart'; + +/// An implementation of [ChartDefaultTheme] which provides access to +/// dark theme-related colors and styles for the chart package. +class ChartDefaultDarkTheme extends ChartDefaultTheme { + @override + Color get accentRedColor => Color(0xFFCC2E3D); + + @override + Color get accentGreenColor => Color(0xFF00A79E); + + @override + Color get accentYellowColor => Color(0xFFFFAD3A); + + @override + Color get base01Color => Color(0xFFFFFFFF); + + @override + Color get base02Color => Color(0xFFEAECED); + + @override + Color get base03Color => Color(0xFFC2C2C2); + + @override + Color get base04Color => Color(0xFF6E6E6E); + + @override + Color get base05Color => Color(0xFF3E3E3E); + + @override + Color get base06Color => Color(0xFF323738); + + @override + Color get base07Color => getColorFromString('rgba(255, 255, 255, 0.04)'); + + @override + Color get base08Color => getColorFromString('rgba(24, 28, 37, 1)'); + + @override + TextStyle get overLine => TextStyles.overLine; +} diff --git a/sass/_themes.scss b/sass/_themes.scss index f1887307e9..74ad66f324 100644 --- a/sass/_themes.scss +++ b/sass/_themes.scss @@ -1,25 +1,25 @@ /* stylelint-disable color-no-hex */ /* stylelint-disable value-keyword-case */ // Colours based on Zeplin style guide 28march 2019 -$COLOR_WHITE : #ffffff; -$COLOR_BLACK : #000000; -$COLOR_ORANGE : #ff9933; -$COLOR_SKY_BLUE : #2196f3; -$COLOR_GREEN_2 : #2d9f93; -$COLOR_PURPLE : #4f60ae; -$COLOR_DARK_BLUE_1 : #0b0e18; -$COLOR_DARK_BLUE_2 : #101320; -$COLOR_DARK_BLUE_3 : #191c31; -$COLOR_DARK_BLUE_4 : #202641; -$COLOR_DARK_BLUE_5 : #2a3052; /* Brand Blue */ -$COLOR_DARK_GRAY_1 : #282a37; -$COLOR_DARK_GRAY_2 : #303342; -$COLOR_DARK_GRAY_3 : #555975; -$COLOR_LIGHT_GRAY : #7f8397; +$COLOR_WHITE: #ffffff; +$COLOR_BLACK: #000000; +$COLOR_ORANGE: #ff9933; +$COLOR_SKY_BLUE: #2196f3; +$COLOR_GREEN_2: #2d9f93; +$COLOR_PURPLE: #4f60ae; +$COLOR_DARK_BLUE_1: #0b0e18; +$COLOR_DARK_BLUE_2: #101320; +$COLOR_DARK_BLUE_3: #191c31; +$COLOR_DARK_BLUE_4: #202641; +$COLOR_DARK_BLUE_5: #2a3052; /* Brand Blue */ +$COLOR_DARK_GRAY_1: #282a37; +$COLOR_DARK_GRAY_2: #303342; +$COLOR_DARK_GRAY_3: #555975; +$COLOR_LIGHT_GRAY: #7f8397; $COLOR_LIGHT_GRAY_30: rgba($COLOR_LIGHT_GRAY, 0.3); -$COLOR_LIGHT_GRAY_1 : #999cac; -$COLOR_LIGHT_GRAY_2 : rgba($COLOR_LIGHT_GRAY_1, 0.32); -$COLOR_LIGHT_GRAY_3 : rgb(250, 250, 251); +$COLOR_LIGHT_GRAY_1: #999cac; +$COLOR_LIGHT_GRAY_2: rgba($COLOR_LIGHT_GRAY_1, 0.32); +$COLOR_LIGHT_GRAY_3: rgb(250, 250, 251); $COLOR_LIGHT_BLACK_1: rgba($COLOR_BLACK, 0.8); $COLOR_LIGHT_BLACK_1_40: rgba($COLOR_BLACK, 0.4); $COLOR_LIGHT_BLACK_3: rgba($COLOR_BLACK, 0.16); @@ -32,13 +32,13 @@ $COLOR_LIGHT_BLACK_6: rgba($COLOR_BLACK, 0.15); //Legacy Colours. TODO: Check with design team, replace and remove these colours //Legacy Colours. TODO: Check with design team, replace and remove these colours -$COLOR_YELLOW : #fef1cf; -$COLOR_LIGHT_BLACK : #5c5c5c; +$COLOR_YELLOW: #fef1cf; +$COLOR_LIGHT_BLACK: #5c5c5c; $COLOR_BRANDBLUE_40: #aaacba; $COLOR_BRANDBLUE_95: #353b5b; $COLOR_BRANDBLUE_85: #4a4f6c; $COLOR_BRANDBLUE_75: #60647e; -$COLOR_DARK_BLUE_8 : rgba(127, 131, 151, 0.3); +$COLOR_DARK_BLUE_8: rgba(127, 131, 151, 0.3); $COLOR_GREEN: #85acb0; $COLOR_GREEN_1: #4bb4b3; @@ -49,7 +49,7 @@ $COLOR_GREEN_1: #4bb4b3; ***************************** \*****************************/ -$color-black: #0e0e0e; +$color-black: #181c25; $color-black-1: #333333; $color-black-3: #151717; $color-black-4: #1d1f20; @@ -92,63 +92,63 @@ $color-blue: #377cfc; /* Preserve legacy variables */ /* Primary */ -$COLOR_BLACK : #000000; -$COLOR_BLACK_2 : #1d1f20; -$COLOR_BLACK_3 : #0e0e0e; -$COLOR_GREEN_1 : #39b19d; -$COLOR_GREEN_2 : #2d9f93; -$COLOR_GREEN_3 : #21ce99; -$COLOR_GREEN_4 : #00a79e; -$COLOR_GREEN_5 : #4bb4b3; -$COLOR_ORANGE : #ff9933; +$COLOR_BLACK: #000000; +$COLOR_BLACK_2: #1d1f20; +$COLOR_BLACK_3: #0e0e0e; +$COLOR_GREEN_1: #39b19d; +$COLOR_GREEN_2: #2d9f93; +$COLOR_GREEN_3: #21ce99; +$COLOR_GREEN_4: #00a79e; +$COLOR_GREEN_5: #4bb4b3; +$COLOR_ORANGE: #ff9933; $COLOR_DARK_ORANGE: #ff8802; -$COLOR_PURPLE : #4f60ae; -$COLOR_RED : #e31c4b; -$COLOR_RED_2 : #cc2e3d; -$COLOR_RED_3 : #ec3f3f; -$COLOR_CORAL_RED : #ff444f; -$COLOR_SKY_BLUE : #2196f3; -$COLOR_WHITE : #ffffff; -$COLOR_BLUE : #1c5ae3; +$COLOR_PURPLE: #4f60ae; +$COLOR_RED: #e31c4b; +$COLOR_RED_2: #cc2e3d; +$COLOR_RED_3: #ec3f3f; +$COLOR_CORAL_RED: #ff444f; +$COLOR_SKY_BLUE: #2196f3; +$COLOR_WHITE: #ffffff; +$COLOR_BLUE: #1c5ae3; // Light theme -$COLOR_LIGHT_BLACK_1 : rgba(0, 0, 0, 0.8); -$COLOR_LIGHT_BLACK_2 : rgba(0, 0, 0, 0.4); -$COLOR_LIGHT_BLACK_3 : rgba(0, 0, 0, 0.16); +$COLOR_LIGHT_BLACK_1: rgba(0, 0, 0, 0.8); +$COLOR_LIGHT_BLACK_2: rgba(0, 0, 0, 0.4); +$COLOR_LIGHT_BLACK_3: rgba(0, 0, 0, 0.16); $COLOR_LIGHT_BLACK_3_SOLID_1: #d6d6d6; $COLOR_LIGHT_BLACK_3_SOLID_2: #b3b3b3; -$COLOR_LIGHT_BLACK_4 : rgba(0, 0, 0, 0.04); -$COLOR_LIGHT_BLACK_4_SOLID : #f4f4f6; -$COLOR_LIGHT_GRAY_1 : #999cac; -$COLOR_LIGHT_GRAY_2 : rgba(153, 156, 172, 0.32); -$COLOR_LIGHT_GRAY_3 : #eaeced; -$COLOR_LIGHT_GRAY_4 : #6e6e6e; -$COLOR_LIGHT_GRAY_5 : #c2c2c2; -$COLOR_LIGHT_GRAY_6 : #e9e9ed; +$COLOR_LIGHT_BLACK_4: rgba(0, 0, 0, 0.04); +$COLOR_LIGHT_BLACK_4_SOLID: #f4f4f6; +$COLOR_LIGHT_GRAY_1: #999cac; +$COLOR_LIGHT_GRAY_2: rgba(153, 156, 172, 0.32); +$COLOR_LIGHT_GRAY_3: #eaeced; +$COLOR_LIGHT_GRAY_4: #6e6e6e; +$COLOR_LIGHT_GRAY_5: #c2c2c2; +$COLOR_LIGHT_GRAY_6: #e9e9ed; $COLOR_LIGHT_GRAY_7: rgba(0, 0, 0, 0.08); -$COLOR_LIGHT_GREEN_GRADIENT : linear-gradient(to top, rgba(255, 255, 255, 0), rgba(0, 148, 117, 0.16)); -$COLOR_LIGHT_RED_GRADIENT : linear-gradient(to top, rgba(255, 255, 255, 0), rgba(227, 28, 75, 0.16)); -$COLOR_LIGHT_WHITE_GRADIENT : linear-gradient(to right, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0)); +$COLOR_LIGHT_GREEN_GRADIENT: linear-gradient(to top, rgba(255, 255, 255, 0), rgba(0, 148, 117, 0.16)); +$COLOR_LIGHT_RED_GRADIENT: linear-gradient(to top, rgba(255, 255, 255, 0), rgba(227, 28, 75, 0.16)); +$COLOR_LIGHT_WHITE_GRADIENT: linear-gradient(to right, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0)); // Dark theme -$COLOR_DARK_BLACK_GRADIENT : linear-gradient(to right, rgba(16, 19, 32, 1), rgba(16, 19, 32, 0)); -$COLOR_DARK_BLUE_1 : #0b0e18; -$COLOR_DARK_BLUE_2 : #101320; -$COLOR_DARK_BLUE_3 : #191c31; -$COLOR_DARK_BLUE_4 : #202641; -$COLOR_DARK_BLUE_5 : #2a3052; -$COLOR_DARK_BLUE_6 : #555975; -$COLOR_DARK_BLUE_7 : #7f8397; -$COLOR_DARK_BLUE_8 : rgba(127, 131, 151, 0.3); -$COLOR_DARK_GREEN_GRADIENT : linear-gradient(to top, rgba(16, 19, 32, 0), rgba(0, 148, 117, 0.16)); -$COLOR_DARK_RED_GRADIENT : linear-gradient(to top, rgba(16, 19, 32, 0), rgba(227, 28, 75, 0.16)); -$COLOR_DARK_GRAY_1 : #282a37; -$COLOR_DARK_GRAY_2 : #303342; -$COLOR_DARK_GRAY_3 : #555975; -$COLOR_DARK_GRAY_4 : #999999; +$COLOR_DARK_BLACK_GRADIENT: linear-gradient(to right, rgba(16, 19, 32, 1), rgba(16, 19, 32, 0)); +$COLOR_DARK_BLUE_1: #0b0e18; +$COLOR_DARK_BLUE_2: #101320; +$COLOR_DARK_BLUE_3: #191c31; +$COLOR_DARK_BLUE_4: #202641; +$COLOR_DARK_BLUE_5: #2a3052; +$COLOR_DARK_BLUE_6: #555975; +$COLOR_DARK_BLUE_7: #7f8397; +$COLOR_DARK_BLUE_8: rgba(127, 131, 151, 0.3); +$COLOR_DARK_GREEN_GRADIENT: linear-gradient(to top, rgba(16, 19, 32, 0), rgba(0, 148, 117, 0.16)); +$COLOR_DARK_RED_GRADIENT: linear-gradient(to top, rgba(16, 19, 32, 0), rgba(227, 28, 75, 0.16)); +$COLOR_DARK_GRAY_1: #282a37; +$COLOR_DARK_GRAY_2: #303342; +$COLOR_DARK_GRAY_3: #555975; +$COLOR_DARK_GRAY_4: #999999; $themes: ( light: ( DefaultMain: $COLOR_WHITE, - DefaultBg: $COLOR_WHITE, + DefaultBg: $COLOR_WHITE, DefaultText: $COLOR_LIGHT_GRAY, BtnDefaultBg: transparent, BtnDefaultText: $color-red, @@ -471,11 +471,11 @@ $themes: ( ChartHistoricalMarkerFont: $color-black-1, ), dark: ( - DefaultMain: $color-black, - DefaultBg: $color-black, - DefaultText: $COLOR_WHITE, - DefaultBorder: $COLOR_WHITE, - TooltipBg: $color-black-8, + DefaultMain: $color-black, + DefaultBg: $color-black, + DefaultText: $COLOR_WHITE, + DefaultBorder: $COLOR_WHITE, + TooltipBg: $color-black-8, TooltipText: $color-white, TooltipShadow: transparent, TooltipTextBg: transparent, @@ -742,7 +742,7 @@ $themes: ( ChartHistoryPickerFooterBorder: $color-black, ChartHistoryPickerFooterColor: $color-grey, ChartHistoryPickerBodyColor: $color-grey, - ChartHistoryPickerBodyDisableColor:$color-black-6, + ChartHistoryPickerBodyDisableColor: $color-black-6, ChartHistoryPickerBodyActiveBg: $color-black-8, ChartHistoryPickerBodyActiveColor: $COLOR_WHITE, ChartHistoryPickerBodyActiveBorder: $color-black-8, @@ -797,7 +797,12 @@ $themes: ( $theme-map: () !global; @each $key, $submap in $map { $value: map-get(map-get($themes, $theme), '#{$key}'); - $theme-map: map-merge($theme-map, ($key: $value)) !global; + $theme-map: map-merge( + $theme-map, + ( + $key: $value, + ) + ) !global; } @content; $theme-map: null !global; diff --git a/sass/components/_barrier.scss b/sass/components/_barrier.scss index deb36c3cf4..2bf162c95e 100644 --- a/sass/components/_barrier.scss +++ b/sass/components/_barrier.scss @@ -52,13 +52,6 @@ $title-height: 24px; position: absolute; height: $title-height; - /* stylelint-disable number-max-precision, plugin/no-unsupported-browser-features */ - background-image: linear-gradient( - rgba(255, 255, 255, 0.001) 30%, - var(--general-main-1) 50%, - rgba(255, 255, 255, 0.001) 75% - ); - /* stylelint-enable number-max-precision, plugin/no-unsupported-browser-features */ top: -11px; display: flex; align-items: center; @@ -96,6 +89,7 @@ right: -1px; background-color: $color-blue; justify-content: space-between; + border-radius: 4px; .arrow-icon { height: 41px; @@ -103,7 +97,6 @@ position: absolute; transition: none; left: 2px; - background: var(--general-main-1); width: calc(100% - 2px); } } diff --git a/src/components/Barrier.tsx b/src/components/Barrier.tsx index 63c4a4887c..3ee352a444 100644 --- a/src/components/Barrier.tsx +++ b/src/components/Barrier.tsx @@ -18,7 +18,7 @@ const Barrier = ({ store, ...props }: TBarrierBaseProps) => { aboveShadeStore, belowShadeStore, betweenShadeStore, - color = '#39b19d', + color = '#008832', foregroundColor = '#ffffff', hideBarrierLine, hideOffscreenBarrier, @@ -28,7 +28,7 @@ const Barrier = ({ store, ...props }: TBarrierBaseProps) => { isSingleBarrier, lineStyle, opacityOnOverlap, - shadeColor = '#39b19d', + shadeColor = '#008832', } = store; const barrierRef = React.useRef(null); From 40bd516dd52c52ed69a86abab70ec602262be5f4 Mon Sep 17 00:00:00 2001 From: kate-deriv Date: Fri, 8 Nov 2024 15:10:29 +0300 Subject: [PATCH 2/7] chore: empty commit From 756c88e085441f7425ceab2fc79d5fe6c81e4f14 Mon Sep 17 00:00:00 2001 From: kate-deriv Date: Mon, 11 Nov 2024 15:10:35 +0300 Subject: [PATCH 3/7] feat: add new overlapping behaviour --- sass/_themes.scss | 2 +- sass/components/_barrier.scss | 40 +++++++++++++++++++---------------- src/components/PriceLine.tsx | 18 ++++++---------- 3 files changed, 30 insertions(+), 30 deletions(-) diff --git a/sass/_themes.scss b/sass/_themes.scss index 74ad66f324..3f21fdd07d 100644 --- a/sass/_themes.scss +++ b/sass/_themes.scss @@ -87,7 +87,7 @@ $color-green-3: #00a79e; $color-green-4: #008079; $color-orange: #ff6444; $color-yellow: #ffad3a; -$color-blue: #377cfc; +$color-blue: #2c9aff; /* Preserve legacy variables */ /* Primary */ diff --git a/sass/components/_barrier.scss b/sass/components/_barrier.scss index 2bf162c95e..4dcc65c158 100644 --- a/sass/components/_barrier.scss +++ b/sass/components/_barrier.scss @@ -83,14 +83,18 @@ .drag-price { display: flex; - height: 24px; - top: -12px; + height: 21px; + top: -10px; position: absolute; right: -1px; - background-color: $color-blue; justify-content: space-between; + border: 1px solid; border-radius: 4px; + @include themify($themes) { + background: themed('DefaultMain'); + } + .arrow-icon { height: 41px; padding: 4px 0px; @@ -104,10 +108,8 @@ .price { display: block; font-size: 12px; - font-weight: bold; line-height: 18px; overflow: unset; - padding: 3px 1px; position: relative; right: 45px; text-align: center; @@ -116,19 +118,15 @@ &--zero { color: $color-blue; @include themify($themes) { - background-color: themed('DefaultBg'); + /* stylelint-disable number-max-precision, plugin/no-unsupported-browser-features */ + background-image: linear-gradient( + rgba(255, 255, 255, 0.001) 30%, + themed('DefaultBg') 50%, + rgba(255, 255, 255, 0.001) 75% + ); + /* stylelint-enable number-max-precision, plugin/no-unsupported-browser-features */ } } - &-overlay { - /* rtl:begin:ignore */ - background-color: $color-blue; - height: 24px; - opacity: 0.3; - position: absolute; - right: -10px; - top: -12px; - /* rtl:end:ignore */ - } } .draggable { @@ -144,10 +142,16 @@ display: flex; flex-direction: column; justify-content: center; - margin-left: 3px; + padding-left: 3px; + border-top-left-radius: 4px; + border-bottom-left-radius: 4px; + + @include themify($themes) { + background: themed('DefaultMain'); + } div { - background-color: $color-white; + background-color: $color-blue; height: 1px; margin: 1px; width: 8px; diff --git a/src/components/PriceLine.tsx b/src/components/PriceLine.tsx index b077c4d6a7..7cf6a25fe9 100644 --- a/src/components/PriceLine.tsx +++ b/src/components/PriceLine.tsx @@ -59,7 +59,7 @@ const PriceLine = ({ if (!showBarrier) return null; const width = priceLineWidth + 12; - const price_right_offset = (isOverlappingWithPriceLine ? width - overlappedBarrierWidth : 0) + (isMobile ? 20 : 3); + const price_right_offset = isMobile ? 20 : 3; return (
)} @@ -91,8 +91,10 @@ const PriceLine = ({
@@ -114,12 +116,6 @@ const PriceLine = ({ )}
- {isOverlappingWithPriceLine && ( -
- )}
{title && ( Date: Mon, 11 Nov 2024 15:37:21 +0300 Subject: [PATCH 4/7] chore: refactoring --- sass/components/_barrier.scss | 17 ++++++++++++++--- src/components/PriceLine.tsx | 5 ++--- 2 files changed, 16 insertions(+), 6 deletions(-) diff --git a/sass/components/_barrier.scss b/sass/components/_barrier.scss index 4dcc65c158..176a8f0cc6 100644 --- a/sass/components/_barrier.scss +++ b/sass/components/_barrier.scss @@ -83,8 +83,8 @@ .drag-price { display: flex; - height: 21px; - top: -10px; + height: 24px; + top: -12px; position: absolute; right: -1px; justify-content: space-between; @@ -92,7 +92,15 @@ border-radius: 4px; @include themify($themes) { - background: themed('DefaultMain'); + &:not(&--narrow) { + background-color: themed('DefaultMain'); + } + } + + &--narrow { + height: 21px; + top: -10px; + background-color: rgba(12, 40, 247, 0.16); } .arrow-icon { @@ -110,6 +118,7 @@ font-size: 12px; line-height: 18px; overflow: unset; + padding: 3px 1px; position: relative; right: 45px; text-align: center; @@ -117,6 +126,8 @@ &--zero { color: $color-blue; + padding: unset; + @include themify($themes) { /* stylelint-disable number-max-precision, plugin/no-unsupported-browser-features */ background-image: linear-gradient( diff --git a/src/components/PriceLine.tsx b/src/components/PriceLine.tsx index 7cf6a25fe9..8503d4de49 100644 --- a/src/components/PriceLine.tsx +++ b/src/components/PriceLine.tsx @@ -89,9 +89,8 @@ const PriceLine = ({
From 61d48f71a6255dbcd77f1173c0cf3ae99fe2cfcd Mon Sep 17 00:00:00 2001 From: kate-deriv Date: Mon, 18 Nov 2024 09:24:09 +0300 Subject: [PATCH 5/7] chore: remove border radius --- src/components/PriceLine.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/components/PriceLine.tsx b/src/components/PriceLine.tsx index 2e9d593113..8503d4de49 100644 --- a/src/components/PriceLine.tsx +++ b/src/components/PriceLine.tsx @@ -96,8 +96,6 @@ const PriceLine = ({ width: draggable && isOverlappingWithPriceLine ? width + 6 : width - 6, opacity, right: price_right_offset, - borderTopRightRadius: isOverlappingWithPriceLine ? 0 : 4, - borderBottomRightRadius: isOverlappingWithPriceLine ? 0 : 4, }} > From 873e63290663944b56d84bd3a42cfdb0a716519f Mon Sep 17 00:00:00 2001 From: kate-deriv Date: Tue, 19 Nov 2024 11:36:40 +0300 Subject: [PATCH 6/7] chore: empty commit From 2e8437e8af7f1b36fcce0b240abda5c61a7fb4f4 Mon Sep 17 00:00:00 2001 From: kate-deriv Date: Wed, 20 Nov 2024 06:20:06 +0300 Subject: [PATCH 7/7] chore: remove empty space --- sass/components/_barrier.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/sass/components/_barrier.scss b/sass/components/_barrier.scss index 176a8f0cc6..99a2030e24 100644 --- a/sass/components/_barrier.scss +++ b/sass/components/_barrier.scss @@ -102,7 +102,6 @@ top: -10px; background-color: rgba(12, 40, 247, 0.16); } - .arrow-icon { height: 41px; padding: 4px 0px;