Skip to content

Commit 01a8098

Browse files
committed
chore: try downloads page as embedded iframe for seo
1 parent f86b601 commit 01a8098

File tree

1 file changed

+9
-203
lines changed

1 file changed

+9
-203
lines changed

src/download/index.html

Lines changed: 9 additions & 203 deletions
Original file line numberDiff line numberDiff line change
@@ -1,218 +1,24 @@
11
<!DOCTYPE html>
22
<html lang="en">
33
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
46
<title>Download Phoenix Code Editor</title>
5-
<link rel="stylesheet" type="text/css" href="../thirdparty/fontawesome/css/all.min.css">
67
<style>
7-
/* Brackets Fonts */
8-
9-
/* Alternative weights */
10-
11-
:root {
12-
--sansFontFamily: 'SourceSansPro', Helvetica, Arial, "Meiryo UI", "MS Pゴシック", "MS PGothic", sans-serif;
13-
}
14-
15-
/* SourceSansPro Regular */
16-
@font-face {
17-
font-family: 'SourceSansPro';
18-
src: url('../styles/fonts/SourceSansPro/SourceSansPro-Regular.ttf');
19-
font-weight: normal;
20-
font-style: normal;
21-
}
22-
23-
body {
24-
background: #000A2E;
8+
body, html {
9+
margin: 0;
10+
padding: 0;
11+
height: 100%;
2512
overflow: hidden;
26-
display: flex;
27-
justify-content: center;
28-
align-items: center;
29-
font-family: var(--sansFontFamily) ;
30-
font-size: 22px;
31-
}
32-
33-
img {
34-
vertical-align: middle;
35-
border-style: none;
36-
}
37-
38-
#starsLeft {
39-
position: absolute;
40-
left: 0px;
41-
top: 5%;
42-
opacity: 0.7;
43-
z-index: 2;
44-
}
45-
46-
#starsRight {
47-
position: absolute;
48-
z-index: 2;
49-
right: 0px;
50-
top: 5%;
51-
opacity: 0.7;
52-
}
53-
54-
#mainDiv {
55-
color: #ffffffef;
56-
top: 35%;
57-
left: 50%;
58-
transform: translate(-50%, -50%);
59-
position: absolute;
60-
z-index: 8;
61-
align-items: center;
62-
justify-content: center;
63-
display: flex!important;
64-
flex-direction: column!important;
65-
}
66-
67-
#logo {
68-
height: 35vh;
69-
vertical-align: middle;
70-
border-style: none;
71-
box-sizing: border-box;
72-
73-
}
74-
75-
#MainText {
76-
color: #ffffffef;
77-
text-align: center!important;
78-
}
79-
80-
h1 {
81-
font-size: 2.25rem;
82-
font-weight: 600;
83-
line-height: 1.2;
84-
margin-top: 0;
8513
}
86-
87-
.primary-button {
88-
width: 350px;
89-
height: 60px;
90-
background: linear-gradient(90deg, #FAAA47 0%, #FA1801 100%);
91-
font-family: var(--sansFontFamily) ;
92-
background-size: 200% 200%;
93-
border-radius: 5px;
94-
border: none;
95-
outline: none;
96-
color: #ffffffef;
97-
cursor: pointer;
98-
box-shadow: 0 0 0 #FAAA47;
99-
transition:2s background-color;
100-
animation: Animation 2s ease infinite;
101-
}
102-
103-
@keyframes Animation {
104-
0%{background-position:0% 0%}
105-
50%{background-position:100% 0%}
106-
100%{background-position:0% 0%}
107-
}
108-
109-
110-
.clouds {
111-
position: absolute;
112-
bottom: 0;
113-
width: 101%;
114-
}
115-
116-
#cloudLeftTop {
117-
position: absolute;
118-
top: -10%;
119-
left: -20px;
120-
z-index: 1;
121-
}
122-
123-
#cloudBottomRight {
124-
position: absolute;
125-
bottom: 10%;
126-
right: -20px;
127-
z-index: 1;
128-
}
129-
130-
.night {
131-
position: relative;
14+
iframe {
13215
width: 100%;
13316
height: 100%;
134-
transform: rotateZ(45deg);
135-
}
136-
137-
.shooting_star {
138-
position: absolute;
139-
left: 50%;
140-
top: 50%;
141-
width: 100px;
142-
height: 1px;
143-
background: linear-gradient(-45deg, rgba(95, 145, 255, 1), rgba(0, 0, 255, 0));
144-
border-radius: 999px;
145-
filter: drop-shadow(0 0 6px rgba(105, 155, 255, 1));
146-
animation:
147-
tail 3000ms ease-in-out ,
148-
shooting 3000ms ease-in-out ;
149-
animation-fill-mode: forwards;
150-
}
151-
152-
@keyframes tail {
153-
0% {
154-
width: 0;
155-
}
156-
157-
30% {
158-
width: 100px;
159-
}
160-
161-
100% {
162-
width: 0;
163-
}
164-
}
165-
166-
@keyframes shooting {
167-
0% {
168-
transform: translateX(0);
169-
}
170-
171-
100% {
172-
transform: translateX(300px);
173-
}
17+
border: none;
17418
}
175-
17619
</style>
177-
<meta name="robots" content="noindex">
17820
</head>
179-
18021
<body>
181-
<img id="starsLeft" src="../assets/phoenix-splash/images/stars-left.svg"/>
182-
<div id="mainDiv">
183-
<img id="logo" src="../assets/phoenix-splash/images/phoenix-logo.svg"/>
184-
<div id="MainText">
185-
<h1>Phoenix Code Editor</h1>
186-
<span>A text editor designed to make coding as intuitive and fun as playing a video game - specially
187-
crafted for web developers, designers, and students.</span>
188-
<br><br>
189-
<a href="https://phcode.io">
190-
<button id="load-status-display-btn" class="primary-button" style="font-size: x-large">
191-
<i class="fa-solid fa-download"></i> &nbsp; Download from phcode.io</button>
192-
</a>
193-
</div>
194-
</div>
195-
<img id="cloudLeftTop" src="../assets/phoenix-splash/images/vector-top-left.png"/>
196-
<img id="cloudBottomRight" src="../assets/phoenix-splash/images/vector-bottom-right.png"/>
197-
<img id="starsRight" src="../assets/phoenix-splash/images/stars-right.svg"/>
198-
<img class="clouds" style="z-index: 3; transform: translate(0px, -1.55909px);" src="../assets/phoenix-splash/images/cloud1.svg"/>
199-
<img class="clouds" style="z-index: 6; transform: translate(0px, -2.33863px);" src="../assets/phoenix-splash/images/cloud2.svg"/>
200-
<img class="clouds" style="z-index: 5; transform: translate(0px, -3.89772px);" src="../assets/phoenix-splash/images/cloud3.svg"/>
201-
<img class="clouds" style="z-index: 6; transform: translate(0px, -3.89772px);" src="../assets/phoenix-splash/images/cloud4.svg"/>
202-
<div class="night">
203-
<div class="shooting_star">
204-
<div class="shooting_star"/>
205-
</div>
206-
</div>
207-
<div class="night">
208-
<div class="shooting_star">
209-
<div class="shooting_star"/>
210-
</div>
211-
</div>
212-
<div class="night">
213-
<div class="shooting_star">
214-
<div class="shooting_star"/>
215-
</div>
216-
</div>
22+
<iframe src="https://phcode.io" allowfullscreen></iframe>
21723
</body>
21824
</html>

0 commit comments

Comments
 (0)