پرش به محتوا

کتاب مقدس آنلاین: تفاوت میان نسخه‌ها

از دانشنامه کتاب مقدس
صفحه‌ای تازه حاوی «<html lang="fa" dir="rtl"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>کتاب مقدس - مطالعه آنلاین</title> <style> استایل‌ها مانند قبل: :root { --primary-color: #2c3e50; --secondary-color: #3498db; --accent-color: #e74c3c; --light-color: #ecf0f1;...» ایجاد کرد
 
بدون خلاصۀ ویرایش
خط ۱: خط ۱:
<!DOCTYPE html>
<html lang="fa" dir="rtl">
<html lang="fa" dir="rtl">
<head>
<head>
خط ۵: خط ۶:
     <title>کتاب مقدس - مطالعه آنلاین</title>
     <title>کتاب مقدس - مطالعه آنلاین</title>
     <style>
     <style>
        /* استایل‌ها مانند قبل */
         :root {
         :root {
             --primary-color: #2c3e50;
             --primary-color: #2c3e50;
خط ۳۱: خط ۳۱:
             max-width: 1200px;
             max-width: 1200px;
             margin: 0 auto;
             margin: 0 auto;
             padding: 20px;
             padding: 15px;
         }
         }
          
          
         header {
         header {
             text-align: center;
             text-align: center;
             margin-bottom: 30px;
             margin-bottom: 20px;
             padding: 20px 0;
             padding: 15px 0;
             border-bottom: 1px solid #ddd;
             border-bottom: 1px solid #ddd;
         }
         }
خط ۴۳: خط ۴۳:
         h1 {
         h1 {
             color: var(--primary-color);
             color: var(--primary-color);
             margin-bottom: 10px;
             margin-bottom: 8px;
            font-size: 1.5rem;
         }
         }
          
          
         .description {
         .description {
             color: #7f8c8d;
             color: #7f8c8d;
             font-size: 1.1rem;
             font-size: 0.95rem;
         }
         }
          
          
خط ۵۴: خط ۵۵:
             display: flex;
             display: flex;
             flex-wrap: wrap;
             flex-wrap: wrap;
             gap: 20px;
             gap: 15px;
             margin-bottom: 30px;
             margin-bottom: 25px;
         }
         }
          
          
         .selector-box {
         .selector-box {
             flex: 1;
             flex: 1;
             min-width: 250px;
             min-width: 200px;
             background: white;
             background: white;
             border-radius: 8px;
             border-radius: 8px;
             box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
             box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
             padding: 20px;
             padding: 15px;
             transition: transform 0.3s ease;
             transition: transform 0.3s ease;
         }
         }
          
          
         .selector-box:hover {
         .selector-box:hover {
             transform: translateY(-5px);
             transform: translateY(-3px);
         }
         }
          
          
         .selector-title {
         .selector-title {
             font-size: 1.2rem;
             font-size: 1.1rem;
             margin-bottom: 15px;
             margin-bottom: 12px;
             color: var(--primary-color);
             color: var(--primary-color);
             border-bottom: 2px solid var(--secondary-color);
             border-bottom: 2px solid var(--secondary-color);
             padding-bottom: 8px;
             padding-bottom: 6px;
         }
         }
          
          
         select {
         select {
             width: 100%;
             width: 100%;
             padding: 12px 15px;
             padding: 10px 12px;
             border: 1px solid #ddd;
             border: 1px solid #ddd;
             border-radius: 5px;
             border-radius: 5px;
             background-color: white;
             background-color: white;
             font-size: 1rem;
             font-size: 0.95rem;
             color: var(--dark-color);
             color: var(--dark-color);
             cursor: pointer;
             cursor: pointer;
خط ۱۰۰: خط ۱۰۱:
             background: white;
             background: white;
             border-radius: 8px;
             border-radius: 8px;
             box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
             box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
             padding: 30px;
             padding: 20px;
             min-height: 300px;
             min-height: 300px;
         }
         }
خط ۱۰۷: خط ۱۰۸:
         .chapter-title {
         .chapter-title {
             text-align: center;
             text-align: center;
             margin-bottom: 20px;
             margin-bottom: 15px;
             color: var(--primary-color);
             color: var(--primary-color);
             font-size: 1.5rem;
             font-size: 1.3rem;
         }
         }
          
          
