Skip to content

Commit 6428e02

Browse files
authored
Create index4.html
1 parent abbefe0 commit 6428e02

1 file changed

Lines changed: 150 additions & 0 deletions

File tree

index4.html

Lines changed: 150 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,150 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<title>Windows XP</title>
6+
<link rel="manifest" href="https://progressier.app/2EA8ChwJUsvbDSyPRnat/progressier.json"/>
7+
<script defer src="https://progressier.app/2EA8ChwJUsvbDSyPRnat/script.js"></script>
8+
<link href="/icon/favicon (5).ico" rel="icon" type="image/x-icon">
9+
<meta name="description" content="Windows XP Experience">
10+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
11+
12+
<!-- Google Sans Font -->
13+
<link href="https://fonts.googleapis.com/css2?family=Google+Sans:wght@400;500;600&display=swap" rel="stylesheet">
14+
15+
<style>
16+
:root {
17+
--bg: radial-gradient(1200px at top, #1b1f3b, #0a0c16);
18+
--glass: rgba(255, 255, 255, 0.07);
19+
--border: rgba(255, 255, 255, 0.18);
20+
--glow: rgba(120, 140, 255, 0.45);
21+
--header-text: #E8EAED;
22+
--loader-text: #FFFFFF;
23+
--loader-bg: rgba(33, 33, 33, 0.85);
24+
}
25+
26+
* {
27+
box-sizing: border-box;
28+
font-family: "Google Sans", system-ui, sans-serif;
29+
}
30+
31+
html, body {
32+
margin: 0;
33+
width: 100%;
34+
height: 100%;
35+
background: var(--bg);
36+
overflow: hidden;
37+
}
38+
39+
body {
40+
display: flex;
41+
align-items: center;
42+
justify-content: center;
43+
}
44+
45+
.container {
46+
position: relative;
47+
width: 94%;
48+
height: 94%;
49+
background: var(--glass);
50+
border-radius: 20px;
51+
border: 1px solid var(--border);
52+
backdrop-filter: blur(20px);
53+
box-shadow:
54+
0 0 80px var(--glow),
55+
inset 0 0 0 1px rgba(255,255,255,0.05);
56+
overflow: hidden;
57+
animation: enter 1s ease-out;
58+
}
59+
60+
header {
61+
position: absolute;
62+
top: 0;
63+
left: 0;
64+
right: 0;
65+
height: 56px;
66+
display: flex;
67+
align-items: center;
68+
padding: 0 24px;
69+
background: linear-gradient(
70+
to bottom,
71+
rgba(0,0,0,0.25),
72+
rgba(0,0,0,0)
73+
);
74+
z-index: 10;
75+
pointer-events: none;
76+
}
77+
78+
header span {
79+
font-size: 16px; /* Material subtitle1 size */
80+
font-weight: 500; /* Medium */
81+
letter-spacing: 0.15px;
82+
color: var(--header-text);
83+
}
84+
85+
iframe {
86+
width: 100%;
87+
height: 100%;
88+
border: none;
89+
}
90+
91+
.loader {
92+
position: absolute;
93+
inset: 0;
94+
display: flex;
95+
align-items: center;
96+
justify-content: center;
97+
font-size: 14px; /* Material body2 size */
98+
font-weight: 500; /* Medium for visibility */
99+
letter-spacing: 0.1em;
100+
color: var(--loader-text);
101+
background: var(--loader-bg);
102+
border-radius: 12px;
103+
transition: opacity 0.6s ease;
104+
z-index: 20;
105+
pointer-events: none;
106+
}
107+
108+
.loader.hidden {
109+
opacity: 0;
110+
}
111+
112+
@keyframes enter {
113+
from {
114+
opacity: 0;
115+
transform: scale(0.96);
116+
}
117+
to {
118+
opacity: 1;
119+
transform: scale(1);
120+
}
121+
}
122+
</style>
123+
</head>
124+
125+
<body>
126+
<div class="container">
127+
<header>
128+
<span>Windows XP Simulation</span>
129+
</header>
130+
131+
<div class="loader" id="loader">LOADING WINDOWS_XP.iso</div>
132+
133+
<iframe
134+
src="https://xp.quenq.com"
135+
allowfullscreen
136+
loading="eager"
137+
referrerpolicy="no-referrer">
138+
</iframe>
139+
</div>
140+
141+
<script>
142+
const iframe = document.querySelector("iframe");
143+
const loader = document.getElementById("loader");
144+
145+
iframe.addEventListener("load", () => {
146+
loader.classList.add("hidden");
147+
});
148+
</script>
149+
</body>
150+
</html>

0 commit comments

Comments
 (0)