File size: 2,572 Bytes
bf4221b | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 | <!DOCTYPE html>
<html lang="ur" dir="rtl">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>📚 خوش آمدید</title>
<link href="https://fonts.googleapis.com/css2?family=Noto+Nastaliq+Urdu:wght@400;700&display=swap" rel="stylesheet">
<style>
body { font-family: 'Noto Nastaliq Urdu', serif; margin: 0; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; min-height: 100vh; }
.container { max-width: 700px; margin: auto; padding: 2rem; }
h1 { text-align: center; font-size: 2.5rem; margin-bottom: 2rem; }
ul { list-style: none; padding: 0; }
li { background: rgba(255,255,255,0.1); margin: 1rem 0; padding: 1rem; border-radius: 10px; transition: background 0.3s; }
li:hover { background: rgba(255,255,255,0.2); cursor: pointer; }
a { text-decoration: none; color: white; display: block; }
.portfolio { margin-top: 3rem; padding: 1.5rem; background: rgba(255,255,255,0.1); border-radius: 10px; text-align: center; }
.portfolio h2 { font-size: 1.8rem; margin-bottom: 1rem; }
.portfolio p { font-size: 1rem; margin-bottom: 1rem; }
.portfolio a { display: inline-block; padding: 0.75rem 2rem; background: #ffffff33; border-radius: 30px; font-weight: bold; transition: background 0.3s; }
.portfolio a:hover { background: #ffffff55; }
</style>
</head>
<body>
<div class="container">
<h1>📚 خوش آمدید</h1>
<ul id="storyList">
<!-- Story list will load here -->
</ul>
<div class="portfolio">
<h2>About Developer</h2>
<p>Hello! I am <strong>Abdullah Tarar</strong>, a passionate developer specialized in web development, automation,and AI integrations.</p>
<a href="portfolio.html" target="_blank">View My Portfolio</a>
</div>
</div>
<script>
async function loadStories() {
try {
const response = await fetch('Story.json');
const stories = await response.json();
const list = document.getElementById('storyList');
stories.forEach(story => {
const li = document.createElement('li');
const link = document.createElement('a');
link.href = `index.html?file=${story.file}`;
link.textContent = story.title;
li.appendChild(link);
list.appendChild(li);
});
} catch (error) {
console.error('کہانیاں لوڈ کرنے میں مسئلہ ہوا:', error);
}
}
window.addEventListener('load', loadStories);
</script>
</body>
</html>
|