<!DOCTYPE html>
<html>
<head>
<title>Data File Generator</title>
<style>
body {
margin-top:-295px;
}
.container {
padding:4px;
max-width: 500px;
background-color: #fff;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
h1 {
text-align: center;
color: #333;
}
input[type="text"] {
width: calc(100% - 20px);
margin-bottom: 10px;
padding: 10px;
border: 1px solid #ccc;
border-radius: 5px;
font-size: 16px;
text-align:center;
color:black;
}
input[type="text"]:focus {
outline: none;
border-color: #007bff;
}
button {
width: 100%;
padding: 10px;
background-color: #007bff;
color: #fff;
border: none;
border-radius: 5px;
font-size: 16px;
cursor: pointer;
}
button:hover {
background-color: #0056b3;
}
.dropdown {
position: absolute;
top: 10px;
right: 10px;
}
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
width: 60px;
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
z-index: 1;
}
.dropdown-content button {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
background-color: transparent;
border: none;
width:100px;
text-align:left;
height:224px;
margin-right:55px;
}
.dropdown-content button:hover {
background-color: #f1f1f1;
}
.dropdown:hover .dropdown-content {
display: block;
}
.phoimg{border:0.11px solid red;
border-radius:100%;
height:120px; width:120px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);}
#data1{width:235px;
font-size:20px;
color:red;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); }
.ytimg{ margin-top:-82px;
margin-left:142px;
position:fixed; }
.user{margin-top:-112px;
margin-left:155px;
position:fixed;
color:gray;
}
.wallet{}
.More{}
</style>
<script>
function saveData() {
var data1 = document.getElementById("data1").value;
var data2 = document.getElementById("data2").value;
var data3 = document.getElementById("data3").value;
var data4 = document.getElementById("data4").value;
var data5 = document.getElementById("data5").value;
var password = prompt("Enter password to save data:");
//password yahin badalna hai
if (password === "") {
var data = {
data1: data1,
data2: data2,
data3: data3,
data4: data4,
data5: data5
};
localStorage.setItem("user_data", JSON.stringify(data));
alert("Data saved successfully!");
document.getElementById("submitButton").style.display = "none"; // Hide submit button after successful save
} else {
alert("Incorrect password! Data not saved.");
}
}
window.onload = function() {
var savedData = localStorage.getItem("user_data");
if (savedData !== null) {
savedData = JSON.parse(savedData);
document.getElementById("data1").value = savedData.data1;
document.getElementById("data2").value = savedData.data2;
document.getElementById("data3").value = savedData.data3;
document.getElementById("data4").value = savedData.data4;
document.getElementById("data5").value = savedData.data5;
}
}
function editData() {
document.getElementById("submitButton").style.display = "block";
document.getElementById("submitButton").innerHTML = "Submit";
}
function editData1() {
document.getElementById("data2").style.display = "block";
document.getElementById("data3").style.display = "block";
document.getElementById("data4").style.display = "block";
document.getElementById("data5").style.display = "block";
}
</script>
</head>
<body>
<div class="container">
<img class="phoimg"src=""><span></span>
<div class="ytimg"> <a href=""><img style="height:40px;margin-top:5px" src="https://www.youtube.com/yts/img/favicon_32-vflOogEID.png" alt="YouTube Logo"></a>  <a href=""><img style="height:35px;margin-top:-5px" src="https://www.facebook.com/images/fb_icon_325x325.png" alt="Facebook Logo"></a>
 
<a href=""><img style="margin-top:-7px" src="https://www.instagram.com/static/images/ico/favicon.ico/36b3ee2d91ed.ico" alt="Instagram Logo"></a>
</div>
<div class="user">@<hr></div>
<input type="text" id="data1" placeholder=""> <button style="width:60.5px;
height:48px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); "onclick="editData1()">Bio</button><br>
<input type="text" id="data2"style="display: none;" placeholder=""><br>
<input type="text" id="data3"style="display: none;"placeholder=""><br>
<input type="text" id="data4"style="display: none;"placeholder=""><br>
<input type="text" id="data5"style="display: none;"placeholder=""><br><br>
<button id="submitButton" style="display: none;" onclick="saveData()">Submit</button>
<br> <button style="width:92.5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);">More</button>  <div style="width:205px;
font-size:18px;
color:red;
margin-left:100px;
margin-top:-48px; border-radius:5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
padding:5px; ">Wallet: <span style="color:gray;"></span></div><br>
<button onclick="copy()">Referal Code</button><div id="copi">Referal Code:Ost157 ,Create Your Profile :https://ostist.blogspot.com/2024/05/ostist-30.html?m=1 </div>
<div class="dropdown">
<button>⁞</button>
<div class="dropdown-content">
<button id="editButton" onclick="editData()">Edit</button>
</div>
</div>
</div>
<script type="text/javascript">
function copy() {
var textToCop = document.getElementById("copi");
var range = document.createRange();
range.selectNode(textToCop);
window.getSelection().removeAllRanges();
window.getSelection().addRange(range);
document.execCommand("copy");
window.getSelection().removeAllRanges();
}</script>
</body>
</html>
Comments
Post a Comment