|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>LABORATORY X: Special Labs</title> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
|
<style> |
|
|
@import url('https://fonts.googleapis.com/css2?family=Share+Tech+Mono&display=swap'); |
|
|
|
|
|
body { |
|
|
font-family: 'Share Tech Mono', monospace; |
|
|
background-color: #0a0a0a; |
|
|
color: #00ff41; |
|
|
overflow-x: hidden; |
|
|
} |
|
|
|
|
|
.glow-text { |
|
|
text-shadow: 0 0 5px #00ff41, 0 0 10px #00ff41; |
|
|
} |
|
|
|
|
|
.scanline { |
|
|
position: relative; |
|
|
overflow: hidden; |
|
|
} |
|
|
|
|
|
.scanline::after { |
|
|
content: ''; |
|
|
position: absolute; |
|
|
top: 0; |
|
|
left: 0; |
|
|
right: 0; |
|
|
bottom: 0; |
|
|
background: linear-gradient( |
|
|
to bottom, |
|
|
rgba(0, 255, 65, 0.1) 50%, |
|
|
rgba(0, 0, 0, 0.1) 50% |
|
|
); |
|
|
background-size: 100% 4px; |
|
|
pointer-events: none; |
|
|
animation: scanline 4s linear infinite; |
|
|
} |
|
|
|
|
|
@keyframes scanline { |
|
|
0% { |
|
|
background-position: 0 0; |
|
|
} |
|
|
100% { |
|
|
background-position: 0 100%; |
|
|
} |
|
|
} |
|
|
|
|
|
.terminal-input::before { |
|
|
content: '>'; |
|
|
margin-right: 8px; |
|
|
color: #00ff41; |
|
|
} |
|
|
|
|
|
.blink { |
|
|
animation: blink 1s step-end infinite; |
|
|
} |
|
|
|
|
|
@keyframes blink { |
|
|
from, to { opacity: 1; } |
|
|
50% { opacity: 0; } |
|
|
} |
|
|
|
|
|
.danger-pulse { |
|
|
animation: dangerPulse 2s infinite; |
|
|
} |
|
|
|
|
|
@keyframes dangerPulse { |
|
|
0% { box-shadow: 0 0 0 0 rgba(255, 0, 0, 0.7); } |
|
|
70% { box-shadow: 0 0 0 10px rgba(255, 0, 0, 0); } |
|
|
100% { box-shadow: 0 0 0 0 rgba(255, 0, 0, 0); } |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body class="min-h-screen flex flex-col"> |
|
|
|
|
|
<header class="border-b border-green-500 py-4 px-6"> |
|
|
<div class="container mx-auto flex justify-between items-center"> |
|
|
<h1 class="text-3xl md:text-4xl font-bold glow-text">LABORATORY X</h1> |
|
|
<div class="flex items-center space-x-4"> |
|
|
<span class="text-red-500 text-sm md:text-base"> |
|
|
<i class="fas fa-shield-alt mr-1"></i> |
|
|
CLEARANCE: <span class="font-bold">RED</span> |
|
|
</span> |
|
|
<span class="text-green-500 text-sm md:text-base"> |
|
|
<i class="fas fa-user-secret mr-1"></i> |
|
|
USER: <span class="font-bold">[CLASSIFIED]</span> |
|
|
</span> |
|
|
</div> |
|
|
</div> |
|
|
</header> |
|
|
|
|
|
|
|
|
<main class="flex-grow container mx-auto px-4 py-8"> |
|
|
<div class="scanline bg-black bg-opacity-90 border border-green-500 rounded-lg p-6 mb-8"> |
|
|
<div class="flex items-center mb-6"> |
|
|
<h2 class="text-2xl md:text-3xl font-bold glow-text flex items-center"> |
|
|
<i class="fas fa-flask mr-3"></i> |
|
|
Special Labs: Project NEMESIS |
|
|
</h2> |
|
|
</div> |
|
|
|
|
|
<div class="danger-pulse bg-black border border-red-500 rounded-lg p-4 mb-6"> |
|
|
<div class="flex items-center mb-2"> |
|
|
<i class="fas fa-exclamation-triangle text-red-500 mr-2 text-xl"></i> |
|
|
<h3 class="text-xl font-bold text-red-500">DANGER: LEVEL 5 CONTAINMENT REQUIRED</h3> |
|
|
</div> |
|
|
<p class="text-red-400">THREAT LEVEL: <span class="font-bold">MAXIMUM</span></p> |
|
|
</div> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-8"> |
|
|
<div class="border border-green-500 rounded-lg p-4"> |
|
|
<h4 class="text-lg font-bold mb-3 flex items-center"> |
|
|
<i class="fas fa-biohazard mr-2"></i> |
|
|
Klebsiella pneumoniae XDR-1 |
|
|
</h4> |
|
|
<ul class="space-y-2"> |
|
|
<li class="flex items-start"> |
|
|
<i class="fas fa-pills text-green-500 mr-2 mt-1"></i> |
|
|
<span>Antibiotic Resistance: <span class="font-bold text-red-500">100%</span></span> |
|
|
</li> |
|
|
<li class="flex items-start"> |
|
|
<i class="fas fa-chart-line text-green-500 mr-2 mt-1"></i> |
|
|
<span>Replication Rate: <span class="font-bold text-yellow-500">287% above normal</span></span> |
|
|
</li> |
|
|
<li class="flex items-start"> |
|
|
<i class="fas fa-skull-crossbones text-green-500 mr-2 mt-1"></i> |
|
|
<span>Virulence: <span class="font-bold text-red-500">Critical</span></span> |
|
|
</li> |
|
|
<li class="flex items-start"> |
|
|
<i class="fas fa-map-marked-alt text-green-500 mr-2 mt-1"></i> |
|
|
<span>Origin: <span class="font-bold text-gray-400">[REDACTED]</span></span> |
|
|
</li> |
|
|
</ul> |
|
|
</div> |
|
|
|
|
|
<div class="border border-red-500 rounded-lg p-4"> |
|
|
<h4 class="text-lg font-bold mb-3 flex items-center"> |
|
|
<i class="fas fa-exclamation-circle text-red-500 mr-2"></i> |
|
|
URGENT NOTICE |
|
|
</h4> |
|
|
<p class="text-red-400"> |
|
|
This strain exhibits complete resistance to all known antibiotics and antimicrobial compounds. |
|
|
Traditional treatment methods are ineffective. Quarantine protocols must be maintained at all times. |
|
|
</p> |
|
|
<div class="mt-4 flex items-center"> |
|
|
<i class="fas fa-radiation text-yellow-500 mr-2"></i> |
|
|
<span class="text-sm text-yellow-500">Biosafety Level 4 conditions required</span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="border-t border-green-500 pt-6"> |
|
|
<div class="flex items-center mb-4"> |
|
|
<i class="fas fa-database text-green-500 mr-2"></i> |
|
|
<h3 class="text-xl font-bold">LABORATORY X RESEARCH DATABASE v3.7.2</h3> |
|
|
</div> |
|
|
<p class="mb-4 text-gray-400">Enter search terms to display research findings</p> |
|
|
|
|
|
<div class="terminal-input flex items-center mb-2"> |
|
|
<input type="text" id="searchInput" class="bg-transparent border-none outline-none flex-grow text-green-500" placeholder="Enter search terms..." autofocus> |
|
|
<span class="blink text-green-500">_</span> |
|
|
</div> |
|
|
|
|
|
<div id="searchResults" class="mt-4 hidden"> |
|
|
<div class="border border-green-500 rounded-lg p-4"> |
|
|
<h4 class="font-bold mb-2">Search Results for: <span id="searchQuery" class="text-green-300"></span></h4> |
|
|
<div id="resultContent" class="text-sm"> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</main> |
|
|
|
|
|
|
|
|
<footer class="border-t border-green-500 py-4 px-6 text-center text-sm text-gray-500"> |
|
|
<div class="container mx-auto"> |
|
|
<p>LABORATORY X - CLASSIFIED RESEARCH FACILITY</p> |
|
|
<p class="mt-1">Unauthorized access prohibited - All activities monitored</p> |
|
|
<p class="mt-1">© 2023 LABORATORY X - <span class="text-red-500">[DATA EXPUNGED]</span></p> |
|
|
</div> |
|
|
</footer> |
|
|
|
|
|
<script> |
|
|
document.addEventListener('DOMContentLoaded', function() { |
|
|
const searchInput = document.getElementById('searchInput'); |
|
|
const searchResults = document.getElementById('searchResults'); |
|
|
const searchQuery = document.getElementById('searchQuery'); |
|
|
const resultContent = document.getElementById('resultContent'); |
|
|
|
|
|
|
|
|
const researchData = [ |
|
|
{ term: "phage therapy", content: "Experimental phage therapy shows 43% effectiveness against XDR-1. Requires further testing. [REF: XD-7842]" }, |
|
|
{ term: "CRISPR", content: "CRISPR-based antimicrobial approach in development. Preliminary results promising but unstable. [REF: XG-2190]" }, |
|
|
{ term: "synthetic antibodies", content: "Synthetic antibody project XA-7 shows potential for targeted neutralization. Human trials pending. [REF: XA-0007]" }, |
|
|
{ term: "nanotech", content: "Nanotechnology delivery system XN-12 demonstrates ability to breach bacterial defenses. [REF: XN-0012]" }, |
|
|
{ term: "quorum sensing", content: "Quorum sensing disruption shows 28% reduction in virulence. Not a complete solution. [REF: XQ-5581]" } |
|
|
]; |
|
|
|
|
|
searchInput.addEventListener('keypress', function(e) { |
|
|
if (e.key === 'Enter') { |
|
|
const query = searchInput.value.trim().toLowerCase(); |
|
|
|
|
|
if (query) { |
|
|
searchQuery.textContent = query; |
|
|
|
|
|
|
|
|
const matches = researchData.filter(item => |
|
|
item.term.toLowerCase().includes(query) |
|
|
); |
|
|
|
|
|
if (matches.length > 0) { |
|
|
resultContent.innerHTML = matches.map(item => |
|
|
`<div class="mb-3 p-2 border-b border-green-900"> |
|
|
<p class="font-bold">${item.term.toUpperCase()}</p> |
|
|
<p>${item.content}</p> |
|
|
</div>` |
|
|
).join(''); |
|
|
} else { |
|
|
resultContent.innerHTML = ` |
|
|
<div class="text-red-400 p-2"> |
|
|
<i class="fas fa-exclamation-circle mr-2"></i> |
|
|
No matches found in database. Try alternative search terms. |
|
|
</div> |
|
|
`; |
|
|
} |
|
|
|
|
|
searchResults.classList.remove('hidden'); |
|
|
} else { |
|
|
searchResults.classList.add('hidden'); |
|
|
} |
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
const placeholderText = "Enter search terms to begin..."; |
|
|
let i = 0; |
|
|
|
|
|
function typeWriter() { |
|
|
if (i < placeholderText.length) { |
|
|
searchInput.setAttribute('placeholder', placeholderText.substring(0, i + 1)); |
|
|
i++; |
|
|
setTimeout(typeWriter, Math.random() * 100 + 50); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
setTimeout(typeWriter, 1000); |
|
|
}); |
|
|
</script> |
|
|
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=SrRooT/lab-x-dev" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
</html> |
