160 lines
4.6 KiB
HTML
160 lines
4.6 KiB
HTML
|
|
<!DOCTYPE html>
|
|
<html lang="es">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Ecuaciones LaTeX - PyWebView</title>
|
|
|
|
<!-- MathJax 3 configuración optimizada para pywebview -->
|
|
<script>
|
|
window.MathJax = {
|
|
tex: {
|
|
inlineMath: [['$', '$']],
|
|
displayMath: [['$$', '$$']],
|
|
processEscapes: true
|
|
},
|
|
options: {
|
|
skipHtmlTags: ['script', 'noscript', 'style', 'textarea', 'pre']
|
|
},
|
|
startup: {
|
|
ready: function () {
|
|
console.log('🚀 [pywebview] Iniciando MathJax...');
|
|
MathJax.startup.defaultReady();
|
|
console.log('✅ [pywebview] MathJax listo');
|
|
|
|
// Auto-renderizar después de carga
|
|
setTimeout(function() {
|
|
if (MathJax.typesetPromise) {
|
|
MathJax.typesetPromise().then(function() {
|
|
console.log('🎉 [pywebview] Renderizado automático completado');
|
|
}).catch(function(err) {
|
|
console.log('❌ [pywebview] Error en renderizado:', err);
|
|
});
|
|
}
|
|
}, 500);
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<!-- MathJax 3 CDN -->
|
|
<script async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js"></script>
|
|
|
|
<style>
|
|
body {
|
|
background-color: #1a1a1a;
|
|
color: #d4d4d4;
|
|
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
|
font-size: 13px;
|
|
margin: 0;
|
|
padding: 8px;
|
|
line-height: 1.4;
|
|
}
|
|
|
|
.equation-block {
|
|
margin: 4px 0;
|
|
padding: 8px 10px;
|
|
background-color: #2d2d2d;
|
|
border-left: 3px solid #80c7f7;
|
|
border-radius: 4px;
|
|
word-wrap: break-word;
|
|
transition: background-color 0.2s ease;
|
|
}
|
|
|
|
.equation-block:hover {
|
|
background-color: #3a3a3a;
|
|
}
|
|
|
|
.equation-content {
|
|
font-size: 14px;
|
|
color: #ffffff;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
.math-display {
|
|
font-size: 15px;
|
|
text-align: left;
|
|
margin: 2px 0;
|
|
padding: 4px;
|
|
background-color: #252525;
|
|
border-radius: 3px;
|
|
min-height: 20px;
|
|
}
|
|
|
|
/* Tipos de ecuaciones */
|
|
.assignment { border-left-color: #dcdcaa; }
|
|
.equation { border-left-color: #c586c0; }
|
|
.comment { border-left-color: #6a9955; font-style: italic; }
|
|
.symbolic { border-left-color: #9cdcfe; }
|
|
|
|
.info-message {
|
|
text-align: center;
|
|
color: #80c7f7;
|
|
font-style: italic;
|
|
margin: 20px;
|
|
padding: 15px;
|
|
border: 1px dashed #80c7f7;
|
|
border-radius: 8px;
|
|
font-size: 14px;
|
|
background-color: #2d2d2d;
|
|
}
|
|
|
|
.status {
|
|
font-size: 11px;
|
|
color: #808080;
|
|
text-align: center;
|
|
margin-top: 10px;
|
|
padding: 5px;
|
|
}
|
|
|
|
/* Animación suave */
|
|
.equation-block {
|
|
animation: fadeIn 0.3s ease-in;
|
|
}
|
|
|
|
@keyframes fadeIn {
|
|
from { opacity: 0; transform: translateY(-5px); }
|
|
to { opacity: 1; transform: translateY(0); }
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="equations-container">\n
|
|
<div class="equation-block assignment">
|
|
<div class="equation-content">
|
|
<div class="math-display">$$72$$</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="equation-block assignment">
|
|
<div class="equation-content">
|
|
<div class="math-display">$$36$$</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="equation-block symbolic">
|
|
<div class="equation-content">
|
|
<div class="math-display">$$2592$$</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="equation-block assignment">
|
|
<div class="equation-content">
|
|
<div class="math-display">$$\frac{\sqrt{8 y - 25}}{e}$$</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="equation-block symbolic">
|
|
<div class="equation-content">
|
|
<div class="math-display">$$t = \frac{\sqrt{8 y - 25}}{e}$$</div>
|
|
</div>
|
|
</div>\n</div>
|
|
</div>
|
|
|
|
<div class="status" id="status">
|
|
✓ PyWebView activo - MathJax cargándose...
|
|
</div>
|
|
</body>
|
|
</html>
|
|
|