Skip to content

Commit cc9b6d5

Browse files
developeranazdeveloperanaz
authored
Refactor important notice element in index.html
1 parent 525ab80 commit cc9b6d5

1 file changed

Lines changed: 81 additions & 40 deletions

File tree

‎webapps/gofile.io/index.html‎

Lines changed: 81 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -15,58 +15,99 @@
1515
</details>
1616

1717
<!-- Important Notice Element -->
18-
<div id="important-notice" style="
19-
position: fixed;
20-
top: 0;
21-
left: 0;
22-
width: 100%;
23-
height: 100%;
24-
background: rgba(0,0,0,0.6);
25-
display: flex;
26-
align-items: center;
27-
justify-content: center;
28-
z-index: 9999;
29-
font-family: Arial, sans-serif;
30-
">
31-
<div style="
32-
background: #fff;
33-
border: 2px solid red;
34-
padding: 20px;
35-
max-width: 600px;
36-
width: 90%;
37-
text-align: center;
38-
box-shadow: 0 0 15px rgba(255,0,0,0.5);
39-
">
40-
<h2 style="color: red; margin-top: 0;">⚠️ Important Notice</h2>
41-
<p style="color: red; font-size: 15px; line-height: 1.5;">
42-
Update: Cloudflare is now returning an error, <b>"Error 1101"</b>, for some users.
43-
Already-deployed apps may still work, but new deployments or edits during deployment
44-
may show the same error. This happens because Cloudflare is blocking requests or
18+
19+
<!-- REQUIRED: Put this inside <head> -->
20+
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
21+
22+
<!-- Important Notice Element -->
23+
<div id="important-notice">
24+
<div class="notice-box">
25+
<h2>⚠️ Important Notice</h2>
26+
27+
<p>
28+
Update: Cloudflare is now returning an error,
29+
<b>"Error 1101"</b>, for some users.
30+
Already-deployed apps may still work, but new deployments
31+
or edits during deployment may show the same error.
32+
<br><br>
33+
This happens because Cloudflare is blocking requests or
4534
deployments are stuck.
4635
<br><br>
4736
If this occurs, delete the app completely and create a new one.
48-
The error may repeat. I tried to fix this, but Cloudflare is still detecting it.
37+
The error may repeat. I tried to fix this, but Cloudflare is
38+
still detecting it.
4939
Currently, only preview works.
5040
</p>
5141

52-
<button onclick="acknowledgeNotice()" style="
53-
margin-top: 15px;
54-
padding: 10px 20px;
55-
background: red;
56-
color: white;
57-
border: none;
58-
cursor: pointer;
59-
font-size: 14px;
60-
">
42+
<button onclick="acknowledgeNotice()">
6143
OK, I Understand
6244
</button>
6345
</div>
6446
</div>
6547

48+
<style>
49+
/* Overlay */
50+
#important-notice {
51+
position: fixed;
52+
inset: 0;
53+
background: rgba(0,0,0,0.6);
54+
display: flex;
55+
align-items: center;
56+
justify-content: center;
57+
z-index: 9999;
58+
font-family: Arial, sans-serif;
59+
60+
/* Mobile-safe */
61+
overflow: hidden;
62+
touch-action: none;
63+
}
64+
65+
/* Popup box */
66+
.notice-box {
67+
background: #fff;
68+
border: 2px solid red;
69+
padding: 16px;
70+
width: 92%;
71+
max-width: 500px;
72+
text-align: center;
73+
box-shadow: 0 0 15px rgba(255,0,0,0.5);
74+
}
75+
76+
/* Title */
77+
.notice-box h2 {
78+
color: red;
79+
margin-top: 0;
80+
font-size: 18px;
81+
}
82+
83+
/* Text */
84+
.notice-box p {
85+
color: red;
86+
font-size: 14px;
87+
line-height: 1.5;
88+
}
89+
90+
/* Button */
91+
.notice-box button {
92+
margin-top: 15px;
93+
padding: 12px 20px;
94+
background: red;
95+
color: white;
96+
border: none;
97+
cursor: pointer;
98+
font-size: 15px;
99+
border-radius: 4px;
100+
}
101+
</style>
102+
66103
<script>
67-
function acknowledgeNotice() {
68-
document.getElementById("important-notice").style.display = "none";
69-
}
104+
/* Prevent background scroll while notice is visible */
105+
document.body.style.overflow = "hidden";
106+
107+
function acknowledgeNotice() {
108+
document.getElementById("important-notice").style.display = "none";
109+
document.body.style.overflow = ""; // restore scroll
110+
}
70111
</script>
71112

72113
<style>

0 commit comments

Comments
 (0)