DouglasdeMoura/latex-to-word.html

## latex-to-word.html
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>LaTeX para Word</title>
<meta name="description" content="Escreva em LaTeX e copie diretamente para o Word!">
<link href="https://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.3/normalize.min.css" rel="stylesheet">
<link rel='stylesheet' id='genericons-css' href='http://engenharialivre.com/wp-content/plugins/jetpack/_inc/genericons/genericons/genericons.css?ver=3.1' type='text/css' media='all'/>
<link rel='stylesheet' id='eng-fonts-css' href='https://fonts.googleapis.com/css?family=Fira+Sans%3A500%2C300italic%2C300%2C700italic%2C700%7COpen+Sans%3A300%2C300italic%2C700%2C700italic&#038;ver=4.3' type='text/css' media='all'/>
<style type="text/css">
* {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
body {
	background: #ECECEC;
	color: #6C6C6C;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
}
a {
	color: #1F8DD6;
	text-decoration: none;
}
a:hover {
    text-decoration: underline;
}
h1, h2, h3 {
	font-weight: 300;
}
#page,
.site-header {
	max-width: 800px;
	margin: auto;
}
.site-header {
	background: #5EB95E;
	color: #fff;
	height: 56px;
	font-family: 'Fira Sans', sans-serif;
}
.site-header a {
	color: #fff;
	display: block;
}
.site-header a:hover {
	text-decoration: none;
}
#page {
	background: #fff;
	padding: 15px;
}
.site-title {
    text-align: center;
    margin: 0px;
    line-height: 56px;
    font-size: 2em;
}
.site-title strong {
    font-weight: 500;
}
.site-title .genericon {
    font-size: 20px;
    line-height: 32px;
}
textarea {
	background: #F6F6F6;
	border: 1px solid #CCC;
	color: #333;
	font-style: monospace;
	padding: 7px;
	font-family: monospace;
	width: 100%;
}
button {
	border: 1px solid #5EB95E;
	background: #5EB95E;
	color: #fff;
	padding: 5px 10px;
	margin-top: 1em;
}
.button-container {
	text-align: right;
}
</style>
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
  showProcessingMessages: false,
  tex2jax: {
    inlineMath: [
	  ['$','$'],
      [ '\\(', '\\)' ]
    ]
  },
  extensions: ['toMathML.js']
});
</script>
<script src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML&locale=pt-br"></script>
<script>
var math = null;
MathJax.Hub.queue.Push(function () {
  math = MathJax.Hub.getAllJax('MathOutput')[0];
});
window.updateMathMl = function (math) {
  document.getElementById('output').value = '<?xml version="1.0"?>' + math.root.toMathML("");
};

window.UpdateMath = function (TeX) {
  MathJax.Hub.queue.Push(['Text', math, '\\displaystyle{' + TeX + '}'], [updateMathMl, math]);
};

function selectTextarea(element) {
  var text = document.getElementById(element).select();
}
</script>
</head>
<body>
<div class="site-header">
	<p class="site-title"><a href="http://engenharialivre.com" rel="home">Engenharia <strong>Livre</strong><i class="genericon genericon-cog"></i></a></p>
</div>
<div id="page">
	<header>
		<h1>$ \LaTeX $ para Word</h1>
		<h2>Escreva a matemática em $\LaTeX$ e copie direto para o Word</h2>
	</header>
	<hr>
	<main class="site-main">
	<p>Escreva aqui</p>
	<!-- f(a) = \frac{1}{2\pi i} \oint_\gamma \frac{f(z)}{z-a}\, dz -->
	<textarea id="MathInput" cols="60" rows="10" onkeyup="UpdateMath(this.value)"></textarea>
	<div id="MathOutput">
	<h3>Pré-visualização</h3>
	$${}$$
	</div>
	<hr>
	<br>
	<textarea id="output" cols="60" rows="10" readonly="readonly"></textarea>
	<br>
		<div class="button-container">
			<button onclick="selectTextarea('output')">Selecionar código</button>
		</div>
	</main>
	<footer>
	</footer>
