JSFiddle - React, Tailwind, and code Playground

by yassinezerguine

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-i18next/0.0.14/i18next-jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/i18next/2.0.22/i18next.min.js"></script>
<body>
<a href="#" class="lang-select">en</a>
<a href="#" class="lang-select">de</a>
<a href="#" class="lang-select">fr</a>
<h2 id="head_h2" data-i18n="header">Send up to 20 GB</h2>
		<input type="button" id="senditbutton" value="sendit" data-i18n="[value]senditbutton" style="width: 100px">
		<a href="#" id="btn_add_re" data-i18n="btn_add_re">+ add recipients</a>
<br><br>
<label id="info_link" data-i18n="[html]info_link">
			We will give you a download link <br>
			once your transfer is complete.<br>
			The file(s) will be kept for 7 days.<br>
		</label>
    <br>
  <a href="#" data-i18n="page1"></a>
  <a href="#" data-i18n="page2"></a>
  <a href="#" data-i18n="page3"></a>
  <table id="chooselanguagetable1">
	<tr>
	<td id="eng"> <input type="radio" name="radio" value="check_eng" > English </td> 
	<td id="fr"> <input type="radio" name="radio" value="check_fr" > Francais </td> </tr>
	<tr>
	<td id="ch"> <input type="radio"  name="radio" value="check_ch" > chinesse  </td>
	<td id="es"> <input type="radio"  name="radio" value="check_es" > Espanol </td> </tr>
	</table>
</body>

JavaScript

i18next.init({
  lng: 'eng',
  resources: {
  eng: {
  translation: {
	head_h2: 'Send up to 2GB',
	get_file: '+ Add File(s)',
	btn_add_re: '+ add recipient(s)',
	btn_add_send: 'Your Email',
	info_link: 'We will give you a download link <br> once your transfer is complete.<br> The file(s) will be kept for 7 days.<br>',
	transfert_btn: 'Send',
	annuler: 'Cancel',
	choose_email: 'Email',
	choose_link: 'Link',
	transfert_link: 'Send',
	senditmenubutton1: 'Change Language',
	senditmenubutton2: 'About SendIt',
	senditmenubutton3: 'How it works',
	senditmenubutton4: 'Questions',
	senditmenubutton5: 'About Plus',
	senditmenubutton6: 'Contact Us',
	senditpluslabel2: 'No account yet? see what <a href="" id="plus">Plus</a> has to offer.',
	senditplusinput1: '  Email',
	senditplusinput2: '  Password',
	senditplushref: 'Forgot your password?',
	senditplusremember: 'Remember Me',
	senditplusbutton: 'Sign In',
	senditmenu2button0: 'Login to Plus',
	img: 'Oops! Something wrong with your connection',
	senditpluslabel22: 'See what else <a href="" id="plus">Plus</a> has to offer.',
	senditplus2button: 'Get Plus',
	chooselanguagelabel1: 'Choose Your Language',
	h3: "We're Ready...",
	p: {
		label1: 'and ',
		label2: 'other files, '
		
	},
	Download: 'Download',
	h5: {
		label1:"We're Sorry but the files you want to download they are no longer available<br>you can increase your delay storing by choosing the ",
		label2: 'Account and enjoy more features '
	},
	redirect: 'Return'

	
      
    }
  },
  
  
  
  
fr: {
translation: {
	head_h2: "Envoyer jusqu'à 2 Go",
	get_file: '+ Ajouter de(s) fichier(s)',
	btn_add_re: '+ Ajouter le(s) destinataire(s)',
	btn_add_send: 'Votre Email',
	info_link: 'une fois votre transfert est terminé <br> Nous vous donnerons un lien de téléchargement. <br> Les fichiers seront conservés pendant 7 jours.<br>',
	transfert_btn: 'Envoyer',
	annuler: 'Annuler',
	choose_email: 'Email',
	choose_link: 'Lien',
	transfert_link: 'Envoyer',
	senditmenubutton1:...