feat: change logos on chinese language (#43269)
* feat: change logos on chinese language * fix: use Ahmads logos * fix: error * fix: tencent logo size * feat: include chinese traditional * Apply suggestions from code review Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com> Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>pull/43303/head
Sem Bauke
GitHub
parent
34b8ac2029
commit
cd005668b9
|
|
@ -0,0 +1,56 @@
|
|||
import React from 'react';
|
||||
|
||||
function AlibabaLogo(
|
||||
props: JSX.IntrinsicAttributes & React.SVGProps<SVGSVGElement>
|
||||
): React.ReactNode {
|
||||
return (
|
||||
<svg
|
||||
id='alibaba-logo'
|
||||
version='1.1'
|
||||
viewBox='0 0 604 341'
|
||||
xmlns='http://www.w3.org/2000/svg'
|
||||
xmlnsXlink='http://www.w3.org/1999/xlink'
|
||||
{...props}
|
||||
>
|
||||
<g fill='none'>
|
||||
<g fill='var(--quaternary-color)'>
|
||||
<g transform='translate(302 170.5) scale(-1 1) rotate(180) translate(-302 -170.5)'>
|
||||
<path
|
||||
d='m337.38 340.03c-38.613-6.1203-83.017-21.904-113.42-40.748-36.521-22.387-71.272-59.109-86.557-91.322-4.5048-9.6637-5.1483-12.563-5.1483-24.803 0-12.241 0.48266-14.496 4.3439-20.455 5.3092-7.7309 15.445-14.173 28.155-17.556 17.697-4.6708 55.666-0.8053 83.339 8.3752 10.458 3.5433 34.912 14.012 34.108 14.657-0.16088 0.32212-9.1705-1.2885-19.628-3.5433-26.868-5.6371-62.745-7.0867-77.225-3.0602-17.376 4.6708-21.88 10.63-16.089 21.582 3.2177 6.4424 14.962 16.428 26.546 22.549l9.6531 5.154v11.435 11.435l5.3092-1.1274c23.489-4.9929 35.878-4.6708 55.827 1.6106 6.5963 2.0938 15.606 5.9593 19.95 8.6973 7.8834 4.9929 10.458 4.6708 10.618-1.1274v-1.0407c0.85812-0.002775 2.9471 0.11022 4.2186 0.14558 0.12288 0.24415 0.22714 0.5256 0.31276 0.84435 0.1968 0.73258 0.29519 1.6622 0.29519 2.7888 0 5.6371-6.7572 13.69-12.871 15.462-4.0221 1.1274-4.0221 0.96637-1.1262-2.2549 1.7697-1.7717 2.5742-4.0265 2.0915-4.8318-0.48266-0.80531-5.631-3.7044-11.262-6.6035-11.584-5.6371-28.316-9.8247-39.578-9.6637-8.2052 0-20.432 2.0938-22.202 3.8655-0.64354 0.48318 3.3786 4.9929 8.8487 9.9858l10.136 8.8584-2.4133 5.6371c-1.2871 3.0602-2.4133 6.6035-2.4133 7.892 0 4.0265 60.654 22.387 103.61 31.246 13.354 2.738 24.455 5.154 24.776 5.4761 0.16089 0.32212-2.0915 2.738-5.4701 5.4761-3.3621 2.7887-4.7741 3.9698-4.6471 4.846 1.6968 0.99636 3.4929 1.8759 4.9739 2.5693 2.4232 0.22088 5.8789-0.51384 12.383-2.4223 22.071-6.4985 34.182-12.738 39.234-20.344 2.6049-3.7216 3.6266-4.8476 3.5618-9.7746-1.8716-12.881-13.354-28.83-48.266-68.773-28.477-32.695-37.004-47.03-34.269-58.304 5.631-23.837 49.875-19.166 125.33 13.207 18.502 7.892 72.077 34.789 71.112 35.595-0.32177 0.32212-6.2745-1.7717-13.354-4.8318-38.291-16.106-87.844-30.118-120.99-33.823-23.489-2.738-28.316-1.9327-28.959 4.8318-0.64354 5.9593 3.8613 12.885 27.672 41.554 30.407 36.561 41.187 54.117 43.6 70.545 1.448 9.6637-2.4133 22.71-8.8487 30.602-6.4354 7.7309-21.72 15.14-37.486 18.2-11.584 2.2549-37.808 2.8991-47.783 1.2885z'
|
||||
id='Shape'
|
||||
/>
|
||||
<path
|
||||
d='m23.489 47.225-23.489-45.902h14.801 14.962l7.079 17.717h24.133 23.972l3.8613-8.8584 4.0221-8.8584h16.089c8.8487 0 16.089 0.32212 16.089 0.80531 0 0.48318-10.136 21.099-22.524 45.902l-22.524 45.097h-16.571-16.41l-23.489-45.902zm46.496 7.7309c3.7004-8.5362 6.4354-15.784 6.1137-16.106s-7.079-0.32212-15.123-0.16106l-14.48 0.48318 7.4007 15.784c4.0221 8.5362 7.7225 15.623 8.2052 15.623 0.64354 0 4.0221-7.0867 7.8834-15.623z'
|
||||
id='Shape'
|
||||
/>
|
||||
<polygon
|
||||
id='Path'
|
||||
points='133.05 47.225 133.05 1.3221 147.53 1.3221 162.01 1.3221 162.01 47.225 162.01 93.127 147.53 93.127 133.05 93.127'
|
||||
/>
|
||||
<polygon
|
||||
id='a'
|
||||
points='178.1 84.269 178.1 75.41 192.58 75.41 207.06 75.41 207.06 84.269 207.06 93.127 192.58 93.127 178.1 93.127'
|
||||
/>
|
||||
<path
|
||||
d='m223.15 47.225v-45.902h13.675l15.284 0.16054c0.010474 7.2818 0.010474 11.416 0 12.404 0.60917-0.35664 1.1436-3.0878 4.6809-5.9115 6.7572-8.0531 28.14-9.391 39.402-2.7875 8.2052 4.8318 11.423 9.3415 13.997 19.166 2.5742 10.63-0.32177 23.032-7.5616 31.568-11.423 13.368-33.786 14.334-47.622 2.0938-0.83946-0.69207-2.2784-1.6596-2.8959-2.0938-0.039974 2.8807 0 6.082 0 18.361v18.844h-14.48-14.48v-45.902zm54.54-0.16106c4.3439-5.4761 5.7919-13.69 3.5395-20.455-2.7351-8.0531-6.9181-11.274-14.962-11.274-9.9749 0-14.158 5.4761-14.158 18.361 0 8.0531 0.64354 10.308 4.0221 13.529 5.631 5.7982 16.893 5.6371 21.559-0.16106z'
|
||||
id='Shape'
|
||||
/>
|
||||
<path
|
||||
d='m420.15 48.225v-45.902h13.675l15.284 0.16054c0.010474 7.2818 0.010474 11.416 0 12.404 0.60917-0.35664 1.1436-3.0878 4.6809-5.9115 6.7572-8.0531 28.14-9.391 39.402-2.7875 8.2052 4.8318 11.423 9.3415 13.997 19.166 2.5742 10.63-0.32177 23.032-7.5616 31.568-11.423 13.368-33.786 14.334-47.622 2.0938-0.83946-0.69207-2.2784-1.6596-2.8959-2.0938-0.039974 2.8807 0 6.082 0 18.361v18.844h-14.48-14.48v-45.902zm54.54-0.16106c4.3439-5.4761 5.7919-13.69 3.5395-20.455-2.7351-8.0531-6.9181-11.274-14.962-11.274-9.9749 0-14.158 5.4761-14.158 18.361 0 8.0531 0.64354 10.308 4.0221 13.529 5.631 5.7982 16.893 5.6371 21.559-0.16106z'
|
||||
id='Shape'
|
||||
/>
|
||||
<path
|
||||
d='m348 65.586c-9.3314-2.2549-16.571-7.4088-18.502-13.046-0.96532-2.738-1.7697-5.315-1.7697-5.4761 0-0.32212 6.1137-0.64424 13.675-0.64424 11.262 0 13.675 0.48318 13.675 2.4159 0 2.8991 6.2745 5.6371 13.032 5.6371 5.3092 0 11.101-4.9929 11.101-9.5026 0-2.577-1.7697-3.0602-16.41-3.8655-19.306-1.1274-27.19-3.3823-33.625-9.3415-6.2745-5.7982-6.5963-17.234-0.80443-23.193 9.3314-9.3415 35.611-9.3415 45.907 0 1.2858 1.1263 3.3815 2.9493 6.2869 5.4689-0.020163-4.2891-0.020163-7.2922 0-9.0094 0.73732-3.0527 0.73732-2.0966 13.286-2.0966h13.032l-0.64354 23.837c-0.48266 27.219-1.6089 30.118-13.032 36.078-5.3092 2.738-10.136 3.5433-22.846 3.8655-8.8487 0.32212-18.985-0.16106-22.363-1.1274zm30.247-39.621c-1.6089-6.4424-5.1483-9.9858-11.423-11.113-8.0443-1.4495-13.675 1.4496-13.032 6.9256 0.64354 5.7982 6.1137 8.5362 17.054 8.5362 8.3661 0 8.3661 0 7.4007-4.3486z'
|
||||
id='b'
|
||||
/>
|
||||
<path d='m545 66.586c-9.3314-2.2549-16.571-7.4088-18.502-13.046-0.96532-2.738-1.7697-5.315-1.7697-5.4761 0-0.32212 6.1137-0.64424 13.675-0.64424 11.262 0 13.675 0.48318 13.675 2.4159 0 2.8991 6.2745 5.6371 13.032 5.6371 5.3092 0 11.101-4.9929 11.101-9.5026 0-2.577-1.7697-3.0602-16.41-3.8655-19.306-1.1274-27.19-3.3823-33.625-9.3415-6.2745-5.7982-6.5963-17.234-0.80443-23.193 9.3314-9.3415 35.611-9.3415 45.907 0 1.2858 1.1263 3.3815 2.9493 6.2869 5.4689-0.020163-4.2891-0.020163-7.2922 0-9.0094 0.73732-3.0527 0.73732-2.0966 13.286-2.0966h13.032l-0.64354 23.837c-0.48266 27.219-1.6089 30.118-13.032 36.078-5.3092 2.738-10.136 3.5433-22.846 3.8655-8.8487 0.32212-18.985-0.16106-22.363-1.1274zm30.247-39.621c-1.6089-6.4424-5.1483-9.9858-11.423-11.113-8.0443-1.4495-13.675 1.4496-13.032 6.9256 0.64354 5.7982 6.1137 8.5362 17.054 8.5362 8.3661 0 8.3661 0 7.4007-4.3486z' />
|
||||
<polygon points='178.1 34.34 178.1 2.9327 192.58 2.9327 207.06 2.9327 207.06 34.34 207.06 65.747 192.58 65.747 178.1 65.747' />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
|
||||
AlibabaLogo.displayName = 'AlibabaLogo';
|
||||
export default AlibabaLogo;
|
||||
|
|
@ -1,15 +1,19 @@
|
|||
import AlibabaLogo from './alibaba-logo';
|
||||
import AmazonLogo from './amazon-logo';
|
||||
import AppleLogo from './apple-logo';
|
||||
import AsSeenInText from './as-seen-in-text';
|
||||
import GoogleLogo from './google-logo';
|
||||
import MicrosoftLogo from './microsoft-logo';
|
||||
import SpotifyLogo from './spotify-logo';
|
||||
import TencentLogo from './tencent-logo';
|
||||
|
||||
export {
|
||||
AmazonLogo,
|
||||
AlibabaLogo,
|
||||
AppleLogo,
|
||||
MicrosoftLogo,
|
||||
SpotifyLogo,
|
||||
GoogleLogo,
|
||||
TencentLogo,
|
||||
AsSeenInText
|
||||
};
|
||||
|
|
|
|||
|
|
@ -0,0 +1,48 @@
|
|||
import React from 'react';
|
||||
|
||||
function TencentLogo(
|
||||
props: JSX.IntrinsicAttributes & React.SVGProps<SVGSVGElement>
|
||||
): React.ReactNode {
|
||||
return (
|
||||
<svg
|
||||
height='75'
|
||||
id='tencent-logo'
|
||||
version='1.1'
|
||||
viewBox='0 0 1000 190'
|
||||
width='100'
|
||||
xmlns='http://www.w3.org/2000/svg'
|
||||
{...props}
|
||||
>
|
||||
<title>Tencent_Logo</title>
|
||||
<g fill='none'>
|
||||
<g fill='var(--quaternary-color)'>
|
||||
<polygon
|
||||
id='Path'
|
||||
points='918.94 58.881 876.21 58.881 893.02 82.992 914.68 82.992 896.46 186.71 934.42 186.71 952.66 82.992 1e3 82.992 925.27 22.869'
|
||||
/>
|
||||
<polygon
|
||||
id='Path'
|
||||
points='177.14 0 4.709 0 0 27.159 66.949 27.159 38.9 186.72 76.854 186.72 104.91 27.159 172.43 27.159'
|
||||
/>
|
||||
<path
|
||||
d='m119.96 121.65c-6.796 39.169 17.271 67.841 65.96 67.841 21.754 0 42.106-4.092 58.643-13.282l5.135-29.215c-16.153 11.573-36.711 18.04-54.126 18.04-24.272 0-43.568-10.105-40.533-33.286h100.3c1.208-2.753 2.656-7.572 3.7-13.584 4.86-27.988-5.06-62.156-53.818-62.156-48.243 0-79.126 30.365-85.256 65.642zm104.93-12.438h-66.008c3.968-13.075 16.791-31.152 40.136-31.152 25.404 0 28.089 19.313 25.872 31.152'
|
||||
id='a'
|
||||
/>
|
||||
<path
|
||||
d='m372.83 56.011c-23.689 0-41.434 9.819-49.801 19.745h-0.885l-33.409-19.745c-1.229 11.079-2.869 26.123-5.437 40.889l-15.603 89.813h37.953l13.2-75.214c0.632-3.692 1.888-7.605 3.521-10.262 5.67-9.868 17.566-18.956 32.647-18.956 20.71 0 26.346 13.973 23.167 32.308l-12.692 72.124h37.96l13.365-75.927c7.017-40.422-17.839-54.775-43.986-54.775'
|
||||
id='Path'
|
||||
/>
|
||||
<path
|
||||
d='m828.13 56.011c-23.702 0-41.425 9.819-49.794 19.745h-0.884l-33.41-19.745c-1.229 11.079-2.877 26.123-5.444 40.889l-15.588 89.813h37.939l13.207-75.214c0.625-3.692 1.882-7.605 3.508-10.262 5.676-9.868 17.571-18.956 32.641-18.956 20.735 0 26.365 13.973 23.188 32.308l-12.686 72.124h37.953l13.345-75.927c7.02-40.422-17.829-54.775-43.975-54.775'
|
||||
id='b'
|
||||
/>
|
||||
<path d='m660.51 56.004c-48.243 0-79.118 30.365-85.249 65.642-6.796 39.169 17.271 67.841 65.953 67.841 21.753 0 42.113-4.092 58.643-13.282l5.142-29.215c-16.151 11.573-36.704 18.04-54.14 18.04-24.259 0-43.533-10.105-40.521-33.286h100.31c1.188-2.753 2.643-7.572 3.706-13.584 4.833-27.988-5.092-62.156-53.843-62.156m19.673 53.204h-66c3.96-13.075 16.783-31.152 40.121-31.152 25.419 0 28.103 19.313 25.879 31.152' />
|
||||
<path d='m432.75 121.08c-6.885 39.678 20.896 68.391 67.916 68.391 18.699 0 41.021-5.376 49.479-8.512l6.137-34.165c-13.186 14.183-31.062 17.128-43.747 17.128-25.83 0-45.387-15.04-40.836-41.249 3.947-23.435 26.14-41.445 55.073-41.445 11.779 0 27.767 3.945 37.844 17.207l5.883-34.752c-8.162-3.133-21.225-7.605-40.563-7.605-52.76 0-90.534 26.733-97.186 65.002' />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
|
||||
TencentLogo.displayName = 'TencentLogo';
|
||||
export default TencentLogo;
|
||||
|
|
@ -2,12 +2,15 @@ import { Col, Row } from '@freecodecamp/react-bootstrap';
|
|||
import PropTypes from 'prop-types';
|
||||
import React from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import envData from '../../../../../config/env.json';
|
||||
import {
|
||||
AmazonLogo,
|
||||
AppleLogo,
|
||||
MicrosoftLogo,
|
||||
SpotifyLogo,
|
||||
GoogleLogo
|
||||
GoogleLogo,
|
||||
TencentLogo,
|
||||
AlibabaLogo
|
||||
} from '../../../assets/images/components';
|
||||
import { Spacer } from '../../helpers';
|
||||
import BigCallToAction from './BigCallToAction';
|
||||
|
|
@ -17,9 +20,12 @@ const propTypes = {
|
|||
page: PropTypes.string
|
||||
};
|
||||
|
||||
const { clientLocale } = envData;
|
||||
function LandingTop({ page }) {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const showChineseLogos = ['chinese', 'chinese-tradition'].includes(
|
||||
clientLocale
|
||||
);
|
||||
return (
|
||||
<div className='landing-top'>
|
||||
<Row>
|
||||
|
|
@ -35,8 +41,17 @@ function LandingTop({ page }) {
|
|||
<AppleLogo />
|
||||
<GoogleLogo />
|
||||
<MicrosoftLogo />
|
||||
<AmazonLogo />
|
||||
<SpotifyLogo />
|
||||
{showChineseLogos ? (
|
||||
<>
|
||||
<TencentLogo />
|
||||
<AlibabaLogo />
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<SpotifyLogo />
|
||||
<AmazonLogo />
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
<Spacer />
|
||||
<BigCallToAction page={page} />
|
||||
|
|
|
|||
Loading…
Reference in New Issue