اسلامک ویب سا ئٹ‎ https://dinafree.do.am/ Mon, 06 Jan 2025 04:50:39 GMT uCoz Web-Service Advanced Image Editor <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="widt... <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Advanced Image Editor</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.5.13/cropper.min.css" /> <style> body { font-family: Arial, sans-serif; margin: 0; padding: 0; text-align: center; } header { background-color: #4CAF50; color: white; padding: 15px 0; font-size: 1.8em; } #dropArea { border: 2px dashed #ccc; padding: 20px; margin: 20px auto; max-width: 80%; background-color: #f9f9f9; transition: 0.3s; } #dropArea.dragover { background-color: #e0ffe0; border-color: #4CAF50; } #image-container { margin: 20px auto; max-width: 80%; } #image-container canvas { max-width: 100%; border: 2px solid #ccc; border-radius: 8px; } .controls { margin: 20px; } .controls input[type="range"], .controls input[type="color"], .controls input[type="number"] { margin: 10px; } .btn { padding: 10px 20px; margin: 5px; background-color: #4CAF50; color: white; border: none; border-radius: 5px; cursor: pointer; } .btn:hover { background-color: #45a049; } </style> </head> <body> <header>Advanced Image Editor</header> <!-- Drag and Drop Area --> <div id="dropArea"> Drag and Drop your image here or click to upload. <input type="file" id="uploadInput" accept="image/*" style="display: none;" /> </div> <!-- Image Display --> <div id="image-container"> <canvas id="imageCanvas"></canvas> </div> <!-- Controls --> <div class="controls"> <!-- Color Adjustments --> <label>Hue: <input type="range" id="hue" min="0" max="360" value="0"> </label> <label>Saturation: <input type="range" id="saturation" min="0" max="200" value="100"> </label> <label>Blur: <input type="range" id="blur" min="0" max="10" value="0"> </label> <br> <!-- Drawing and Text --> <button class="btn" id="startDrawing">Draw</button> <button class="btn" id="stopDrawing">Stop Drawing</button> <button class="btn" id="addText">Add Text</button> <!-- Filters --> <button class="btn" id="sepiaFilter">Sepia</button> <button class="btn" id="bwFilter">Black & White</button> <button class="btn" id="vintageFilter">Vintage</button> <br> <!-- Undo/Redo --> <button class="btn" id="undo">Undo</button> <button class="btn" id="redo">Redo</button> <!-- File Save --> <button class="btn" id="downloadImage">Download</button> </div> <!-- Script Section --> <script> const dropArea = document.getElementById('dropArea'); const uploadInput = document.getElementById('uploadInput'); const imageCanvas = document.getElementById('imageCanvas'); const ctx = imageCanvas.getContext('2d'); let img = new Image(); let drawing = false; let history = []; let redoStack = []; // Drag and Drop Upload dropArea.addEventListener('click', () => uploadInput.click()); dropArea.addEventListener('dragover', (e) => { e.preventDefault(); dropArea.classList.add('dragover'); }); dropArea.addEventListener('dragleave', () => dropArea.classList.remove('dragover')); dropArea.addEventListener('drop', (e) => { e.preventDefault(); dropArea.classList.remove('dragover'); const file = e.dataTransfer.files[0]; handleFileUpload(file); }); uploadInput.addEventListener('change', (e) => handleFileUpload(e.target.files[0])); function handleFileUpload(file) { if (file) { const reader = new FileReader(); reader.onload = (event) => { img.src = event.target.result; img.onload = () => { imageCanvas.width = img.width; imageCanvas.height = img.height; ctx.drawImage(img, 0, 0); saveHistory(); }; }; reader.readAsDataURL(file); } } // Save History for Undo/Redo function saveHistory() { history.push(ctx.getImageData(0, 0, imageCanvas.width, imageCanvas.height)); redoStack = []; // Clear redo stack after new action } // Undo/Redo document.getElementById('undo').addEventListener('click', () => { if (history.length > 1) { redoStack.push(history.pop()); ctx.putImageData(history[history.length - 1], 0, 0); } }); document.getElementById('redo').addEventListener('click', () => { if (redoStack.length > 0) { const imageData = redoStack.pop(); history.push(imageData); ctx.putImageData(imageData, 0, 0); } }); // Drawing Tool imageCanvas.addEventListener('mousedown', () => { drawing = true; saveHistory(); }); imageCanvas.addEventListener('mouseup', () => drawing = false); imageCanvas.addEventListener('mousemove', (e) => { if (drawing) { const rect = imageCanvas.getBoundingClientRect(); const x = e.clientX - rect.left; const y = e.clientY - rect.top; ctx.fillStyle = 'red'; // Default drawing color ctx.fillRect(x, y, 5, 5); // Draw small squares } }); // Add Text document.getElementById('addText').addEventListener('click', () => { const text = prompt('Enter the text to add:'); const x = parseInt(prompt('Enter X position:'), 10) || 50; const y = parseInt(prompt('Enter Y position:'), 10) || 50; ctx.font = '30px Arial'; ctx.fillStyle = 'blue'; ctx.fillText(text, x, y); saveHistory(); }); // Filters document.getElementById('sepiaFilter').addEventListener('click', () => { ctx.filter = 'sepia(1)'; ctx.drawImage(img, 0, 0); saveHistory(); }); document.getElementById('bwFilter').addEventListener('click', () => { ctx.filter = 'grayscale(1)'; ctx.drawImage(img, 0, 0); saveHistory(); }); document.getElementById('vintageFilter').addEventListener('click', () => { ctx.filter = 'contrast(0.8) brightness(1.2)'; ctx.drawImage(img, 0, 0); saveHistory(); }); // Blur Filter document.getElementById('blur').addEventListener('input', (e) => { const blurValue = e.target.value; ctx.filter = `blur(${blurValue}px)`; ctx.drawImage(img, 0, 0); saveHistory(); }); // Download Image document.getElementById('downloadImage').addEventListener('click', () => { const link = document.createElement('a'); link.download = 'edited_image.png'; link.href = imageCanvas.toDataURL(); link.click(); }); </script> </body> </html> https://dinafree.do.am/news/advanced_image_editor/2025-01-06-78 asmat_dina https://dinafree.do.am/news/advanced_image_editor/2025-01-06-78 Mon, 06 Jan 2025 04:50:39 GMT اردو اور انگریزی ترجمہ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="widt... <!DOCTYPE html> <html lang="en"> <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&display=swap" rel="stylesheet"> <style> body { font-family: 'Noto Nastaliq Urdu', Arial, sans-serif; text-align: center; margin: 20px; background: linear-gradient(to bottom, #f0f8ff, #d1e7dd); color: #333; } h1 { font-size: 2.5em; color: #004085; margin-bottom: 20px; } textarea { width: 80%; height: 120px; margin-bottom: 15px; font-size: 18px; padding: 10px; border: 2px solid #004085; border-radius: 10px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); font-family: 'Noto Nastaliq Urdu', Arial, sans-serif; } select, button { font-size: 18px; padding: 10px 15px; margin: 10px; border-radius: 5px; border: 2px solid #004085; background-color: #e9f5ff; color: #004085; cursor: pointer; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); } select:hover, button:hover { background-color: #004085; color: #fff; } #outputText { font-size: 20px; font-weight: bold; color: #004085; margin-top: 20px; padding: 15px; background-color: #ffffff; border: 2px solid #004085; border-radius: 10px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); display: inline-block; width: 80%; text-align: left; } footer { margin-top: 30px; font-size: 14px; color: #666; } </style> </head> <body> <h1>اردو اور انگریزی ترجمہ</h1> <textarea id="inputText" placeholder="یہاں متن درج کریں..."></textarea> <br> <select id="languageSelect"> <option value="ur-en">اردو سے انگریزی</option> <option value="en-ur">انگریزی سے اردو</option> </select> <button onclick="translateText()">ترجمہ کریں</button> <div id="outputText">ترجمہ شدہ متن یہاں نظر آئے گا</div> <footer>ترجمہ کرنے کے لیے انٹرنیٹ کنکشن ضروری ہے۔</footer> <script> async function translateText() { const inputText = document.getElementById('inputText').value; const languagePair = document.getElementById('languageSelect').value; let srcLang = 'ur'; let destLang = 'en'; if (languagePair === 'en-ur') { srcLang = 'en'; destLang = 'ur'; } if (inputText.trim() === "") { alert("براہ کرم متن درج کریں!"); return; } try { const response = await fetch(`https://api.mymemory.translated.net/get?q=${encodeURIComponent(inputText)}&langpair=${srcLang}|${destLang}`); const data = await response.json(); document.getElementById('outputText').textContent = data.responseData.translatedText; } catch (error) { document.getElementById('outputText').textContent = "ترجمہ کرنے میں مسئلہ پیش آیا!"; console.error("Error:", error); } } </script> </body> </html> https://dinafree.do.am/news/ardu_aur_an_r_z_trgm/2024-12-22-77 asmat_dina https://dinafree.do.am/news/ardu_aur_an_r_z_trgm/2024-12-22-77 Sun, 22 Dec 2024 07:12:46 GMT آخری نبی اور انسانیت کے رہبر حضرت محمد صلی اللہ علیہ وسلم <!DOCTYPE html> <html lang="ur" dir="rtl"> <head> <meta charset="UTF-8"> <meta name="viewport" con... <!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&family=Noto+Sans+Urdu:wght@400;700&display=swap" rel="stylesheet"> <!-- اسٹائل --> <style> /* فونٹس */ @font-face { font-family: 'JameelNooriNastaleeq'; src: url('fonts/JameelNooriNastaleeq.ttf') format('truetype'); } body { font-family: 'JameelNooriNastaleeq', 'Noto Nastaliq Urdu', 'Noto Sans Urdu', sans-serif; direction: rtl; margin: 0; padding: 0; background-color: #f9f9f9; color: #333; line-height: 2.8; } /* ہیڈر */ header { background: linear-gradient(90deg, #009688, #4caf50); color: white; text-align: center; padding: 20px 0; border-bottom: 5px solid #00796b; } header h1 { font-size: 2.8rem; margin: 0; } /* مرکزی حصہ */ main { max-width: 900px; margin: 30px auto; padding: 20px; background: white; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); border-radius: 8px; } h2 { font-size: 2rem; color: #009688; border-bottom: 2px solid #4caf50; padding-bottom: 5px; margin-bottom: 15px; } h3 { font-size: 1.6rem; color: #4caf50; margin-top: 20px; } p, li { font-size: 1.4rem; margin: 10px 0; } ul { padding-right: 20px; } /* کارڈ اسٹائل */ .card { background: #f1f1f1; padding: 15px; border-radius: 5px; margin-bottom: 20px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } .card h3 { margin: 0; padding-bottom: 10px; border-bottom: 2px solid #009688; } footer { background: #333; color: white; text-align: center; padding: 10px 0; margin-top: 30px; font-size: 1.2rem; border-top: 5px solid #00796b; } </style> </head> <body> <header> <h1>حضرت محمد صلی اللہ علیہ وسلم</h1> </header> <main> <h2>آخری نبی اور انسانیت کے رہبر</h2> <div class="card"> <p> حضرت محمد صلی اللہ علیہ وسلم اسلام کے پیغمبر ہیں اور خاتم النبیین (آخری نبی) ہیں۔ اللہ تعالی نے انہیں دنیا کے تمام انسانوں کی ہدایت کے لیے بھیجا۔ حضرت محمد صلی اللہ علیہ وسلم نے انسانوں کو عدل، انصاف، محبت، بھائی چارہ، اور رحم دلی کی تعلیم دی۔ ان کی سیرت اور کردار مسلمانوں کے لیے رہنمائی کا ذریعہ ہیں۔ </p> </div> <h3>پیدائش اور وفات</h3> <div class="card"> <p><strong>پیدائش:</strong> حضرت محمد صلی اللہ علیہ وسلم 570 عیسوی میں مکہ مکرمہ میں پیدا ہوئے۔</p> <p><strong>وفات:</strong> حضرت محمد صلی اللہ علیہ وسلم کی وفات 632 عیسوی میں مدینہ منورہ میں ہوئی۔</p> </div> <h3>حضرت محمد صلی اللہ علیہ وسلم کی جنگیں</h3> <div class="card"> <ul> <li>جنگ بدر (624 عیسوی): یہ جنگ مسلمانوں اور قریش مکہ کے درمیان ہوئی۔ مسلمانوں نے اللہ کی مدد سے فتح حاصل کی، اور یہ جنگ مسلمانوں کے لیے ایک اہم مقام رکھتی ہے۔</li> <li>جنگ احد (625 عیسوی): جنگ احد میں مسلمانوں کو ابتدائی طور پر فتح حاصل ہوئی، مگر ایک غلطی کی وجہ سے قریش نے مسلمانوں کو نقصان پہنچایا۔</li> <li>جنگ احزاب (627 عیسوی): جنگ احزاب میں مسلمانوں نے مدینہ کے دفاع کے لیے خندق کھود کر قریش کی فوج کو پسپائی پر مجبور کیا۔</li> <li>جنگ حنین (630 عیسوی): جنگ حنین میں مسلمانوں نے قریش کے خلاف بڑی فتح حاصل کی، حالانکہ ابتدا میں انہیں مشکلات کا سامنا تھا۔</li> <li>جنگ تبوک (630 عیسوی): جنگ تبوک ایک دفاعی جنگ تھی، جس میں مسلمانوں نے رومانیہ کے حکمران کو لڑائی سے باز رکھا۔</li> <li>فتح مکہ (630 عیسوی): یہ جنگ اسلام کی فتح کی علامت تھی، جب حضرت محمد صلی اللہ علیہ وسلم اور آپ کے صحابہ کرام نے مکہ مکرمہ کو بغیر خونریزی کے فتح کیا۔</li> <li>جنگ موتہ (629 عیسوی): جنگ موتہ میں حضرت محمد صلی اللہ علیہ وسلم نے اپنے تین صحابہ کو بھیجا تھا، جس میں حضرت زید بن حارثہ، حضرت جعفر بن ابی طالب اور حضرت عبداللہ بن رواحہ شہید ہوئے۔ یہ جنگ رومیوں کے خلاف تھی۔</li> </ul> </div> <h3>حضرت محمد صلی اللہ علیہ وسلم کی بیویاں اور بیٹیاں</h3> <div class="card"> <p><strong>حضرت محمد صلی اللہ علیہ وسلم کی بیویاں:</strong></p> <ul> <li>حضرت خدیجہ بنت خویلد (رضی اللہ عنہا)</li> <li>حضرت سودہ بنت زمعہ (رضی اللہ عنہا)</li> <li>حضرت عائشہ بنت ابی بکر (رضی اللہ عنہا)</li> <li>حضرت حفصہ بنت عمر (رضی اللہ عنہا)</li> <li>حضرت زینب بنت خزیمہ (رضی اللہ عنہا)</li> <li>حضرت ام سلمہ (ہند بنت ابی امیہ) (رضی اللہ عنہا)</li> <li>حضرت زینب بنت جحش (رضی اللہ عنہا)</li> <li>حضرت جویریہ بنت الحارث (رضی اللہ عنہا)</li> <li>حضرت صفیہ بنت حیی (رضی اللہ عنہا)</li> <li>حضرت میمونة بنت الحارث (رضی اللہ عنہا)</li> </ul> <p><strong>حضرت محمد صلی اللہ علیہ وسلم کی بیٹیاں:</strong></p> <ul> <li>حضرت زینب (رضی اللہ عنہا)</li> <li>حضرت رقیہ (رضی اللہ عنہا)</li> <li>حضرت ام کلثوم (رضی اللہ عنہا)</li> <li>حضرت فاطمہ (رضی اللہ عنہا)</li> </ul> </div> </main> <footer> <p>&copy; 2025 - اسلامی معلومات</p> </footer> </body> </html> https://dinafree.do.am/news/hr_nb_aur_ansan_t_r_br/2024-12-21-76 asmat_dina https://dinafree.do.am/news/hr_nb_aur_ansan_t_r_br/2024-12-21-76 Sat, 21 Dec 2024 12:53:53 GMT