File size: 12,521 Bytes
ca71d3a |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 |
<!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 -->
<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 Content -->
<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">
<!-- Results will be populated here -->
</div>
</div>
</div>
</div>
</div>
</main>
<!-- Footer -->
<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');
// Sample research data
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;
// Find matching research
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');
}
}
});
// Terminal-like typing effect for the input placeholder
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);
}
}
// Start the typing effect
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> |