colin
/
camera-trng
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Slim nav down to Portfolio, TRNG, and Tools 

Replace the full dropdown nav with three simple links: Portfolio
(colinknapp.com), TRNG (/), and Tools (/tools). Removed all
unused dropdown CSS from both pages.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Leopere 2026-02-08 16:59:31 -05:00
parent 8f06c6c381
commit b082f6df5a
Signed by: colin
SSH Key Fingerprint: SHA256:nRPCQTeMFLdGytxRQmPVK9VXY3/ePKQ5lGRyJhT5DY8
2 changed files with 8 additions and 98 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
src/index.html
View File

@ -84,17 +84,6 @@
font-weight: 500; border-radius: 4px; transition: background-color 0.3s, color 0.3s; font-weight: 500; border-radius: 4px; transition: background-color 0.3s, color 0.3s;
} }
.main-nav a:hover { background-color: var(--theme-hover); color: var(--accent-color); } .main-nav a:hover { background-color: var(--theme-hover); color: var(--accent-color); }
.main-nav .dropdown > a::after { content: "▼"; font-size: 0.7em; margin-left: 0.5em; }
.main-nav .dropdown-content {
display: none; position: absolute; top: 100%; left: 0; background-color: var(--theme-bg);
min-width: 200px; box-shadow: 0 8px 16px rgba(0,0,0,0.15); z-index: 1000;
border-radius: 4px; padding: 0.5rem 0; margin-top: 0.25rem;
}
.main-nav .dropdown:hover .dropdown-content { display: block; }
.main-nav .dropdown-content a {
padding: 0.5rem 1rem; display: block; white-space: nowrap; border-radius: 0;
}
.nav-story-tbd { opacity: 0.6; }
.theme-switch { position: fixed; top: 20px; right: 20px; z-index: 1000; } .theme-switch { position: fixed; top: 20px; right: 20px; z-index: 1000; }
.theme-switch button { .theme-switch button {
background: var(--theme-bg); border: 1px solid var(--border-color); font-size: 1.5em; background: var(--theme-bg); border: 1px solid var(--border-color); font-size: 1.5em;
@ -175,7 +164,6 @@
body { padding: 10px; } h1 { font-size: 1.75em; } body { padding: 10px; } h1 { font-size: 1.75em; }
.main-nav ul { flex-direction: column; gap: 0.5rem; } .main-nav ul { flex-direction: column; gap: 0.5rem; }
.main-nav a { text-align: center; } .main-nav a { text-align: center; }
.main-nav .dropdown-content { position: static; box-shadow: none; }
.controls { flex-direction: column; } .controls { flex-direction: column; }
.code-tabs { flex-wrap: wrap; } .code-tabs { flex-wrap: wrap; }
} }
@ -322,46 +310,9 @@
<nav class="main-nav"> <nav class="main-nav">
<ul> <ul>
<li><a href="https://colinknapp.com/" id="nav-portfolio">Portfolio</a></li> <li><a href="https://colinknapp.com/">Portfolio</a></li>
<li class="dropdown"> <li><a href="/">TRNG</a></li>
<a href="https://colinknapp.com/resumes/" id="nav-resumes">Resumes</a> <li><a href="/tools">Tools</a></li>
<div class="dropdown-content">
<a href="https://colinknapp.com/resumes/business-development.html">Business Development</a>
<a href="https://colinknapp.com/resumes/devsecops.html">DevSecOps</a>
<a href="https://colinknapp.com/resumes/team-leadership.html">Team Leadership</a>
<a href="https://colinknapp.com/resumes/tool-building.html">Tool Building</a>
</div>
</li>
<li class="dropdown">
<a href="https://colinknapp.com/stories/" id="nav-stories">Stories</a>
<div class="dropdown-content">
<a href="https://colinknapp.com/stories/app-development.html">App Development</a>
<a href="https://colinknapp.com/stories/athion-turnaround.html">Athion Turnaround</a>
<a href="https://colinknapp.com/stories/home-infrastructure.html">Home Infrastructure</a>
<a href="https://colinknapp.com/stories/motherboard-repair.html">Motherboard Repair</a>
<a href="https://colinknapp.com/stories/nuclear-dns.html">Nuclear Dns</a>
<a href="https://colinknapp.com/stories/open-source-success.html">Open Source Success</a>
<a href="https://colinknapp.com/stories/scansnap-webdav.html">Scansnap Webdav</a>
<a href="https://colinknapp.com/stories/showerloop.html">Showerloop</a>
<a href="https://colinknapp.com/stories/well-known-mcp.html">.well-known MCP</a>
<a href="https://colinknapp.com/stories/web-design-java.html">Web Design Java</a>
<a href="https://colinknapp.com/stories/youtube-game-dev.html">Youtube Game Dev</a>
</div>
</li>
<li class="dropdown">
<a href="https://colinknapp.com/one-pager-tools/csv-tool.html" id="nav-tools">Tools</a>
<div class="dropdown-content">
<a href="https://colinknapp.com/website-questionnaire/">Website Questionnaire</a>
<a href="https://colinknapp.com/rich-snippets/">Rich Snippets Generator</a>
<a href="https://colinknapp.com/one-pager-tools/csv-tool.html">CSV Tool</a>
<a href="https://colinknapp.com/one-pager-tools/utm-tool.html">UTM Builder</a>
<a href="https://md.colinknapp.com" target="_blank" rel="noopener">Markdown Tool</a>
<a href="https://nix.colinknapp.com" target="_blank" rel="noopener">NixOS Validator</a>
<a href="https://qr.colinknapp.com" target="_blank" rel="noopener">QR Code Tool</a>
<a href="https://ai-live.colinknapp.com" target="_blank" rel="noopener">AI Live ISO</a>
</div>
</li>
<li><a href="https://meet.colinknapp.com" target="_blank" rel="noopener" title="No-account web meetings">Meet</a></li>
</ul> </ul>
</nav> </nav>

