Merge pull request #469 from Ojas-Arora/test

MultiLanguage Facility
PranavBarthwal · Jul 31, 2024 · d883f80 · d883f80
2 parents 6bc09a5 + 1f36676
commit d883f80
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 6 deletions.
diff --git a/src/components/Footer/Footer.jsx b/src/components/Footer/Footer.jsx
@@ -1,8 +1,34 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import img from '../../assets/logo_white.png';
 
 function Footer() {
  const currentYear = new Date().getFullYear();
+
+ useEffect(() => {
+ const script = document.createElement('script');
+ script.type = 'text/javascript';
+ script.src = 'https://translate.google.com/translate_a/element.js?cb=loadGoogleTranslate';
+ script.onerror = function () {
+ console.error('Error loading Google Translate script');
+ };
+ document.body.appendChild(script);
+
+ window.loadGoogleTranslate = function () {
+ new window.google.translate.TranslateElement(
+ {
+ pageLanguage: 'en',
+ includedLanguages: 'en,hi,pa,sa,mr,ur,bn,es,fr,de,it',
+ layout: window.google.translate.TranslateElement.InlineLayout.SIMPLE,
+ },
+ 'google_element'
+ );
+ };
+
+ return () => {
+ document.body.removeChild(script);
+ };
+ }, []);
+
  return (
  <div className="container">
  <footer className="d-flex flex-wrap justify-content-between align-items-center py-3 my-4 border-top">
@@ -12,7 +38,7 @@ function Footer() {
  <p className="col-md-4 mb-0 text-light text-center">©️ {currentYear} CosmoXplore India, Inc. All Rights Reserved</p>
  <div className="col-md-4 d-flex justify-content-center">
  <a href="https://github.com/PranavBarthwal" className="text-light me-4">
- <i className="fab fa-github"></i>
+  <i className="fab fa-github"></i>
  </a>
  <a href="https://x.com/pranavbarthwal_" className="text-light me-4">
  <i className="fab fa-x-twitter"></i>
@@ -24,6 +50,7 @@ function Footer() {
  <i className="fab fa-linkedin-in"></i>
  </a>
  </div>
+ <div id="google_element" className="col-12 text-center mt-3"></div>
  </footer>
  </div>
  );

diff --git a/src/components/Hero/Hero.jsx b/src/components/Hero/Hero.jsx
@@ -1,7 +1,6 @@
 import React, { useEffect } from 'react';
 import Typed from 'typed.js';
-import Earth from '../3D_Models/Earth/Earth.jsx'
-import Styles from './Hero.module.css'
+import Earth from '../3D_Models/Earth/Earth.jsx';
 
 function Hero() {
  useEffect(() => {
@@ -22,7 +21,7 @@ function Hero() {
  return (
  <div className="container col-xxl-9 px-3 py-5 override-display">
  <div className="row flex-lg-row-reverse align-items-center g-5 py-5">
- <div className="col-10 col-sm-8 col-lg-6 flex justify-center " id={Styles['earth']}>
+ <div className="col-10 col-sm-8 col-lg-6 flex justify-center" id="earth">
  <Earth />
  </div>
  <div className="col-lg-6">
@@ -39,4 +38,4 @@ function Hero() {
  );
 }
 
-export default Hero;
+export default Hero;
diff --git a/src/components/Hero/Hero.module.css b/src/components/Hero/Hero.module.css
@@ -5,4 +5,5 @@
  margin: 0;
  margin-top: 5%;
  }
+
 }