Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>LeGoog</title> | |
| <style> | |
| :root { --goog-blue: #4285F4; --goog-red: #EA4335; --goog-yellow: #FBBC05; --goog-green: #34A853; } | |
| html, body { height: 100%; margin: 0; padding: 0; font-family: 'Segoe UI', sans-serif; } | |
| .wrapper { display: flex; flex-direction: column; min-height: 100vh; } | |
| .content { flex: 1; } | |
| .home { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 75vh; } | |
| .logo { font-size: 90px; font-weight: bold; margin-bottom: 30px; user-select: none; letter-spacing: -5px; } | |
| .logo span:nth-child(1) { color: var(--goog-blue); } | |
| .logo span:nth-child(2) { color: var(--goog-red); } | |
| .logo span:nth-child(3) { color: var(--goog-yellow); } | |
| .logo span:nth-child(4) { color: var(--goog-blue); } | |
| .logo span:nth-child(5) { color: var(--goog-green); } | |
| .logo span:nth-child(6) { color: var(--goog-red); } | |
| .search-box { width: 90%; max-width: 584px; } | |
| input[type="text"] { width: 100%; padding: 14px 25px; border-radius: 30px; border: 1px solid #dfe1e5; font-size: 16px; outline: none; } | |
| input[type="text"]:focus { box-shadow: 0 1px 6px rgba(32,33,36,0.28); } | |
| .header { display: flex; align-items: center; padding: 20px 5%; border-bottom: 1px solid #ebebeb; position: sticky; top: 0; background: #fff; z-index: 10; } | |
| .header .logo { font-size: 28px; margin: 0 30px 0 0; letter-spacing: -2px; } | |
| .results-container { padding: 20px 5%; max-width: 700px; } | |
| .result-item { margin-bottom: 30px; } | |
| .meta { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; } | |
| .favicon { width: 18px; height: 18px; border-radius: 50%; } | |
| .domain { font-size: 14px; color: #202124; } | |
| .title { font-size: 20px; color: #1a0dab; text-decoration: none; display: block; } | |
| .title:hover { text-decoration: underline; } | |
| .desc { color: #4d5156; font-size: 14px; line-height: 1.5; margin-top: 5px; } | |
| footer { background: #f2f2f2; color: #70757a; padding: 25px 5%; font-size: 13px; border-top: 1px solid #e4e4e4; } | |
| .copy { font-weight: bold; display: block; margin-bottom: 5px; } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="wrapper"> | |
| <div class="content"> | |
| {% if not searching %} | |
| <div class="home"> | |
| <div class="logo"><span>L</span><span>e</span><span>G</span><span>o</span><span>o</span><span>g</span></div> | |
| <div class="search-box"> | |
| <form action="/" method="GET"> | |
| <input type="text" name="q" placeholder="Search with LeGoog..." required autofocus autocomplete="off"> | |
| </form> | |
| </div> | |
| </div> | |
| {% else %} | |
| <header class="header"> | |
| <a href="/" style="text-decoration:none"><div class="logo"><span>L</span><span>e</span><span>G</span><span>o</span><span>o</span><span>g</span></div></a> | |
| <form action="/" method="GET" style="flex-grow: 1;"> | |
| <input type="text" name="q" value="{{ query }}"> | |
| </form> | |
| </header> | |
| <div class="results-container"> | |
| {% if results %} | |
| {% for res in results %} | |
| <div class="result-item"> | |
| <div class="meta"> | |
| <img class="favicon" src="https://www.google.com/s2/favicons?domain={{ res.domain }}&sz=64" alt=""> | |
| <span class="domain">{{ res.domain }}</span> | |
| </div> | |
| <a class="title" href="{{ res.url }}" target="_blank">{{ res.title }}</a> | |
| <p class="desc">{{ res.description }}</p> | |
| </div> | |
| {% endfor %} | |
| {% else %} | |
| <p>No results found. Try a different search!</p> | |
| {% endif %} | |
| </div> | |
| {% endif %} | |
| </div> | |
| <footer> | |
| <span class="copy">© 2026 LeGoog</span> | |
| <div>LeGoog is an independent search tool and is <strong>not</strong> affiliated with Google LLC.</div> | |
| </footer> | |
| </div> | |
| </body> | |
| </html> |