Die Beide HTML-Dateien bestehen nur aus Html css und Javascript. Kann auch als "Page Source" von der Webseite kopiert werden.
Geprüfter Vibecode:
Liebhaber der Bash suchen gerne auch so Repositories und Gists
Last active
June 8, 2026 08:28
-
-
Save dewomser/c1e6d8fa4ee1c36f9bb1ff1b2ee822eb to your computer and use it in GitHub Desktop.
Meinen Github Account durchsuchen im Browser mit Formular
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html lang="de"> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <meta name="viewport" content="width=device-width,initial-scale=1" /> | |
| <title>Gist-Suche (dewomser)</title> | |
| <style> | |
| /* Einfache, neutrale Darstellung */ | |
| .gist-search { | |
| max-width: 420px; | |
| margin: 1rem auto; | |
| font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; | |
| } | |
| .search-type { | |
| display: flex; | |
| gap: 1.5rem; | |
| margin-bottom: 1rem; | |
| padding: .5rem 0; | |
| } | |
| .search-type label { | |
| display: flex; | |
| align-items: center; | |
| gap: .4rem; | |
| cursor: pointer; | |
| font-size: 0.95rem; | |
| } | |
| .search-type input[type="radio"] { | |
| cursor: pointer; | |
| width: 16px; | |
| height: 16px; | |
| } | |
| .gist-search form { | |
| display: flex; | |
| gap: .5rem; | |
| } | |
| .gist-search input[type="search"] { | |
| flex: 1; | |
| padding: .5rem .6rem; | |
| border: 1px solid #ccc; | |
| border-radius: 6px; | |
| font-size: 1rem; | |
| } | |
| .gist-search button { | |
| padding: .5rem .9rem; | |
| border: none; | |
| background: #2ea44f; | |
| color: white; | |
| border-radius: 6px; | |
| cursor: pointer; | |
| font-weight: 600; | |
| } | |
| .gist-search button:hover { filter: brightness(.95); } | |
| .note { font-size: .9rem; color: #555; margin-top: .5rem; } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="gist-search" aria-live="polite"> | |
| <!-- Radio buttons for search type selection --> | |
| <div class="search-type"> | |
| <label> | |
| <input type="radio" name="search-type" value="gist" checked aria-label="In Gists suchen" /> | |
| Gist | |
| </label> | |
| <label> | |
| <input type="radio" name="search-type" value="github" aria-label="In GitHub suchen" /> | |
| GitHub | |
| </label> | |
| </div> | |
| <form id="gist-search-form" action="https://gist.github.com/search" method="get" target="_blank" aria-label="Suche nach dewomser"> | |
| <!-- Sichtbares Eingabefeld für das Suchwort --> | |
| <label for="gist-term" class="visually-hidden">Suchwort</label> | |
| <input id="gist-term" name="gist-term" type="search" placeholder="Suchwort in meinen Gists..." autocomplete="off" aria-label="Suchwort" /> | |
| <button type="submit">Suchen</button> | |
| </form> | |
| <p class="note" id="note-text"> | |
| Das Formular öffnet die Ergebnisse in einem neuen Tab. (Suche wird an | |
| https://gist.github.com/search?q=%40dewomser+<Suchwort> gesendet) | |
| </p> | |
| </div> | |
| <script> | |
| (function () { | |
| var form = document.getElementById('gist-search-form'); | |
| var termInput = document.getElementById('gist-term'); | |
| var noteText = document.getElementById('note-text'); | |
| var searchTypeRadios = document.querySelectorAll('input[name="search-type"]'); | |
| // Update form and note when search type changes | |
| function updateSearchType() { | |
| var selectedType = document.querySelector('input[name="search-type"]:checked').value; | |
| if (selectedType === 'gist') { | |
| form.action = 'https://gist.github.com/search'; | |
| termInput.placeholder = 'Suchwort in meinen Gists...'; | |
| noteText.textContent = 'Das Formular öffnet die Ergebnisse in einem neuen Tab. (Suche wird an https://gist.github.com/search?q=%40dewomser+<Suchwort> gesendet)'; | |
| } else { | |
| form.action = 'https://github.com/search'; | |
| termInput.placeholder = 'Suchwort in GitHub...'; | |
| noteText.textContent = 'Das Formular öffnet die Ergebnisse in einem neuen Tab. (Suche wird an https://github.com/search?q=%40dewomser+<Suchwort> gesendet)'; | |
| } | |
| } | |
| // Add event listeners to radio buttons | |
| searchTypeRadios.forEach(function(radio) { | |
| radio.addEventListener('change', updateSearchType); | |
| }); | |
| form.addEventListener('submit', function (e) { | |
| var selectedType = document.querySelector('input[name="search-type"]:checked').value; | |
| var term = termInput.value.trim(); | |
| if (!term) { | |
| e.preventDefault(); | |
| termInput.focus(); | |
| return; | |
| } | |
| // Falls bereits ein verstecktes Feld existiert, überschreiben, sonst anlegen | |
| var hidden = document.getElementById('gist-q'); | |
| if (!hidden) { | |
| hidden = document.createElement('input'); | |
| hidden.type = 'hidden'; | |
| hidden.name = 'q'; | |
| hidden.id = 'gist-q'; | |
| form.appendChild(hidden); | |
| } | |
| // Set query based on search type | |
| if (selectedType === 'gist') { | |
| hidden.value = '@dewomser ' + term; | |
| } else { | |
| hidden.value = '@dewomser ' + term; | |
| } | |
| // Entferne das sichtbare Eingabefeld aus der Übertragung | |
| termInput.removeAttribute('name'); | |
| }); | |
| })(); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment