Skip to content

Commit 5269e38

Browse files
webxoswebxos
authored
Create vialmcp.html
1 parent 34ea482 commit 5269e38

File tree

1 file changed

+201
-0
lines changed

1 file changed

+201
-0
lines changed

‎vialmcp.html‎

Lines changed: 201 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,201 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
6+
<title>Vial MCP Landing</title>
7+
<style>
8+
* {
9+
margin: 0;
10+
padding: 0;
11+
box-sizing: border-box;
12+
font-family: 'Courier New', monospace;
13+
}
14+
15+
body {
16+
height: 100vh;
17+
display: flex;
18+
flex-direction: column;
19+
justify-content: center;
20+
align-items: center;
21+
background: #000;
22+
color: #0f0;
23+
overflow: hidden;
24+
position: relative;
25+
touch-action: manipulation;
26+
}
27+
28+
/* Custom Arcade Font */
29+
@font-face {
30+
font-family: 'Arcade';
31+
src: local('Arial Black'), local('Impact'), local('sans-serif-bold');
32+
font-weight: bold;
33+
font-style: normal;
34+
}
35+
36+
/* Arcade-Style Logo with Neural Glow */
37+
.arcade-logo {
38+
font-family: 'Arcade', 'Arial Black', Impact, sans-serif;
39+
font-size: 1.4rem;
40+
letter-spacing: 0.05em;
41+
text-align: center;
42+
text-transform: uppercase;
43+
color: #0f0;
44+
text-shadow: 0 0 20px #0f0, 0 0 30px #0f0, 0 0 50px #0f0;
45+
animation: neural-glow 1.3s ease-in-out infinite alternate;
46+
position: relative;
47+
z-index: 10;
48+
margin-bottom: 2.5rem;
49+
line-height: 1;
50+
}
51+
52+
@keyframes neural-glow {
53+
from { text-shadow: 0 0 15px #0f0, 0 0 25px #0f0, 0 0 40px #0f0; }
54+
to { text-shadow: 0 0 25px #0f0, 0 0 50px #0f0, 0 0 70px #0f0; }
55+
}
56+
57+
/* Comet-Like Ooze Animation */
58+
.neural-comets {
59+
position: absolute;
60+
top: 0;
61+
left: 0;
62+
width: 100%;
63+
height: 100%;
64+
pointer-events: none;
65+
z-index: 5;
66+
}
67+
68+
.neural-comets span {
69+
position: absolute;
70+
width: 8px;
71+
height: 8px;
72+
background: #0f0;
73+
border-radius: 50%;
74+
box-shadow: 0 0 15px #0f0, 0 0 25px #0f0;
75+
animation: drip 4s linear infinite;
76+
}
77+
78+
.neural-comets span::after {
79+
content: '';
80+
position: absolute;
81+
top: 100%;
82+
left: 50%;
83+
width: 3px;
84+
height: 30px;
85+
background: linear-gradient(to bottom, #0f0, transparent);
86+
opacity: 0.7;
87+
transform: translateX(-50%);
88+
}
89+
90+
@keyframes drip {
91+
0% { transform: translateY(-100vh); opacity: 1; }
92+
50% { opacity: 0.9; }
93+
100% { transform: translateY(100vh); opacity: 0.2; }
94+
}
95+
96+
/* Button Styles */
97+
.button-group {
98+
display: flex;
99+
gap: 1.2rem;
100+
justify-content: center;
101+
z-index: 10;
102+
}
103+
104+
button {
105+
background: #0f0;
106+
color: #000;
107+
border: 2px solid #0f0;
108+
padding: 0.9rem 1.8rem;
109+
font-size: 1.1rem;
110+
font-weight: bold;
111+
text-transform: uppercase;
112+
cursor: pointer;
113+
border-radius: 6px;
114+
transition: all 0.3s;
115+
text-shadow: 0 0 6px #0f0;
116+
}
117+
118+
button:hover, button:focus {
119+
background: #000;
120+
color: #0f0;
121+
box-shadow: 0 0 20px #0f0;
122+
outline: none;
123+
}
124+
125+
/* Footer */
126+
footer {
127+
position: absolute;
128+
bottom: 0.5rem;
129+
width: 100%;
130+
text-align: center;
131+
font-size: 0.7rem;
132+
color: #0f0;
133+
opacity: 0.7;
134+
z-index: 10;
135+
}
136+
137+
/* Responsive Design */
138+
@media (max-width: 600px) {
139+
.arcade-logo {
140+
font-size: 0.8rem;
141+
margin-bottom: 1.8rem;
142+
}
143+
144+
button {
145+
padding: 0.7rem 1.2rem;
146+
font-size: 0.95rem;
147+
}
148+
149+
footer {
150+
font-size: 0.6rem;
151+
}
152+
153+
.neural-comets span {
154+
width: 5px;
155+
height: 5px;
156+
}
157+
158+
.neural-comets span::after {
159+
width: 2px;
160+
height: 20px;
161+
}
162+
}
163+
164+
@media (max-width: 400px) {
165+
.button-group {
166+
flex-direction: column;
167+
gap: 0.6rem;
168+
}
169+
170+
button {
171+
width: 85%;
172+
max-width: 220px;
173+
}
174+
}
175+
</style>
176+
</head>
177+
<body>
178+
<!-- Comet-Like Ooze Animation -->
179+
<div class="neural-comets">
180+
<span style="left: 10%; animation-delay: 0s;"></span>
181+
<span style="left: 25%; animation-delay: 0.5s;"></span>
182+
<span style="left: 40%; animation-delay: 1s;"></span>
183+
<span style="left: 55%; animation-delay: 1.5s;"></span>
184+
<span style="left: 70%; animation-delay: 2s;"></span>
185+
<span style="left: 85%; animation-delay: 2.5s;"></span>
186+
<span style="left: 95%; animation-delay: 3s;"></span>
187+
</div>
188+
189+
<!-- Arcade-Style Logo -->
190+
<div class="arcade-logo">VIALMCP</div>
191+
192+
<!-- Buttons -->
193+
<div class="button-group">
194+
<button onclick="window.location.href='http://webxos.netlify.app/main/frontend/public/index.html'">DASHBOARD</button>
195+
<button onclick="window.location.href='http://webxos.netlify.app/moreinfo'">INFO</button>
196+
</div>
197+
198+
<!-- Footer -->
199+
<footer>WebXOS © 2025</footer>
200+
</body>
201+
</html>

0 commit comments

Comments
 (0)