Thanks to visit codestin.com
Credit goes to github.com

Skip to content
This repository was archived by the owner on May 20, 2025. It is now read-only.

Commit d37b3c7

Browse files
mitra-derivkonstantinosG-derivhabib-derivKonstantinos-Gkmeenakshi-deriv
committed
Mitra/Reusable button components with new design (#4114)
* Konstantinos / Ubuntu font (#4088) * habib/Add trade types component initial (#4076) * chore: add component initial * chore: update full width container for product pages * Habib/fix vercel issue rebranding (#4084) * chore: update package-lock * chore: update package * Revert "Habib/fix vercel issue rebranding (#4084)" (#4085) This reverts commit 7648e09. * feat: add ubuntu font * feat: change weight * feat: change weight and delete file Co-authored-by: Habib Deriv <[email protected]> Co-authored-by: Konstantinos-Gk <[email protected]> * Konstantinos / Reusable title (#4087) * habib/Add trade types component initial (#4076) * chore: add component initial * chore: update full width container for product pages * Habib/fix vercel issue rebranding (#4084) * chore: update package-lock * chore: update package * Revert "Habib/fix vercel issue rebranding (#4084)" (#4085) This reverts commit 7648e09. * feat: add title and subtitle component * fix: change name Co-authored-by: Habib Deriv <[email protected]> Co-authored-by: Konstantinos-Gk <[email protected]> * chore: add assets * Meenu/ live price rebranding (#4093) * Habib/live market price (#3977) * fix: live market pricing in homepage * fix: implemented trending asset api * fix: fixed pr failure * fix: display only trending markets * fix: package-lock dateformat * fix: remove markets component Co-authored-by: meenakshi-deriv <[email protected]> * fix: update forex as default tab * fix: fixed daily pervent change * fix: fixed color change for daily percentage cell * fix: updated css variables * fix: comments resolving * fix: resolving comments * fix: fixed market description for each market * fix undefined is not iterable error for Map() * Add type data * auto-pull-translation * fix: fixed trade now button * fix: updated login button * fix: fixed space issue in safari * auto-pull-translation * fix: redirect button fix * auto-pull-translation * fix: updated to 5 rows * auto-pull-translation * auto-pull-translation * translation: 📚 sync translations from crowdin feature branch * fix: eu condition applied * fix: updated disclaimer text * auto-pull-translation * translation: 📚 sync translations from crowdin feature branch * auto-pull-translation * translation: 📚 sync translations from crowdin feature branch * fix: tab fix * fix: live price table updates Co-authored-by: Habib Deriv <[email protected]> Co-authored-by: meenakshi-deriv <[email protected]> Co-authored-by: DerivFE <[email protected]> * Habib/update attribute (#4098) * Prince/ update workflow permissions (#4080) * chore: update workflow permissions * chore: undo unnecessary change * chore: update attribute Co-authored-by: prince-deriv <[email protected]> * chore: fetch latest translations (#4090) * chore: fix conflicts * chore: ✨ add reusable component for button (#4100) * feat: ✨ add new on hover colors --------- Co-authored-by: konstantinosG-deriv <[email protected]> Co-authored-by: Habib Deriv <[email protected]> Co-authored-by: Konstantinos-Gk <[email protected]> Co-authored-by: habib-binary <[email protected]> Co-authored-by: meenakshi-deriv <[email protected]> Co-authored-by: meenakshi-deriv <[email protected]> Co-authored-by: DerivFE <[email protected]> Co-authored-by: prince-deriv <[email protected]>
1 parent 3591e66 commit d37b3c7

File tree

19 files changed

+515
-291
lines changed

19 files changed

+515
-291
lines changed

src/components/custom/_button.tsx

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,20 +12,24 @@ type TProps = {
1212
hero?: boolean
1313
}
1414

15-
const Label = styled.span<Omit<TProps, 'label' | 'onClick'>>`
15+
type TLabelProps = Omit<TProps, 'label' | 'onClick'>
16+
17+
type TContainerProps = Omit<TProps, 'label'>
18+
19+
const Label = styled.span<TLabelProps>`
1620
font-family: Ubuntu, sans-serif;
1721
font-weight: 700;
1822
line-height: ${({ hero }) => (hero ? '20px' : '14px')};
1923
font-size: ${({ hero }) => (hero ? '20px' : '14px')};
2024
color: var(--color-white);
21-
${({ tertiary, outline }) => (tertiary && outline ? 'color: var(--clr-primary)' : '')};
25+
${({ tertiary, outline }) => (tertiary && outline ? 'color: var(--color-black-3)' : '')};
2226
${({ secondary }) => (secondary ? 'color: var(--color-red)' : '')};
2327
${({ primary }) => (primary ? 'color: var(--color-white)' : '')};
2428
${({ secondary, outline }) => (secondary && outline ? 'color: var(--color-white)' : '')};
2529
${({ primary, outline }) => (primary && outline ? 'color: var(--color-red)' : '')};
2630
`
2731

28-
const Container = styled.div<Omit<TProps, 'label'>>`
32+
const Container = styled.div<TContainerProps>`
2933
display: flex;
3034
flex-direction: row;
3135
justify-content: center;
@@ -47,20 +51,24 @@ const Container = styled.div<Omit<TProps, 'label'>>`
4751
secondary && outline ? 'border: 1.5px solid var(--color-white)' : ''};
4852
${({ primary, outline }) => (primary && outline ? 'border: 1.5px solid var(--color-red)' : '')};
4953
50-
/* TODO: (mitra) to add on hover changes for secondary and tertiary buttons once given by design */
5154
&:hover {
5255
cursor: pointer;
5356
${({ primary, outline }) =>
5457
primary && outline ? 'background-color: var(--color-red)' : ''};
5558
${({ primary, outline }) =>
5659
primary && !outline ? 'background-color: var(--color-red-6)' : ''};
60+
${({ tertiary, outline }) =>
61+
tertiary && outline ? 'background-color: var(--color-grey-43)' : ''};
62+
${({ secondary, outline }) =>
63+
secondary && !outline ? 'background-color: var(--color-red)' : ''};
5764
}
5865
&:hover ${Label} {
5966
${({ primary, outline }) => (primary && outline ? 'color: var(--color-white)' : '')};
67+
${({ secondary, outline }) => (secondary && !outline ? 'color: var(--color-white)' : '')};
6068
}
6169
`
6270

63-
const Button: React.FC<React.PropsWithChildren<TProps>> = ({
71+
const Button: React.FC<TProps> = ({
6472
label,
6573
onClick,
6674
primary = false,

src/themes/variables.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ const Variables = css`
1919
--color-red-3: #d43e47;
2020
--color-red-4: #ff4449;
2121
--color-red-5: #ff0024;
22-
--color-red-6: #ff1624;
22+
--color-red-6: #eb3e48;
2323
--color-grey: #9b9b9b;
2424
--color-grey-1: #f4f4f4;
2525
--color-grey-2: #e8e8e8;
@@ -63,6 +63,7 @@ const Variables = css`
6363
--color-grey-40: #b3b3b3;
6464
--color-grey-41: #f8fafb;
6565
--color-grey-42: #f5f8f9;
66+
--color-grey-43: #dfe0e1;
6667
--color-green: #85acb0;
6768
--color-blue: #4c76be;
6869
--color-blue-2: #365899;

src/translations/ar.json

Lines changed: 15 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -79,6 +79,7 @@
7979
"109865596": "استمتع بالتداول في عطلة نهاية الأسبوع على Deriv وحقق أقصى استفادة من تداولاتك",
8080
"110140669": "إذا كنت متداولًا محترفًا، فإن خدمة إشارات التداول MT5 تتيح لك مشاركة استراتيجياتك مع متداولين آخرين مجانًا أو مقابل رسوم اشتراك تحددها انت. عندما يشترك المتداولون في الإشارة الخاصة بك، يتم نسخ صفقاتك تلقائيًا على حساباتهم في كل مرة تقوم فيها بالتداول.",
8181
"113378532": "إيثريوم/ دولار أمريكي",
82+
"114014970": "تداول الآن",
8283
"116032361": "تحميل Deriv GO",
8384
"117273069": "تتبع <0>وول ستريت 30</0> أداء الأسهم لأكبر 30 شركة مدرجة في الولايات المتحدة.",
8485
"117920584": "وفقًا <0>لشروطنا</0>، نسمح بحساب واحد فقط لكل عميل، والذي يمكنك فتحه بالعملة التي تختارها (إما فيات أو تشفير). إذا كنت ترغب في التداول بعملات أخرى، يمكنك إضافة حسابات عملة مشفرة متعددة إلى ملفك الشخصي.",
@@ -181,6 +182,7 @@
181182
"274268819": "مؤشر التقلب 100",
182183
"274392779": "هيئة الخدمات المالية في لابوان",
183184
"275116637": "Deriv X",
185+
"276089446": "جميع فروق الأسعار إرشادية. لعرض فروق الأسعار في الوقت الفعلي، يرجى الرجوع إلى الجهاز الخاص بك.",
184186
"276341434": "كجزء من عملية تغيير العلامة التجارية الخاصة بنا، سيتغير عنوان URL لتسجيل الدخول إلى الشركة التابعة.",
185187
"276482397": "لا، لا يمكنك.",
186188
"278499050": "استخدم عملتك المحلية لإجراء عمليات الإيداع والسحب من حساب Deriv الخاص بك.",
@@ -1211,6 +1213,7 @@
12111213
"1644652204": "قم بتمويل حسابك باستخدام طريقة الدفع المفضلة لديك.",
12121214
"1644876351": "انتقل إلى البوابة",
12131215
"1645164568": "تكلفة البناء صفر",
1216+
"1645531143": "تداول على أسعار الأصول المستمدة من الأسواق الواقعية أو الأسواق المحاكاة. قم بإدارة تعرضك للخطر عن طريق تحديد مستوى التقلب ليناسب رغبتك في المخاطرة. اختر من بين مؤشراتنا الاصطناعية التي تعمل على مدار الساعة طوال أيام الأسبوع ومؤشرات الفوركس المشتقة ومؤشرات السلة.",
12141217
"1647478191": "كن شريكًا معنا كشركة تابعة. اربح عمولة من إجمالي صافي الإيرادات لصفقات العملاء المحالين على DTrader و DBot.",
12151218
"1648545897": "فينس ستانزيون.",
12161219
"1648938920": "هولندا 25",
@@ -1513,9 +1516,11 @@
15131516
"2060368992": "قراءة دقيقة",
15141517
"2061191384": "نظام DERIV نظير إلى نظير (DP2P",
15151518
"2061681232": "<0>ينتهي بين/ينتهي بالخارج:</0> توقع ما إذا كانت نقطة الخروج ستكون داخل أو خارج هدفين سعريين في نهاية فترة العقد.",
1519+
"2063303726": "اسم الأداة",
15161520
"2063987970": "<0>عمليات إعادة النظر</0> التي تسمح لك بكسب عائد اعتمادًا على الارتفاع أو الانخفاض الأمثل الذي حققته السوق خلال مدة العقد.",
15171521
"2064273783": "حدود الصراف",
15181522
"2064293002": "لا يمكنك تعيين مستوى جني الأرباح عند شراء عقد مضاعفات مع إلغاء الصفقة. ولكن، بمجرد انتهاء خطوة إلغاء الصفقة، يمكنك تعيين مستوى جني الأرباح على العقد المفتوح.",
1523+
"2065278286": "سبريد",
15191524
"2068595952": "ماهو Dervied؟",
15201525
"2068667424": "تحقق من تطبيقنا الآخر",
15211526
"2070356006": "ابدأ في الكسب بناءً على خطة العمولة التي اخترتها - ما يصل إلى 45٪ من إجمالي صافي الإيرادات الناتجة عن العملاء المحالين.",
@@ -1868,6 +1873,13 @@
18681873
"-1755209362": "شاهد <0>هذا الفيديو</0> لمعرفة المزيد عن مضاعفات التداول.",
18691874
"-240686434": "موثوق",
18701875
"-396178446": "أكثر من 100 أصل قابل للتداول",
1876+
"-1308346982": "Derived",
1877+
"-1419217365": "الأسهم والمؤشرات",
1878+
"-1848791211": "تداول الأسهم العالمية للعلامات التجارية الشهيرة والمفضلة لديك ومؤشرات سوق الأسهم الدولية على Deriv. تقدم الأسهم والمؤشرات الخاصة بنا أسهمًا وسلات أصول بأسعار تنافسية يمكنك تداولها خارج ساعات العمل العادية لأسواق الأسهم الرئيسية.",
1879+
"-1959484303": "العملات المشفرة",
1880+
"-999492653": "استفد من السوق عالية السيولة من خلال التداول على مدار الساعة. استفد من التنبؤ بشكل صحيح بحركة العملات المشفرة الأكثر شيوعًا في العالم.",
1881+
"-362324454": "السلع",
1882+
"-2072074553": "قم بالمضاربة على تحركات أسعار الفضة والذهب والنفط وغيرها. استفد من فرق السعر عندما يتحرك السوق في الاتجاه الذي توقعته.",
18711883
"-1573099251": "ما هو برنامج وكيل الدفع Deriv؟",
18721884
"-456233007": "إنه ترتيب شراكة حيث يتم تفويض وكيل الدفع لمعالجة عمليات الإيداع والسحب لعملائنا.",
18731885
"-1246163204": "لماذا يحتاج العملاء إلى وكيل دفع؟",
@@ -1916,10 +1928,7 @@
19161928
"-319687255": "Deriv GO",
19171929
"-1246992539": "Binary Bot",
19181930
"-58704987": "قم بالتداول في أكبر سوق مالية في العالم والتي توفر أزواج العملات الأجنبية الأكثر تداولا.",
1919-
"-1308346982": "Derived",
19201931
"-260024315": "توقع اتجاهات السوق الموسعة وتنوع المخاطر التي تواجهك في علاقة بالأسهم والمؤشرات.",
1921-
"-1959484303": "العملات المشفرة",
1922-
"-362324454": "السلع",
19231932
"-34495732": "المعلومات التنظيمية",
19241933
"-737399162": "برامج الشراكة",
19251934
"-1829383827": "اتصل بنا",
@@ -2190,6 +2199,9 @@
21902199
"-13898976": "لقد كانت تجربة تداول العملات الأجنبية رائعة حقًا على Deriv - إنها عملية سهلة وسلسة!",
21912200
"-143741607": "Deriv هو أفضل وسيط تداول العملات الأجنبية صادفته على الإطلاق!",
21922201
"-642822922": "ماذا يقول عملاؤنا عن Deriv",
2202+
"-1384760133": "سعر العطاء",
2203+
"-1882694284": "اسأل عن السعر",
2204+
"-1254001798": "نسبة التغيير اليومية",
21932205
"-1344568737": "منصة تداول عقود الفروقات الجامعة لكل شيئ.",
21942206
"-1157215583": "مصنع البوتات الكلاسيكي ومنصة التداول الآلي الخاصين بنا.",
21952207
"-1753658117": "أنشئ تطبيقاتك الخاصة باستخدام واجهة مبرمج التطبيقات الخاص بنا.",
@@ -2335,7 +2347,6 @@
23352347
"-1505946900": "تفتح هذه الصفحة تلقائيًا نافذة الدردشة المباشرة",
23362348
"-303718433": "تداول في أسعار الأصول المستمدة من الأسواق الواقعية أو المحاكاة. قم بإدارة تعرضك للخطر عن طريق تحديد مستوى التقلب ليناسب رغبتك في المخاطرة. اختر من بين المؤشرات الاصطناعية التي نقدمها على مدار الساعة طوال أيام الأسبوع ومؤشرات الفوركس المشتقة ومؤشرات السلة.",
23372349
"-1546180144": "اشترك مع Deriv لبدء التداول في السلع والمضاربة على تحركات أسعار الذهب والفضة والنفط والأصول الأخرى.",
2338-
"-2072074553": "قم بالمضاربة على تحركات أسعار الفضة والذهب والنفط وغيرها. استفد من فرق السعر عندما يتحرك السوق في الاتجاه الذي توقعته.",
23392350
"-943701585": "متاح على",
23402351
"-677391007": "ديريف غو",
23412352
"-305466448": "قم بالتداول في عملتك المفضلة مقابل سلة من العملات الرئيسية واستفد من تقليل المخاطر والتقلبات.",
@@ -2367,7 +2378,6 @@
23672378
"-1299708281": "يتيح لك تداول عقود الفروقات التداول على حركة سعر الأصل دون شراء أو امتلاك الأصل الأساسي.",
23682379
"-931787292": "يسمح تداول الخيارات بمجموعة من المدفوعات من التنبؤ بشكل صحيح بحركات السوق، دون الحاجة إلى شراء أصل أساسي.",
23692380
"-1235724293": "تتيح لك المضاعفات التداول باستخدام الرافعة المالية مع الحد من مخاطر الجانب السلبي لاستثمارك. يمكنك زيادة أرباحك المحتملة بعدة مضاعفات لأي حركة للسوق دون المخاطرة بأكثر من استثمارك الأولي.",
2370-
"-999492653": "استفد من السوق عالية السيولة من خلال التداول على مدار الساعة. استفد من التنبؤ بشكل صحيح بحركة العملات المشفرة الأكثر شيوعًا في العالم.",
23712381
"-1061697694": "Derived FX | حساب تجريبي Deriv | Derived FX ",
23722382
"-1850714176": "تداول الفوركس على منصات Deriv سهلة الاستخدام للتداول عبر الإنترنت واحصل على إمكانية الوصول إلى مجموعة واسعة من أزواج العملات الرئيسية والثانوية وغير المتداولة.",
23732383
"-381746202": "500 دولار أمريكي",
@@ -2540,7 +2550,6 @@
25402550
"-613179531": "وصول حصري إلى أنواع التداول المبتكرة",
25412551
"-253689807": "تداول الأسهم العالمية ومؤشرات سوق الأسهم على Deriv. استمتع بأسهمنا ذات الأسعار التنافسية حتى خارج ساعات العمل العادية في أسواق الأسهم الرئيسية.",
25422552
"-1095901299": "سوق الأسهم | تداول المؤشرات | Deriv",
2543-
"-1848791211": "تداول الأسهم العالمية للعلامات التجارية الشهيرة والمفضلة لديك ومؤشرات سوق الأسهم الدولية على Deriv. تقدم الأسهم والمؤشرات الخاصة بنا أسهمًا وسلات أصول بأسعار تنافسية يمكنك تداولها خارج ساعات العمل العادية لأسواق الأسهم الرئيسية.",
25442553
"-506783240": "تداول في أسعار الأصول المستمدة من الأسواق المحاكاة. قم بإدارة تعرضك للخطر عن طريق تحديد مستوى التقلب ليناسب رغبتك في المخاطرة.",
25452554
"-917592239": "المؤشرات الاصطناعية | مؤشرات التقلب | Deriv",
25462555
"-1339404877": "كن موثوقًا",

0 commit comments

Comments
 (0)