{"html":"

\n \n

\n SYSTEM OVERRIDE\n

\n","css":"/* Base container styling */\n.container {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n background: linear-gradient(135deg, #00051f, #00010c);\n overflow: hidden;\n font-family: \"Courier New\", monospace;\n position: relative;\n}\n\n.container::before {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: repeating-linear-gradient(\n 0deg,\n rgba(0, 255, 153, 0.05),\n rgba(0, 255, 153, 0.05) 1px,\n transparent 1px,\n transparent 10px\n );\n opacity: 0.7;\n z-index: 0;\n animation: data-stream 4s infinite linear;\n}\n\n.hacker-container {\n position: relative;\n z-index: 1;\n}\n\n/* Button styling with indigo theme */\n.hacker-btn {\n padding: 18px 40px;\n background: rgba(20, 20, 60, 0.9);\n color: #b3b3ff;\n border: 2px solid #4b4bff;\n font-size: 18px;\n text-transform: uppercase;\n letter-spacing: 2px;\n cursor: pointer;\n position: relative;\n overflow: hidden;\n transition: all 0.3s ease;\n box-shadow:\n 0 0 15px rgba(75, 75, 255, 0.3),\n inset 0 0 10px rgba(75, 75, 255, 0.2);\n}\n\n/* Terminal flicker effect */\n.hacker-btn::before {\n content: \"\";\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: linear-gradient(\n 90deg,\n transparent,\n rgba(75, 75, 255, 0.3),\n transparent\n );\n animation: terminal-swipe 3s infinite linear;\n}\n\n.hacker-btn:hover::before {\n animation: terminal-swipe 1s infinite linear;\n}\n\n.hacker-btn:hover {\n color: #ffffff;\n box-shadow:\n 0 0 25px rgba(75, 75, 255, 0.7),\n 0 0 40px rgba(75, 75, 255, 0.4);\n transform: scale(1.03);\n}\n\n/* Cursor blink effect */\n.hacker-btn::after {\n content: \"_\";\n position: absolute;\n right: 10px;\n top: 50%;\n transform: translateY(-50%);\n color: #00ff99;\n font-size: 20px;\n animation: cursor-blink 0.8s infinite step-end;\n}\n\n/* Tooltip with aesthetic */\n.hacker-tooltip {\n position: absolute;\n bottom: 120%;\n left: 50%;\n transform: translateX(-50%) scale(0.9);\n background: rgba(10, 10, 40, 0.95);\n color: #b3b3ff;\n padding: 10px 20px;\n border: 1px solid #4b4bff;\n font-size: 16px;\n white-space: nowrap;\n visibility: hidden;\n opacity: 0;\n transition: all 0.3s ease;\n box-shadow: 0 0 20px rgba(75, 75, 255, 0.3);\n z-index: 10;\n}\n\n/* Typing glitch effect */\n.hacker-tooltip::before {\n content: attr(data-text);\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n color: #00ff99;\n opacity: 0.6;\n animation: typing-glitch 1.2s infinite steps(5);\n z-index: -1;\n}\n\n/* Subtle glow border */\n.hacker-tooltip::after {\n content: \"\";\n position: absolute;\n inset: -3px;\n border: 1px solid #4b4bff;\n opacity: 0.5;\n filter: blur(4px);\n animation: glow-pulse 2s infinite ease-in-out;\n}\n\n/* Hacker prompt symbol */\n.hacker-tooltip span::after {\n content: \"$>\";\n position: absolute;\n top: 50%;\n right: -25px;\n transform: translateY(-50%);\n color: #00ff99;\n font-size: 16px;\n text-shadow: 0 0 10px #00ff99;\n animation: prompt-flick 1sZombie infinite alternate;\n}\n\n/* Tooltip hover effect */\n.hacker-container:hover .hacker-tooltip {\n visibility: visible;\n opacity: 1;\n transform: translateX(-50%) scale(1);\n bottom: 130%;\n}\n\n/* Animations */\n@keyframes data-stream {\n 0% {\n transform: translateY(0);\n }\n 100% {\n transform: translateY(-10px);\n }\n}\n\n@keyframes terminal-swipe {\n 0% {\n left: -100%;\n }\n 100% {\n left: 100%;\n }\n}\n\n@keyframes cursor-blink {\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n\n@keyframes typing-glitch {\n 0% {\n clip-path: inset(0 100% 0 0);\n }\n 20% {\n clip-path: inset(0 80% 0 0);\n }\n 40% {\n clip-path: inset(0 60% 0 0);\n }\n 60% {\n clip-path: inset(0 40% 0 0);\n }\n 80% {\n clip-path: inset(0 20% 0 0);\n }\n 100% {\n clip-path: inset(0 0 0 0);\n }\n}\n\n@keyframes glow-pulse {\n 0% {\n opacity: 0.5;\n }\n 50% {\n opacity: 0.9;\n }\n 100% {\n opacity: 0.5;\n }\n}\n\n@keyframes prompt-flick {\n 0% {\n opacity: 0.6;\n }\n 100% {\n opacity: 1;\n }\n}\n"}

big-fly-94

👁 实时预览

📝 源代码