</div>
</body>
</html>
	<!DOCTYPE HTML>
	<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>LaTeX para Word</title>
	<meta name="description" content="Escreva em LaTeX e copie diretamente para o Word!">
	<link href="https://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.3/normalize.min.css" rel="stylesheet">
	<link rel='stylesheet' id='genericons-css' href='http://engenharialivre.com/wp-content/plugins/jetpack/_inc/genericons/genericons/genericons.css?ver=3.1' type='text/css' media='all'/>
	<link rel='stylesheet' id='eng-fonts-css' href='https://fonts.googleapis.com/css?family=Fira+Sans%3A500%2C300italic%2C300%2C700italic%2C700%7COpen+Sans%3A300%2C300italic%2C700%2C700italic&ver=4.3' type='text/css' media='all'/>
	<style type="text/css">
	* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	}
	body {
	background: #ECECEC;
	color: #6C6C6C;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	}
	a {
	color: #1F8DD6;
	text-decoration: none;
	}
	a:hover {
	text-decoration: underline;
	}
	h1, h2, h3 {
	font-weight: 300;
	}
	#page,
	.site-header {
	max-width: 800px;
	margin: auto;
	}
	.site-header {
	background: #5EB95E;
	color: #fff;
	height: 56px;
	font-family: 'Fira Sans', sans-serif;
	}
	.site-header a {
	color: #fff;
	display: block;
	}
	.site-header a:hover {
	text-decoration: none;
	}
	#page {
	background: #fff;
	padding: 15px;
	}
	.site-title {
	text-align: center;
	margin: 0px;
	line-height: 56px;
	font-size: 2em;
	}
	.site-title strong {
	font-weight: 500;
	}
	.site-title .genericon {
	font-size: 20px;
	line-height: 32px;
	}
	textarea {
	background: #F6F6F6;
	border: 1px solid #CCC;
	color: #333;
	font-style: monospace;
	padding: 7px;
	font-family: monospace;
	width: 100%;
	}
	button {
	border: 1px solid #5EB95E;
	background: #5EB95E;
	color: #fff;
	padding: 5px 10px;
	margin-top: 1em;
	}
	.button-container {
	text-align: right;
	}
	</style>
	<script type="text/x-mathjax-config">
	MathJax.Hub.Config({
	showProcessingMessages: false,
	tex2jax: {
	inlineMath: [
	['$','$'],
	[ '\\(', '\\)' ]
	]
	},
	extensions: ['toMathML.js']
	});
	</script>
	<script src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML&locale=pt-br"></script>
	<script>
	var math = null;
	MathJax.Hub.queue.Push(function () {
	math = MathJax.Hub.getAllJax('MathOutput')[0];
	});
	window.updateMathMl = function (math) {
	document.getElementById('output').value = '<?xml version="1.0"?>' + math.root.toMathML("");
	};

	window.UpdateMath = function (TeX) {
	MathJax.Hub.queue.Push(['Text', math, '\\displaystyle{' + TeX + '}'], [updateMathMl, math]);
	};

	function selectTextarea(element) {
	var text = document.getElementById(element).select();
	}
	</script>
	</head>
	<body>
	<div class="site-header">
	<p class="site-title"><a href="http://engenharialivre.com" rel="home">Engenharia <strong>Livre</strong><i class="genericon genericon-cog"></i></a></p>
	</div>
	<div id="page">
	<header>
	<h1>$ \LaTeX $ para Word</h1>
	<h2>Escreva a matemática em $\LaTeX$ e copie direto para o Word</h2>
	</header>
	<hr>
	<main class="site-main">
	<p>Escreva aqui</p>
	<!-- f(a) = \frac{1}{2\pi i} \oint_\gamma \frac{f(z)}{z-a}\, dz -->
	<textarea id="MathInput" cols="60" rows="10" onkeyup="UpdateMath(this.value)"></textarea>
	<div id="MathOutput">
	<h3>Pré-visualização</h3>
	$${}$$
	</div>
	<hr>
	<br>
	<textarea id="output" cols="60" rows="10" readonly="readonly"></textarea>
	<br>
	<div class="button-container">
	<button onclick="selectTextarea('output')">Selecionar código</button>
	</div>
	</main>
	<footer>
	</footer>
	</div>
	</body>
	</html>