خط ۱۱۵: خط ۱۱۶:
             display: flex;
             display: flex;
             justify-content: space-between;
             justify-content: space-between;
             margin-top: 30px;
             margin-top: 25px;
            flex-wrap: wrap;
            gap: 10px;
         }
         }
          
          
         .nav-btn {
         .nav-btn {
             padding: 10px 20px;
             padding: 8px 16px;
             background-color: var(--secondary-color);
             background-color: var(--secondary-color);
             color: white;
             color: white;
خط ۱۲۶: خط ۱۲۹:
             cursor: pointer;
             cursor: pointer;
             transition: background-color 0.3s;
             transition: background-color 0.3s;
             font-size: 1rem;
             font-size: 0.9rem;
            flex: 1;
            min-width: 120px;
            text-align: center;
         }
         }
          
          
خط ۱۴۰: خط ۱۴۶:
         .wiki-link {
         .wiki-link {
             display: inline-block;
             display: inline-block;
             padding: 10px 20px;
             padding: 8px 16px;
             background-color: var(--accent-color);
             background-color: var(--accent-color);
             color: white;
             color: white;
خط ۱۴۶: خط ۱۵۲:
             border-radius: 5px;
             border-radius: 5px;
             transition: background-color 0.3s;
             transition: background-color 0.3s;
            font-size: 0.9rem;
            text-align: center;
            flex: 1;
            min-width: 120px;
         }
         }


خط ۱۵۶: خط ۱۶۶:
             color: #7f8c8d;
             color: #7f8c8d;
             font-style: italic;
             font-style: italic;
             padding: 40px;
             padding: 30px;
         }
         }


خط ۱۶۲: خط ۱۷۲:
             text-align: center;
             text-align: center;
             color: #7f8c8d;
             color: #7f8c8d;
             padding: 20px;
             padding: 15px;
             border: 1px dashed #ddd;
             border: 1px dashed #ddd;
             border-radius: 5px;
             border-radius: 5px;
             margin-top: 20px;
             margin-top: 15px;
            font-size: 0.9rem;
         }
         }


         .iframe-container {
         .iframe-container {
             margin-top: 20px;
             margin-top: 15px;
         }
         }


         .iframe-header {
         .iframe-header {
             display: flex;
             display: flex;
             justify-content: space-between;
             flex-direction: column;
             align-items: center;
             gap: 10px;
             margin-bottom: 15px;
             margin-bottom: 12px;
             padding: 15px;
             padding: 12px;
             background: #f8f9fa;
             background: #f8f9fa;
             border-radius: 8px;
             border-radius: 8px;
             border: 1px solid #e9ecef;
             border: 1px solid #e9ecef;
        }
        .iframe-header-text {
            font-size: 0.95rem;
            text-align: center;
         }
         }


         .view-options {
         .view-options {
             display: flex;
             display: flex;
             gap: 10px;
             gap: 8px;
             align-items: center;
             justify-content: center;
            flex-wrap: wrap;
         }
         }


         .view-btn {
         .view-btn {
             padding: 8px 16px;
             padding: 6px 12px;
             border: 1px solid #ddd;
             border: 1px solid #ddd;
             background: white;
             background: white;
خط ۱۹۶: خط ۲۱۳:
             cursor: pointer;
             cursor: pointer;
             transition: all 0.3s;
             transition: all 0.3s;
             font-size: 0.9rem;
             font-size: 0.85rem;
         }
         }


