Skip to content
This repository was archived by the owner on Dec 30, 2025. It is now read-only.

Commit ca5918a

Browse files
blackXploit-404blackXploit-404
committed
Updated index.html
1 parent f298e65 commit ca5918a

1 file changed

Lines changed: 65 additions & 39 deletions

File tree

‎frontend/index.html‎

Lines changed: 65 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,13 @@
33
<head>
44
<meta charset="UTF-8">
55
<title>SecurePaste</title>
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
8+
<!-- Libraries -->
69
<script src="https://cdn.jsdelivr.net/npm/crypto-js@4.1.1/crypto-js.min.js"></script>
710
<script src="https://cdn.jsdelivr.net/npm/qrcode/build/qrcode.min.js"></script>
8-
911
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/simplemde@1.11.2/dist/simplemde.min.css">
1012
<script src="https://cdn.jsdelivr.net/npm/simplemde@1.11.2/dist/simplemde.min.js"></script>
11-
1213
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap" rel="stylesheet">
1314

1415
<style>
@@ -21,31 +22,34 @@
2122
font-family: 'Inter', system-ui, sans-serif;
2223
background: #f9f9f9;
2324
display: flex;
25+
flex-direction: column;
2426
align-items: center;
25-
justify-content: center;
26-
height: 100vh;
27+
justify-content: flex-start;
28+
min-height: 100vh;
29+
padding: 20px;
2730
}
2831

2932
.container {
30-
width: 90%;
31-
max-width: 700px;
33+
width: 100%;
34+
max-width: 720px;
3235
background: white;
33-
padding: 30px;
34-
box-shadow: 0 10px 25px rgba(0,0,0,0.08);
36+
padding: 24px;
37+
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
3538
border-radius: 12px;
3639
}
3740

3841
h2 {
3942
text-align: center;
4043
color: #4b2e83;
4144
margin-bottom: 20px;
45+
font-size: 24px;
4246
}
4347

4448
label, select, input {
4549
display: block;
4650
margin-top: 15px;
4751
width: 100%;
48-
font-size: 14px;
52+
font-size: 15px;
4953
}
5054

5155
select, input[type="password"] {
@@ -93,29 +97,50 @@
9397
min-height: 200px;
9498
border-radius: 0 0 6px 6px;
9599
}
100+
96101
footer {
97-
background-color: #3d256c;
98-
color: #f9f9f9;
99-
text-align: center;
100-
padding: 20px 10px;
101-
font-size: 16px;
102-
margin-top: 40px;
103-
border-top: 3px solid #4b2e83;
104-
line-height: 1.6;
105-
}
106-
107-
footer a {
108-
color: #f9f9f9;
109-
text-decoration: underline;
110-
font-weight: 500;
111-
}
112-
113-
footer a:hover {
114-
color: #ffccff;
115-
}
102+
margin-top: 40px;
103+
background-color: #3d256c;
104+
color: #f9f9f9;
105+
text-align: center;
106+
padding: 20px 10px;
107+
font-size: 15px;
108+
border-top: 3px solid #4b2e83;
109+
line-height: 1.6;
110+
border-radius: 8px;
111+
}
112+
113+
footer a {
114+
color: #f9f9f9;
115+
text-decoration: underline;
116+
font-weight: 500;
117+
}
116118

119+
footer a:hover {
120+
color: #ffccff;
121+
}
122+
123+
@media (max-width: 500px) {
124+
.container {
125+
padding: 16px;
126+
}
127+
128+
h2 {
129+
font-size: 20px;
130+
}
131+
132+
button {
133+
font-size: 15px;
134+
}
135+
136+
footer {
137+
font-size: 14px;
138+
padding: 16px 8px;
139+
}
140+
}
117141
</style>
118142
</head>
143+
119144
<body>
120145
<div class="container">
121146
<div class="icon">🔐</div>
@@ -137,19 +162,20 @@ <h2>Create a Secure Paste</h2>
137162
<button onclick="createPaste()">🔗 Generate Secure Link</button>
138163

139164
<div id="result"></div>
140-
<footer>
141-
<p>
142-
<a href="mailto:hello@surajitsen.me">📧 Contact Us</a> <br>
143-
Made with <span style="color: red;">❤️</span> in India<br>
144-
⚙️ Powered by Node.js, Express, and CryptoJS <br>
145-
Hosting by Render <br>
146-
💡 Inspired by SecureBin, PrivateBin, and community needs
147-
</p>
148-
</footer>
149165
</div>
150-
166+
167+
<footer>
168+
<p>
169+
<a href="mailto:hello@surajitsen.me">📧 Contact Us</a> <br>
170+
Made with <span style="color: red;">❤️</span> in India<br>
171+
⚙️ Powered by Node.js, Express, and CryptoJS <br>
172+
☁️ Hosting by Render <br>
173+
💡 Inspired by SecureBin, PrivateBin, and community needs
174+
</p>
175+
</footer>
176+
151177
<script>
152-
const simplemde = new SimpleMDE({
178+
const simplemde = new SimpleMDE({
153179
element: document.getElementById("message"),
154180
spellChecker: false,
155181
toolbar: ["bold", "italic", "heading", "|", "quote", "unordered-list", "ordered-list", "|", "preview", "side-by-side", "guide"]

0 commit comments

Comments
 (0)