Spaces:
Running
Running
File size: 5,174 Bytes
b8ae68d | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 | <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>COBOL β Python Translator</title>
<style>
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Segoe UI', system-ui, sans-serif; background: #0f1117; color: #e0e0e0; padding: 2rem; }
h1 { font-size: 1.6rem; color: #fff; margin-bottom: 0.4rem; }
.subtitle { color: #888; font-size: 0.9rem; margin-bottom: 2rem; }
.badge { display: inline-block; background: #1e293b; border: 1px solid #334; color: #94a3b8; font-size: 0.75rem; padding: 2px 8px; border-radius: 4px; margin-right: 6px; }
.examples { display: flex; flex-direction: column; gap: 1.5rem; max-width: 860px; margin: 0 auto; }
.card { background: #1a1d27; border: 1px solid #2a2d3a; border-radius: 10px; overflow: hidden; }
.card-header { padding: 0.75rem 1rem; background: #13151f; font-size: 0.8rem; color: #666; border-bottom: 1px solid #2a2d3a; }
.split { display: grid; grid-template-columns: 1fr 1fr; }
.pane { padding: 1rem; }
.pane:first-child { border-right: 1px solid #2a2d3a; }
.lang { font-size: 0.7rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 0.5rem; }
.cobol-label { color: #f59e0b; }
.python-label { color: #34d399; }
pre { font-family: 'Fira Code', 'Consolas', monospace; font-size: 0.82rem; line-height: 1.6; white-space: pre-wrap; }
.cobol { color: #fcd34d; }
.python { color: #6ee7b7; }
.stats { display: flex; gap: 2rem; justify-content: center; margin: 0 auto 2rem; max-width: 860px; }
.stat { text-align: center; }
.stat-val { font-size: 1.4rem; font-weight: 700; color: #fff; }
.stat-label { font-size: 0.75rem; color: #666; margin-top: 2px; }
.links { text-align: center; margin-top: 2rem; }
.links a { color: #818cf8; text-decoration: none; margin: 0 1rem; font-size: 0.9rem; }
.links a:hover { text-decoration: underline; }
@media(max-width: 600px) { .split { grid-template-columns: 1fr; } .pane:first-child { border-right: none; border-bottom: 1px solid #2a2d3a; } }
</style>
</head>
<body>
<div style="max-width:860px;margin:0 auto">
<h1>COBOL β Python Translator</h1>
<p class="subtitle">
<span class="badge">Qwen2.5-Coder-1.5B</span>
<span class="badge">QLoRA Β· Unsloth</span>
<span class="badge">Training loss 2.14 β 0.13</span>
</p>
<div class="stats">
<div class="stat"><div class="stat-val">1.5B</div><div class="stat-label">Parameters</div></div>
<div class="stat"><div class="stat-val">125</div><div class="stat-label">Training steps</div></div>
<div class="stat"><div class="stat-val">0.13</div><div class="stat-label">Final loss</div></div>
<div class="stat"><div class="stat-val">94%</div><div class="stat-label">Loss reduction</div></div>
</div>
<div class="examples">
<div class="card">
<div class="card-header">Example 1 β Arithmetic computation</div>
<div class="split">
<div class="pane">
<div class="lang cobol-label">COBOL</div>
<pre class="cobol">COMPUTE WS-TAX = WS-PRICE * WS-TAX-RATE</pre>
</div>
<div class="pane">
<div class="lang python-label">Python</div>
<pre class="python">from decimal import Decimal
ws_tax = Decimal(str(ws_price)) * Decimal(str(ws_tax_rate))</pre>
</div>
</div>
</div>
<div class="card">
<div class="card-header">Example 2 β String move</div>
<div class="split">
<div class="pane">
<div class="lang cobol-label">COBOL</div>
<pre class="cobol">MOVE WS-CUSTOMER-NAME TO WS-OUTPUT-NAME</pre>
</div>
<div class="pane">
<div class="lang python-label">Python</div>
<pre class="python">ws_output_name = ws_customer_name</pre>
</div>
</div>
</div>
<div class="card">
<div class="card-header">Example 3 β Conditional logic</div>
<div class="split">
<div class="pane">
<div class="lang cobol-label">COBOL</div>
<pre class="cobol">IF WS-BALANCE > ZERO
PERFORM CREDIT-ROUTINE
END-IF</pre>
</div>
<div class="pane">
<div class="lang python-label">Python</div>
<pre class="python">if ws_balance > 0:
credit_routine()</pre>
</div>
</div>
</div>
<div class="card">
<div class="card-header">Example 4 β Loop</div>
<div class="split">
<div class="pane">
<div class="lang cobol-label">COBOL</div>
<pre class="cobol">PERFORM VARYING WS-IDX FROM 1 BY 1
UNTIL WS-IDX > WS-MAX
ADD 1 TO WS-TOTAL
END-PERFORM</pre>
</div>
<div class="pane">
<div class="lang python-label">Python</div>
<pre class="python">for ws_idx in range(1, ws_max + 1):
ws_total += 1</pre>
</div>
</div>
</div>
</div>
<div class="links">
<a href="https://huggingface.co/dishants0605/qwen2.5-cobol-python-translator">Model on HuggingFace</a>
<a href="https://github.com/dishantSasane/Cobol-Python-Fine-Tuning">GitHub</a>
</div>
</div>
</body>
</html> |