خط ۲۰۷: خط ۲۲۴:
         .clean-iframe {
         .clean-iframe {
             width: 100%;
             width: 100%;
             height: 600px;
             height: 500px;
             border: 1px solid #ddd;
             border: 1px solid #ddd;
             border-radius: 8px;
             border-radius: 8px;
خط ۲۱۵: خط ۲۳۲:
         .access-denied {
         .access-denied {
             text-align: center;
             text-align: center;
             padding: 40px;
             padding: 30px;
             background: #fee;
             background: #fee;
             border-radius: 8px;
             border-radius: 8px;
خط ۲۲۴: خط ۲۴۱:
         .access-denied h3 {
         .access-denied h3 {
             color: #721c24;
             color: #721c24;
             margin-bottom: 15px;
             margin-bottom: 12px;
            font-size: 1.2rem;
         }
         }


        /* استایل‌های مخصوص موبایل */
         @media (max-width: 768px) {
         @media (max-width: 768px) {
            .container {
                padding: 10px;
            }
           
            header {
                margin-bottom: 15px;
                padding: 10px 0;
            }
           
            h1 {
                font-size: 1.3rem;
                margin-bottom: 5px;
            }
           
            .description {
                font-size: 0.9rem;
            }
           
             .bible-selector {
             .bible-selector {
                 flex-direction: column;
                 flex-direction: column;
                gap: 10px;
                margin-bottom: 20px;
             }
             }
              
              
             .selector-box {
             .selector-box {
                 min-width: 100%;
                 min-width: 100%;
                padding: 12px;
            }
           
            .selector-title {
                font-size: 1rem;
                margin-bottom: 8px;
            }
           
            select {
                padding: 8px 10px;
                font-size: 0.9rem;
            }
           
            .bible-content {
                padding: 15px;
            }
           
            .chapter-title {
                font-size: 1.1rem;
                margin-bottom: 12px;
             }
             }
              
              
             .navigation {
             .navigation {
                 flex-direction: column;
                 flex-direction: column;
                 gap: 10px;
                 gap: 8px;
                margin-top: 20px;
            }
           
            .nav-btn, .wiki-link {
                width: 100%;
                min-width: auto;
             }
             }
              
              
             .iframe-header {
             .iframe-header {
                padding: 10px;
            }
           
            .iframe-header-text {
                font-size: 0.9rem;
            }
           
            .view-options {
                gap: 6px;
            }
           
            .view-btn {
                padding: 5px 10px;
                font-size: 0.8rem;
            }
           
            .clean-iframe {
                height: 400px;
            }
           
            .instructions {
                padding: 12px;
                font-size: 0.85rem;
            }
        }
        @media (max-width: 480px) {
            .clean-iframe {
                height: 350px;
            }
           
            .view-options {
                 flex-direction: column;
                 flex-direction: column;
                 gap: 10px;
                 width: 100%;
                text-align: center;
             }
             }
              
              
             .view-options {
             .view-btn {
                 flex-wrap: wrap;
                 width: 100%;
                justify-content: center;
             }
             }
         }
         }
خط ۴۸۸: خط ۵۸۳:
                     <div class="iframe-container">
                     <div class="iframe-container">
                         <div class="iframe-header">
                         <div class="iframe-header">
                             <span>📖 در حال نمایش: <strong>${bookName} فصل ${currentChapter}</strong></span>
                             <div class="iframe-header-text">📖 در حال نمایش: <strong>${bookName} فصل ${currentChapter}</strong></div>
                             <div class="view-options">
                             <div class="view-options">
                                 <button class="view-btn ${currentViewMode === 'render' ? 'active' : ''}" onclick="switchViewMode('render')">نمایش تمیز</button>
                                 <button class="view-btn ${currentViewMode === 'render' ? 'active' : ''}" data-mode="render">نمایش تمیز</button>
                                 <button class="view-btn ${currentViewMode === 'full' ? 'active' : ''}" onclick="switchViewMode('full')">صفحه کامل</button>
                                 <button class="view-btn ${currentViewMode === 'full' ? 'active' : ''}" data-mode="full">صفحه کامل</button>
                                 <a href="${fullPageUrl}" class="wiki-link" target="_blank">باز کردن در تب جدید</a>
                                 <a href="${fullPageUrl}" class="wiki-link" target="_blank">باز کردن در تب جدید</a>
                             </div>
                             </div>
خط ۵۰۵: خط ۶۰۰:
                     </div>
                     </div>
                 `;
                 `;
               
                // اضافه کردن رویداد به دکمه‌های نمایش
                document.querySelectorAll('.view-btn').forEach(btn => {
                    btn.addEventListener('click', function() {
                        const mode = this.getAttribute('data-mode');
                        switchViewMode(mode, this);
                    });
                });
                  
                  
                 wikiPageLink.href = fullPageUrl;
                 wikiPageLink.href = fullPageUrl;
خط ۵۲۱: خط ۶۲۴:
             }
             }


             function switchViewMode(mode) {
             function switchViewMode(mode, clickedBtn) {
                 currentViewMode = mode;
                 currentViewMode = mode;
                 const iframe = document.getElementById('content-iframe');
                 const iframe = document.getElementById('content-iframe');
خط ۵۳۱: خط ۶۳۴:
                     btn.classList.remove('active');
                     btn.classList.remove('active');
                 });
                 });
                 event.target.classList.add('active');
                 clickedBtn.classList.add('active');
             }
             }



نسخهٔ ‏۷ اکتبر ۲۰۲۵، ساعت ۲۲:۰۱

<!DOCTYPE html> کتاب مقدس - مطالعه آنلاین

کتاب مقدس

مطالعه آنلاین کتاب مقدس به زبان فارسی