Merge pull request binary-com#4635 from zakibinary/expat_handbook_update

zaki/expat_handbook_update
henry-deriv · Nov 15, 2018 · 6e933b3 · 6e933b3
2 parents 28b1308 + e70d7af
commit 6e933b3
Show file tree

Hide file tree

Showing 3 changed files with 61 additions and 58 deletions.
diff --git a/src/sass/static/pages.scss b/src/sass/static/pages.scss
@@ -484,6 +484,48 @@ body #_elev_io {
             margin-top: 0;
         }
     }
+    &.cyberjaya-content, &.careers-content {
+        .box-container {
+            &.padding {
+                padding: 5px 15px;
+            }
+            > [class*='gr-padding'] {
+                padding-bottom: 0;
+
+                @media (max-width: 768px) {
+                    padding-bottom: unset;
+                }
+            }
+            .box {
+                background: $COLOR_WHITE;
+
+                &.bordered {
+                    border: 1px solid $COLOR_GRAY;
+                    height: 100%;
+                }
+                .items {
+                    display: flex;
+                    flex-direction: column;
+                    align-items: center;
+
+                    img {
+                        padding-top: 20px;
+                        width: 50px;
+                    }
+                    p {
+                        font-weight: 600;
+                        color: $COLOR_BLUE;
+                    }
+                    > .box-item-end {
+                        padding: 0 30px;
+                    }
+                    @media (max-width: 768px) {
+                        justify-content: center;
+                    }
+                }
+            }
+        }
+    }
 }
 
 .location {
@@ -945,51 +987,6 @@ body #not_authenticated_financial ul.checked > li {
                 margin-bottom: 2.5rem;
             }
         }
-        .box-container {
-            &.padding {
-                padding: 5px 15px;
-
-                &-20-m {
-                    @media (max-width: 768px) {
-                        padding-top: 20px;
-                        padding-bottom: 20px;
-                    }
-                }
-            }
-            > [class*='gr-padding'] {
-                padding-bottom: 0;
-
-                @media (max-width: 768px) {
-                    padding-bottom: unset;
-                }
-            }
-            .box {
-                &.bordered {
-                    border: 1px solid $COLOR_GRAY;
-                    height: 100%;
-                }
-                .items {
-                    display: flex;
-                    flex-direction: column;
-                    align-items: center;
-
-                    img {
-                        padding-top: 20px;
-                        width: 50px;
-                    }
-                    p {
-                        font-weight: 600;
-                        color: $COLOR_BLUE;
-                    }
-                    > .box-item-end {
-                        padding: 0 30px;
-                    }
-                    @media (max-width: 768px) {
-                        justify-content: center;
-                    }
-                }
-            }
-        }
         h4 {
             color: $COLOR_BLUE;
         }

diff --git a/src/templates/static/about/careers.jsx b/src/templates/static/about/careers.jsx
@@ -155,45 +155,37 @@ const Careers = () => {
             <div className='container'>
                 <div className='gr-row gr-padding-30'>
                     <Box
-                        gr='gr-4 gr-6-p'
+                        gr='gr-3 gr-6-p'
                         padding='20'
                         icon='images/pages/careers/tb-icon.svg'
                         href='https://tech.binary.com'
                         text={it.L('Read the [_1] tech blog', it.website_name)}
                         target='_blank'
                     />
                     <Box
-                        gr='gr-4 gr-6-p'
+                        gr='gr-3 gr-6-p'
                         padding='20'
                         icon='images/pages/careers/bb-icon.svg'
                         href='https://blog.binary.com'
                         text={it.L('Read the [_1] company blog', it.website_name)}
                         target='_blank'
                     />
                     <Box
-                        gr='gr-4 gr-6-p'
+                        gr='gr-3 gr-6-p'
                         padding='20'
                         icon='images/pages/careers/cc-icon.svg'
                         href='https://my.wobb.co/users/companies/binary-group-services-sdn-bhd'
                         text={it.L('Learn more about our corporate culture')}
                         target='_blank'
                     />
                     <Box
-                        gr='gr-6 gr-6-p padding-20-m'
+                        gr='gr-3 gr-6-p'
+                        padding='20'
                         icon='images/pages/careers/eh-icon.svg'
                         href={it.url_for('download/binary-employee-handbook.pdf')}
-                        download
                         text={it.L('Employee handbook')}
                         target='_blank'
                     />
-                    <Box
-                        gr='gr-6 gr-12-p padding-20-m'
-                        icon='images/pages/careers/ex-icon.svg'
-                        href={it.url_for('download/binary-expat-handbook.pdf')}
-                        download
-                        text={it.L('Expat handbook')}
-                        target='_blank'
-                    />
                 </div>
             </div>
 

diff --git a/src/templates/static/about/cyberjaya.jsx b/src/templates/static/about/cyberjaya.jsx
@@ -47,6 +47,20 @@ const Cyberjaya = () =>  (
                             ]}
                         />
                     </div>
+                    <div className='gr-4 gr-6-p padding-20-m gr-8-m box-container gr-centered'>
+                        <div className='box bordered'>
+                            <a href={it.url_for('download/binary-expat-handbook.pdf')} target='_blank' rel='noopener noreferrer'>
+                                <div className='items'>
+                                    <div>
+                                        <img src={it.url_for('/images/pages/careers/ex-icon.svg')} />
+                                    </div>
+                                    <div className='box-item-end'>
+                                        <p className='center-text'>{it.L('Expat handbook')}</p>
+                                    </div>
+                                </div>
+                            </a>
+                        </div>
+                    </div>
                 </div>
             </div>
         </div>