Skip to content
This repository was archived by the owner on Dec 28, 2023. It is now read-only.

Commit 78c62b1

Browse files
authored
fix:Added rebranding (#291)
1 parent 9a005a2 commit 78c62b1

File tree

10 files changed

+35
-13
lines changed

10 files changed

+35
-13
lines changed

img/hamburger_icon.svg

Lines changed: 6 additions & 0 deletions
Loading

img/wordmark.svg

Lines changed: 4 additions & 0 deletions
Loading

src/components/global/Button/Button.module.scss

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,18 @@
2626
width: fit-content;
2727
padding: 0.8rem 1.6rem;
2828

29+
&:hover {
30+
--btn-background: var(--gray-05);
31+
}
32+
}
33+
&.logout {
34+
--btn-background: transparent;
35+
--btn-text-color: var(--red-01);
36+
border: solid 2px var(--red-01);
37+
border-radius: 10px;
38+
width: fit-content;
39+
padding: 0.8rem 1.6rem;
40+
2941
&:hover {
3042
--btn-background: var(--gray-05);
3143
}

src/components/global/Button/Button.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,10 @@ export default function Button({
1414
let classesNames = `${styles.btn}`;
1515
if (type === 'secondary') {
1616
classesNames += ` ${styles.secondary}`;
17+
} else if (type === 'logout') {
18+
classesNames += ` ${styles.logout}`;
1719
}
20+
1821
return (
1922
<button disabled={disabled} onClick={onClick} className={classesNames}>
2023
{children}

src/components/global/DerivLogo/DerivLogo.module.scss

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
margin-left: 2.4rem;
2020
}
2121
.logo {
22-
background-image: url(/img/deriv.svg);
22+
background-image: url(/img/wordmark.svg);
2323
width: 18rem;
2424
height: 7.3rem;
2525
background-size: contain;
@@ -38,8 +38,7 @@
3838
}
3939

4040
[data-state*="responsive.mobile"] {
41-
.logoLink {
42-
justify-content: center;
41+
.logoLink {
4342
.logo {
4443
height: 4.8rem;
4544
width: 8.4rem;

src/components/global/DerivLogo/DerivLogo.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ export const DerivLogo = () => {
1111
<Link className={styles.logoLink} to='/' data-testid='mainLogo'>
1212
<div className={styles.flexContainer}>
1313
<div data-testid='home_logo' onClick={clickLogo} className={styles.logo} />
14-
<h1 className={styles.branding}>API</h1>
1514
</div>
1615
</Link>
1716
);

src/components/global/Header/Header.module.scss

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,13 +5,13 @@
55
z-index: 100;
66
display: flex;
77
flex-direction: column;
8-
background-color: var(--black-01);
8+
background-color: var(--white);
99
a {
1010
position: relative;
1111
margin-right: 4rem;
1212
font-size: var(--text-size-s);
1313
line-height: 1.5;
14-
color: var(--white);
14+
color: var(--black-01);
1515
&:empty {
1616
display: none !important;
1717
}
@@ -60,7 +60,7 @@
6060
margin-right: 4rem;
6161
font-size: var(--text-size-xxs);
6262
line-height: var(--text-lh-m);
63-
color: var(--copy-color);
63+
color: var(--black-01);
6464

6565
&::before {
6666
visibility: hidden;
@@ -73,7 +73,8 @@
7373
align-items: center;
7474
justify-content: center;
7575
height: 7.3rem;
76-
background-color: var(--black-01);
76+
background-color: var(--white);
77+
border-bottom: 1px var(--gray-01) solid;
7778
.headerContainer {
7879
display: flex;
7980
flex-wrap: nowrap;
@@ -82,7 +83,7 @@
8283
.hamburger {
8384
width: 1.6rem;
8485
height: 1.6rem;
85-
background-image: url(/img/hamburger_menu.svg);
86+
background-image: url(/img/hamburger_icon.svg);
8687
background-repeat: no-repeat;
8788
padding: 0.1rem;
8889
display: none;

src/components/global/Header/TopNav.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ export const TopNav = () => {
44
<div className={`${styles.topNav} ${styles.flexContainer}`}>
55
<div className={styles.topNavContainer}>
66
<a href='https://deriv.com/'>Deriv website</a>
7-
<a href='https://deriv.com/who-we-are'>About us</a>
7+
<a href='https://deriv.com/who-we-are'>Who we are</a>
88
<a href='https://deriv.com/contact-us'>Contact us</a>
99
</div>
1010
</div>

src/components/global/LogoutButton/LogoutButton.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export const LogoutButton = () => {
1414
return (
1515
<Suspense fallback={<div />}>
1616
<div className={styles.signOut}>
17-
<LazyButton onClick={logout}>Sign out</LazyButton>
17+
<LazyButton onClick={logout} type='logout'>Sign out</LazyButton>
1818
</div>
1919
</Suspense>
2020
);

src/components/global/LogoutButton/LogoutButton.module.scss

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,6 @@
66
z-index: 100;
77
color: var(--white);
88
background-color: transparent;
9-
border: solid 2px var(--gray-05);
10-
border-radius: 4px;
119
}
1210

1311
[data-state*="mobile"] .signOut {

0 commit comments

Comments
 (0)