diff --git a/src/images/common/careers/living_in_minsk.jpg b/src/images/common/careers/living_in_minsk.jpg new file mode 100644 index 00000000000..e9a81b76545 Binary files /dev/null and b/src/images/common/careers/living_in_minsk.jpg differ diff --git a/src/images/common/careers/minsk.jpg b/src/images/common/careers/minsk.jpg new file mode 100644 index 00000000000..5db8d78345f Binary files /dev/null and b/src/images/common/careers/minsk.jpg differ diff --git a/src/images/common/careers/minsk_grid_1.jpg b/src/images/common/careers/minsk_grid_1.jpg new file mode 100644 index 00000000000..8943a177b6a Binary files /dev/null and b/src/images/common/careers/minsk_grid_1.jpg differ diff --git a/src/images/common/careers/minsk_grid_2.jpg b/src/images/common/careers/minsk_grid_2.jpg new file mode 100644 index 00000000000..805c1f28d18 Binary files /dev/null and b/src/images/common/careers/minsk_grid_2.jpg differ diff --git a/src/images/common/careers/minsk_grid_3.jpg b/src/images/common/careers/minsk_grid_3.jpg new file mode 100644 index 00000000000..9f1100e2e4b Binary files /dev/null and b/src/images/common/careers/minsk_grid_3.jpg differ diff --git a/src/images/common/careers/minsk_grid_4.jpg b/src/images/common/careers/minsk_grid_4.jpg new file mode 100644 index 00000000000..7fe49b41fe7 Binary files /dev/null and b/src/images/common/careers/minsk_grid_4.jpg differ diff --git a/src/images/common/careers/thumbnail_minsk.jpg b/src/images/common/careers/thumbnail_minsk.jpg new file mode 100644 index 00000000000..bb0736e134c Binary files /dev/null and b/src/images/common/careers/thumbnail_minsk.jpg differ diff --git a/src/images/common/maps/map-belarus.png b/src/images/common/maps/map-belarus.png new file mode 100644 index 00000000000..35aa70be557 Binary files /dev/null and b/src/images/common/maps/map-belarus.png differ diff --git a/src/images/common/maps/map-minsk-career.png b/src/images/common/maps/map-minsk-career.png new file mode 100644 index 00000000000..97fa5a7e969 Binary files /dev/null and b/src/images/common/maps/map-minsk-career.png differ diff --git a/src/images/svg/contact/belarus.svg b/src/images/svg/contact/belarus.svg new file mode 100644 index 00000000000..1ac37077fb4 --- /dev/null +++ b/src/images/svg/contact/belarus.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/images/svg/flag_belarus.svg b/src/images/svg/flag_belarus.svg new file mode 100644 index 00000000000..351abb7ce86 --- /dev/null +++ b/src/images/svg/flag_belarus.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/pages/careers/_model/_locations/_contact-details.js b/src/pages/careers/_model/_locations/_contact-details.js index 90208368e6d..1190521488c 100644 --- a/src/pages/careers/_model/_locations/_contact-details.js +++ b/src/pages/careers/_model/_locations/_contact-details.js @@ -2,6 +2,7 @@ const address_cyberjaya = [ 'iTech Tower, Jalan Impact, Cyber 6,', '63000 Cyberjaya, Selangor, Malaysia', ] + const address_dubai = ['Office 1902, Jumeirah Business', 'Center 1, JLT Cluster G'] const address_asuncion = ['Edificio Australia, Oficina 1,', 'Herib Campos Cervera 886,', 'Asunción'] @@ -11,7 +12,9 @@ const address_labuan = [ 'Jalan Tun Mustapha, Labuan 87000,', 'Sabah', ] + const address_malta = ['Level 3, W Business Centre,', 'Triq Dun Karm Birkirkara,', 'BKR9033 Malta'] + const address_ipoh = ['E-5-6, Soho Ipoh 2,', 'Jalan Sultan Idris Shah,', 'Ipoh 30000, Perak'] const address_melaka = ['67-1 & 69-1, Jalan KLJ 6, Taman Kota', 'Laksamana Jaya, Melaka 75200'] @@ -20,6 +23,8 @@ const address_cyprus = ['Level 5, 42 Agias Filaxeos', 'Limassol 3025'] const address_rwanda = ['Level 2 East Wing, Kigali Heights, KG7', 'Avenue, Kigali'] +const address_belarus = ['Minsk, Belarus'] + export { address_cyberjaya, address_dubai, @@ -30,4 +35,5 @@ export { address_melaka, address_cyprus, address_rwanda, + address_belarus, } diff --git a/src/pages/careers/_model/_locations/_locations.js b/src/pages/careers/_model/_locations/_locations.js index a1264866195..754864d8fd0 100644 --- a/src/pages/careers/_model/_locations/_locations.js +++ b/src/pages/careers/_model/_locations/_locations.js @@ -8,6 +8,7 @@ import { address_melaka, address_cyprus, address_rwanda, + address_belarus, } from './_contact-details' export const cyberjaya = { @@ -182,6 +183,26 @@ export const rwanda = { has_iframe: false, } +export const minsk = { + name: 'minsk', + link: '/careers/locations/minsk', + display_name: 'Minsk', + country: 'Belarus', + thumbnail: 'thumbnail_minsk', + header_p: + 'Minsk, the capital of Belarus, is a modern European city located in the centre of the country by the Svislach river. The country has two official languages: Belarussian and Russian, but the younger population is fluent in English too. Today, Minsk is known for its rich historical Soviet architecture, theatres, museums, and art galleries.', + first_p: + 'Minsk is one of the cleanest cities in Belarus with its gleaming streets and well-maintained public facilities. From cafés to film screenings, to underground music shows, there’s a lot going on in Minsk to keep you entertained. The nightlife in Minsk is vibrant with trendy bars and restaurants, with the downtown buildings illuminated by coloured lights that completely transform the city’s architecture.', + first_img: 'living_in_minsk', + grid_images: ['minsk_grid_1', 'minsk_grid_2', 'minsk_grid_3', 'minsk_grid_4'], + map: 'ChIJwc77Waml3BkRKuYdzjsIu7c', + map_text: `We’re located in Minsk, the largest city of Belarus. Minsk has an international airport and efficient public transportation that connects to other major cities in Belarus. The temperate continental climate with fascinating parks and gardens, delicious local cuisine, and intriguing cultures, make Minsk a great location to work.`, + address: address_belarus, + map_img: 'minsk_map', + google_map_link: 'https://goo.gl/maps/T3Xm8VEUp4XaXybZ6', + has_iframe: false, +} + export const locations = { cyberjaya: `${cyberjaya.display_name}, ${cyberjaya.country}`, malta: `${malta.display_name}`, @@ -192,4 +213,5 @@ export const locations = { ipoh: `${ipoh.display_name}, ${ipoh.country}`, cyprus: `${cyprus.display_name}, ${cyprus.country}`, rwanda: `${rwanda.display_name}, ${rwanda.country}`, + belarus: `${minsk.display_name}, ${minsk.country}`, } diff --git a/src/pages/careers/locations/_location-layout.js b/src/pages/careers/locations/_location-layout.js index 8ee870f0afd..26812de0778 100644 --- a/src/pages/careers/locations/_location-layout.js +++ b/src/pages/careers/locations/_location-layout.js @@ -1,7 +1,7 @@ import React from 'react' import PropTypes from 'prop-types' import styled from 'styled-components' -import Container from '../_layout-components/_container' +import CareerContainer from '../_layout-components/_container' import device from 'themes/device' import { SectionContainer, Flex } from 'components/containers' import { Text, LinkText, Header, BackgroundImage, QueryImage } from 'components/elements' @@ -15,7 +15,17 @@ const Pin = styled.img` height: 24px; margin-right: 13px; ` -const StyledContainer = styled(Container)` + +const StyledBackground = styled(BackgroundImage)` + width: 100%; + height: 80rem; + object-fit: contain; + @media ${device.tabletL} { + height: 65.3rem; + } +` + +const StyledContainer = styled(CareerContainer)` flex-direction: column; align-items: flex-start; height: 100%; @@ -26,28 +36,21 @@ const StyledContainer = styled(Container)` ` const StyledHeader = styled(Header)` - font-size: var(--text-size-xl); - margin-bottom: 2.4rem; + font-size: var(--text-size-xxl); + margin-bottom: 1.6rem; color: var(--color-white); ` const Subheadline = styled(Text)` - font-size: var(--text-size-sm); + font-size: var(--text-size-m); color: var(--color-white); - max-width: 58.8rem; - margin-bottom: 8rem; + max-width: 69rem; + margin-bottom: 3.2rem; ` const Hero = ({ display_name, img_data, description }) => { return ( - + {display_name} {description} @@ -59,10 +62,10 @@ const Hero = ({ display_name, img_data, description }) => { rel="noopener noreferrer" external > - {`View open positions in ${display_name}`} + View open positions in {display_name} - + ) } @@ -98,7 +101,7 @@ const Fourth = styled.div` const FirstSection = styled(SectionContainer)` ${Header} { - margin-bottom: 8rem; + margin-bottom: 4rem; } ${Text} { max-width: 41.5rem; @@ -149,30 +152,25 @@ export const LocationLayout = ({ location, images }) => { description={location.header_p} img_data={images[location.name]} /> - - -
- {`Living in ${display_name}`} + + +
+ Living in {display_name}
{location.first_p} - - -
+ + +
Our office
@@ -212,7 +210,7 @@ export const LocationLayout = ({ location, images }) => { - + @@ -238,7 +236,7 @@ export const LocationLayout = ({ location, images }) => {
-
+
Location
{location.map_text} diff --git a/src/pages/careers/locations/index.js b/src/pages/careers/locations/index.js index fd6108dc6f7..8a8bc6f4313 100644 --- a/src/pages/careers/locations/index.js +++ b/src/pages/careers/locations/index.js @@ -13,6 +13,7 @@ import { melaka, cyprus, rwanda, + minsk, } from '../_model/_locations/_locations' import { SEO, SectionContainer, Container, Flex, CssGrid } from 'components/containers' import Layout from 'components/layout/layout' @@ -24,6 +25,7 @@ import UAEFlagIcon from 'images/svg/flag_uae.svg' import MaltaFlagIcon from 'images/svg/flag_malta.svg' import CyprusFlagIcon from 'images/svg/flag_cyprus.svg' import RwandaFlagIcon from 'images/svg/flag_rwanda.svg' +import BelarusFlagIcon from 'images/svg/flag_belarus.svg' import { ReactComponent as Chevron } from 'images/svg/carousel-chevron.svg' const ChevronRight = styled(Chevron)` @@ -140,6 +142,9 @@ const query = graphql` thumbnail_rwanda: file(relativePath: { eq: "careers/thumbnail_rwanda.jpg" }) { ...fadeIn } + thumbnail_minsk: file(relativePath: { eq: "careers/thumbnail_minsk.jpg" }) { + ...fadeIn + } } ` @@ -232,6 +237,13 @@ const Locations = () => { city_name={'Kigali'} link={rwanda.link} /> + diff --git a/src/pages/careers/locations/minsk/index.js b/src/pages/careers/locations/minsk/index.js new file mode 100644 index 00000000000..64b9ad6e12c --- /dev/null +++ b/src/pages/careers/locations/minsk/index.js @@ -0,0 +1,51 @@ +import React from 'react' +import { graphql, useStaticQuery } from 'gatsby' +import { minsk } from '../../_model/_locations/_locations' +import { LocationLayout } from '../_location-layout' +import { SEO } from 'components/containers' +import Layout from 'components/layout/layout' +import { localize, WithIntl } from 'components/localization' + +const query = graphql` + query { + minsk: file(relativePath: { eq: "careers/minsk.jpg" }) { + ...backGroundBlur + } + living_in_minsk: file(relativePath: { eq: "careers/living_in_minsk.jpg" }) { + ...fadeIn + } + minsk_grid_1: file(relativePath: { eq: "careers/minsk_grid_1.jpg" }) { + ...fadeIn + } + minsk_grid_2: file(relativePath: { eq: "careers/minsk_grid_2.jpg" }) { + ...fadeIn + } + minsk_grid_3: file(relativePath: { eq: "careers/minsk_grid_3.jpg" }) { + ...fadeIn + } + minsk_grid_4: file(relativePath: { eq: "careers/minsk_grid_4.jpg" }) { + ...fadeIn + } + minsk_map: file(relativePath: { eq: "maps/map-minsk-career.png" }) { + ...fadeIn + } + } +` + +const Minsk = () => { + const images = useStaticQuery(query) + + return ( + + + + + ) +} + +export default WithIntl()(Minsk) diff --git a/src/pages/contact-us/_offices.js b/src/pages/contact-us/_offices.js index 12b4c0b3d47..6ed20739674 100644 --- a/src/pages/contact-us/_offices.js +++ b/src/pages/contact-us/_offices.js @@ -1,6 +1,7 @@ import React from 'react' import { graphql, useStaticQuery } from 'gatsby' import styled from 'styled-components' +import PropTypes from 'prop-types' import { Text, LocalizedLinkText } from 'components/elements/typography' import { Header, QueryImage } from 'components/elements' import { SectionContainer, Container, Flex, Box } from 'components/containers' @@ -14,6 +15,7 @@ import Paraguay from 'images/svg/contact/paraguay.svg' import Malaysia from 'images/svg/contact/malaysia.svg' import Cyprus from 'images/svg/contact/cyprus.svg' import Rwanda from 'images/svg/contact/rwanda.svg' +import Belarus from 'images/svg/contact/belarus.svg' const query = graphql` query { @@ -44,6 +46,9 @@ const query = graphql` map_rwanda: file(relativePath: { eq: "maps/map-rwanda.png" }) { ...fadeIn } + map_belarus: file(relativePath: { eq: "maps/map-belarus.png" }) { + ...fadeIn + } } ` @@ -160,7 +165,8 @@ const FullBox = styled(Flex)` } ` -export const Offices = () => { +// TODO: remove is_belarus_enabled boolean once address is confirmed. +export const Offices = ({ is_belarus_enabled }) => { const data = useStaticQuery(query) return ( @@ -287,7 +293,7 @@ export const Offices = () => { > C-13, iTech Tower, Jalan Impact,

- Cyber 6, 63000,Cyberjaya, + Cyber 6, 63000, Cyberjaya,

Selangor @@ -504,6 +510,44 @@ export const Offices = () => { + {is_belarus_enabled && ( + + +
+ belarus +
+
+ {localize('Belarus')} +
+ + + + + + + + + Minsk, Belarus + + + + )} @@ -511,4 +555,8 @@ export const Offices = () => { ) } +Offices.propTypes = { + is_belarus_enabled: PropTypes.bool, +} + export default Offices diff --git a/src/pages/contact-us/index.js b/src/pages/contact-us/index.js index 9a9b1003105..e6543fc59af 100644 --- a/src/pages/contact-us/index.js +++ b/src/pages/contact-us/index.js @@ -51,7 +51,7 @@ const ContactUs = () => { - + ) diff --git a/src/themes/variables.js b/src/themes/variables.js index 89b8b79a648..6c24bdfb533 100644 --- a/src/themes/variables.js +++ b/src/themes/variables.js @@ -78,6 +78,7 @@ const Variables = css` --text-size-header-2: 2.8rem; --text-size-header-3: 7.2rem; --text-size-header-4: 4rem; + --text-size-header-5: 4.8rem; } `