tools.html

<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Dev Tools — Python Pro Hub</title><link rel="stylesheet" href="style.css"></head><body><nav class="nav"><div class="container nav-inner"><a class="brand" href="index.html">PYTHON <span>PRO HUB</span></a><div class="nav-links"><a href="index.html">Home</a><a href="python.html">Python</a><a href="tools.html">Dev Tools</a><a href="games.html">Games</a><a href="portfolio.html">Portfolio</a><a href="about.html">About</a></div><button class="btn btn-secondary mobile-menu" data-menu>Menu</button></div></nav>
<header class="page-head"><div class="container"><span class="kicker">DEV TOOLS</span><h1>Small tools. <span class="accent">Big speed.</span></h1><p>Useful browser-only utilities for everyday coding and text work.</p></div></header><main class="section"><div class="container tools-grid"><section class="tool"><h3>JSON Formatter</h3><textarea id="jsonInput" class="field area" placeholder='{"name":"Python Pro","active":true}'></textarea><button class="btn btn-primary" id="formatJson">Format JSON</button><pre class="result" id="jsonResult"></pre></section><section class="tool"><h3>Text Counter</h3><textarea id="countText" class="field area" placeholder="Type or paste text..."></textarea><div class="result" id="countResult">Characters: 0 | Words: 0 | Lines: 1</div></section><section class="tool"><h3>Base64 Encode / Decode</h3><textarea id="base64Input" class="field area" placeholder="Text or Base64 value"></textarea><div class="actions"><button class="btn btn-blue" id="encodeBtn">Encode</button><button class="btn btn-secondary" id="decodeBtn">Decode</button></div><div class="result" id="base64Result"></div></section><section class="tool"><h3>Password Generator</h3><p class="section-lead">Creates a random 16-character password locally in your browser.</p><button class="btn btn-primary" id="genPass">Generate</button><div class="result" id="passResult">Click Generate.</div></section></div></main><footer class="footer"><div class="container footer-inner"><span>© <span data-year></span> Python Pro Hub</span><span>Tools run locally in your browser.</span></div></footer><script src="app.js"></script><script src="tools.js"></script></body></html>