51
src/tools.html
View File

@ -24,10 +24,6 @@
.main-nav li { margin: 0; padding: 0; position: relative; } .main-nav li { margin: 0; padding: 0; position: relative; }
.main-nav a { display: block; padding: 0.5rem 1rem; text-decoration: none; color: var(--text-color); font-weight: 500; border-radius: 4px; transition: background-color 0.3s, color 0.3s; } .main-nav a { display: block; padding: 0.5rem 1rem; text-decoration: none; color: var(--text-color); font-weight: 500; border-radius: 4px; transition: background-color 0.3s, color 0.3s; }
.main-nav a:hover { background-color: var(--theme-hover); color: var(--accent-color); } .main-nav a:hover { background-color: var(--theme-hover); color: var(--accent-color); }
.main-nav .dropdown > a::after { content: "\25BC"; font-size: 0.7em; margin-left: 0.5em; }
.main-nav .dropdown-content { display: none; position: absolute; top: 100%; left: 0; background-color: var(--theme-bg); min-width: 200px; box-shadow: 0 8px 16px rgba(0,0,0,0.15); z-index: 1000; border-radius: 4px; padding: 0.5rem 0; margin-top: 0.25rem; }
.main-nav .dropdown:hover .dropdown-content { display: block; }
.main-nav .dropdown-content a { padding: 0.5rem 1rem; display: block; white-space: nowrap; border-radius: 0; }
.theme-switch { position: fixed; top: 20px; right: 20px; z-index: 1000; } .theme-switch { position: fixed; top: 20px; right: 20px; z-index: 1000; }
.theme-switch button { background: var(--theme-bg); border: 1px solid var(--border-color); font-size: 1.5em; cursor: pointer; padding: 8px 12px; border-radius: 8px; transition: background-color 0.3s; } .theme-switch button { background: var(--theme-bg); border: 1px solid var(--border-color); font-size: 1.5em; cursor: pointer; padding: 8px 12px; border-radius: 8px; transition: background-color 0.3s; }
.theme-switch button:hover { background-color: var(--theme-hover); } .theme-switch button:hover { background-color: var(--theme-hover); }
@ -87,7 +83,7 @@
.modal-content .cta-button { display: block; width: 100%; padding: 0.75rem 1.5rem; background: var(--accent-color); color: white; border: none; border-radius: 4px; font-size: 1rem; font-weight: 500; cursor: pointer; transition: background 0.2s; font-family: 'Montserrat', sans-serif; } .modal-content .cta-button { display: block; width: 100%; padding: 0.75rem 1.5rem; background: var(--accent-color); color: white; border: none; border-radius: 4px; font-size: 1rem; font-weight: 500; cursor: pointer; transition: background 0.2s; font-family: 'Montserrat', sans-serif; }
.modal-content .cta-button:hover { background: var(--hover-color); } .modal-content .cta-button:hover { background: var(--hover-color); }
.modal-content .cta-button:disabled { opacity: 0.6; cursor: not-allowed; } .modal-content .cta-button:disabled { opacity: 0.6; cursor: not-allowed; }
@media (max-width: 600px) { body { padding: 10px; } h1 { font-size: 1.75em; } .main-nav ul { flex-direction: column; gap: 0.5rem; } .main-nav a { text-align: center; } .main-nav .dropdown-content { position: static; box-shadow: none; } .controls { flex-direction: column; } } @media (max-width: 600px) { body { padding: 10px; } h1 { font-size: 1.75em; } .main-nav ul { flex-direction: column; gap: 0.5rem; } .main-nav a { text-align: center; } .controls { flex-direction: column; } }
@media (max-width: 480px) { .modal-content { padding: 1.5rem; } } @media (max-width: 480px) { .modal-content { padding: 1.5rem; } }
</style> </style>
<script> <script>
@ -115,52 +111,15 @@
<nav class="main-nav"> <nav class="main-nav">
<ul> <ul>
<li><a href="https://colinknapp.com/" id="nav-portfolio">Portfolio</a></li> <li><a href="https://colinknapp.com/">Portfolio</a></li>
<li class="dropdown"> <li><a href="/">TRNG</a></li>
<a href="https://colinknapp.com/resumes/" id="nav-resumes">Resumes</a> <li><a href="/tools">Tools</a></li>
<div class="dropdown-content">
<a href="https://colinknapp.com/resumes/business-development.html">Business Development</a>
<a href="https://colinknapp.com/resumes/devsecops.html">DevSecOps</a>
<a href="https://colinknapp.com/resumes/team-leadership.html">Team Leadership</a>
<a href="https://colinknapp.com/resumes/tool-building.html">Tool Building</a>
</div>
</li>
<li class="dropdown">
<a href="https://colinknapp.com/stories/" id="nav-stories">Stories</a>
<div class="dropdown-content">
<a href="https://colinknapp.com/stories/app-development.html">App Development</a>
<a href="https://colinknapp.com/stories/athion-turnaround.html">Athion Turnaround</a>
<a href="https://colinknapp.com/stories/home-infrastructure.html">Home Infrastructure</a>
<a href="https://colinknapp.com/stories/motherboard-repair.html">Motherboard Repair</a>
<a href="https://colinknapp.com/stories/nuclear-dns.html">Nuclear Dns</a>
<a href="https://colinknapp.com/stories/open-source-success.html">Open Source Success</a>
<a href="https://colinknapp.com/stories/scansnap-webdav.html">Scansnap Webdav</a>
<a href="https://colinknapp.com/stories/showerloop.html">Showerloop</a>
<a href="https://colinknapp.com/stories/well-known-mcp.html">.well-known MCP</a>
<a href="https://colinknapp.com/stories/web-design-java.html">Web Design Java</a>
<a href="https://colinknapp.com/stories/youtube-game-dev.html">Youtube Game Dev</a>
</div>
</li>
<li class="dropdown">
<a href="https://colinknapp.com/one-pager-tools/csv-tool.html" id="nav-tools">Tools</a>
<div class="dropdown-content">
<a href="https://colinknapp.com/website-questionnaire/">Website Questionnaire</a>
<a href="https://colinknapp.com/rich-snippets/">Rich Snippets Generator</a>
<a href="https://colinknapp.com/one-pager-tools/csv-tool.html">CSV Tool</a>
<a href="https://colinknapp.com/one-pager-tools/utm-tool.html">UTM Builder</a>
<a href="https://md.colinknapp.com" target="_blank" rel="noopener">Markdown Tool</a>
<a href="https://nix.colinknapp.com" target="_blank" rel="noopener">NixOS Validator</a>
<a href="https://qr.colinknapp.com" target="_blank" rel="noopener">QR Code Tool</a>
<a href="https://ai-live.colinknapp.com" target="_blank" rel="noopener">AI Live ISO</a>
</div>
</li>
<li><a href="https://meet.colinknapp.com" target="_blank" rel="noopener" title="No-account web meetings">Meet</a></li>
</ul> </ul>
</nav> </nav>
<main id="main-content"> <main id="main-content">
<h1>Quantum Random Tools</h1> <h1>Quantum Random Tools</h1>
<p class="subtitle">Dice, passwords, coin flips, and a Magic 8 Ball &mdash; all from quantum camera noise. <a href="/" style="font-style:normal;">Back to Camera TRNG &rarr;</a></p> <p class="subtitle">Dice, passwords, coin flips, and a Magic 8 Ball &mdash; all from quantum camera noise.</p>
<div class="card"> <div class="card">
<h3>Quantum Dice</h3> <h3>Quantum Dice</h3>