پرش به محتوا

تست: تفاوت میان نسخه‌ها

از دانشنامه کتاب مقدس
→ تفاوت با ویرایش قدیمی‌ترتفاوت با ویرایش جدیدتر ←
دیداریویکی‌متن
بدون خلاصۀ ویرایش
بدون خلاصۀ ویرایش
خط ۱: خط ۱:
 
<!DOCTYPE html>
<html lang="fa" dir="rtl">
<html lang="fa" dir="rtl">
<head>
<head>
خط ۱۹: خط ۱۹:
             line-height: 1.6;
             line-height: 1.6;
             min-height: 100vh;
             min-height: 100vh;
            padding: 40px 20px;
         }
         }
          
          
         .container {
         .container {
             max-width: 1200px;
             max-width: 1400px;
             margin: 0 auto;
             margin: 0 auto;
             position: relative;
             padding: 40px 20px;
         }
         }
          
          
        /* بکگراند فقط برای محتوای اصلی */
         /* حروف باستانی در کل صفحه اما با محدودیت */
        .main-content {
            background: linear-gradient(135deg, #f8faf9 0%, #f0f5f4 100%);
            border-radius: 20px;
            padding: 50px 40px;
            position: relative;
            overflow: hidden;
            box-shadow: 0 10px 40px rgba(60, 109, 113, 0.1);
        }
       
         /* حروف باستانی فقط در محدوده محتوا */
         .ancient-letters-overlay {
         .ancient-letters-overlay {
             position: absolute;
             position: fixed;
             top: 0;
             top: 0;
             left: 0;
             left: 0;
             right: 0;
             right: 0;
             bottom: 0;
             bottom: 0;
             opacity: 0.04;
             opacity: 0.03;
             font-size: 80px;
             font-size: 100px;
             display: flex;
             display: flex;
             justify-content: space-around;
             justify-content: space-around;
             align-items: center;
             align-items: center;
             flex-wrap: wrap;
             flex-wrap: wrap;
             padding: 30px;
             padding: 50px;
             font-family: 'Times New Roman', serif;
             font-family: 'Times New Roman', serif;
             pointer-events: none;
             pointer-events: none;
             border-radius: 20px;
             z-index: -1;
         }
         }
          
          
         .letter {
         .letter {
             margin: 5px 10px;
             margin: 15px 25px;
             color: #3c6d71;
             color: #3c6d71;
             animation: float 8s ease-in-out infinite;
             animation: float 10s ease-in-out infinite;
         }
         }
          
          
         .letter:nth-child(2n) {
         .letter:nth-child(2n) {
             animation-delay: 1.5s;
             animation-delay: 2s;
         }
         }
          
          
         .letter:nth-child(3n) {
         .letter:nth-child(3n) {
             animation-delay: 3s;
             animation-delay: 4s;
         }
         }
          
          
         @keyframes float {
         @keyframes float {
             0%, 100% { transform: translateY(0px) rotate(0deg); }
             0%, 100% { transform: translateY(0px) rotate(0deg); }
             50% { transform: translateY(-8px) rotate(2deg); }
             50% { transform: translateY(-15px) rotate(3deg); }
         }
         }
          
          
خط ۷۹: خط ۶۸:
         .boxes-section {
         .boxes-section {
             position: relative;
             position: relative;
             z-index: 2;
             z-index: 1;
         }
         }
          
          
         .section-title {
         .section-title {
             text-align: center;
             text-align: center;
             font-size: 2.5rem;
             font-size: 3rem;
             color: #3c6d71;
             color: #3c6d71;
             margin-bottom: 50px;
             margin-bottom: 60px;
             font-weight: 600;
             font-weight: 600;
            position: relative;
            z-index: 3;
         }
         }
          
          
         /* گرید برای کامپیوتر - 3 ستون در 2 ردیف */
         /* گرید برای کامپیوتر - 3 ستون در 2 ردیف با فضای بیشتر */
         .boxes-grid {
         .boxes-grid {
             display: grid;
             display: grid;
             grid-template-columns: repeat(3, 1fr);
             grid-template-columns: repeat(3, 1fr);
             grid-template-rows: repeat(2, auto);
             grid-template-rows: repeat(2, auto);
             gap: 25px;
             gap: 35px;
            position: relative;
            z-index: 3;
         }
         }
          
          
         .box {
         .box {
             background: linear-gradient(135deg, #ffffff 0%, #f8fbfb 100%);
             background: linear-gradient(135deg, #ffffff 0%, #f8fbfb 100%);
             border-radius: 15px;
             border-radius: 20px;
             padding: 30px 25px;
             padding: 40px 35px;
             text-align: center;
             text-align: center;
             box-shadow: 0 8px 25px rgba(60, 109, 113, 0.08);
             box-shadow: 0 12px 40px rgba(60, 109, 113, 0.1);
             border: 2px solid #e8f0f1;
             border: 2px solid #e8f0f1;
             transition: all 0.3s ease;
             transition: all 0.4s ease;
             position: relative;
             position: relative;
             overflow: hidden;
             overflow: hidden;
خط ۱۲۰: خط ۱۰۵:
             left: 0;
             left: 0;
             right: 0;
             right: 0;
             height: 4px;
             height: 5px;
             background: linear-gradient(90deg, #3c6d71, #5a8d91, #7aadb1);
             background: linear-gradient(90deg, #3c6d71, #5a8d91, #7aadb1);
         }
         }
          
          
         .box:hover {
         .box:hover {
             transform: translateY(-5px);
             transform: translateY(-8px);
             box-shadow: 0 15px 35px rgba(60, 109, 113, 0.12);
             box-shadow: 0 20px 50px rgba(60, 109, 113, 0.15);
             border-color: #d4e6e8;
             border-color: #d4e6e8;
         }
         }
          
          
         .box-icon {
         .box-icon {
             font-size: 2.8rem;
             font-size: 3.5rem;
             color: #3c6d71;
             color: #3c6d71;
             margin-bottom: 20px;
             margin-bottom: 25px;
         }
         }
          
          
         .box-title {
         .box-title {
             font-size: 1.5rem;
             font-size: 1.8rem;
             color: #3c6d71;
             color: #3c6d71;
             margin-bottom: 15px;
             margin-bottom: 20px;
             font-weight: 600;
             font-weight: 600;
         }
         }
خط ۱۴۵: خط ۱۳۰:
         .box-description {
         .box-description {
             color: #5a8d91;
             color: #5a8d91;
             margin-bottom: 20px;
             margin-bottom: 30px;
             line-height: 1.7;
             line-height: 1.8;
             font-size: 1rem;
             font-size: 1.1rem;
         }
         }
          
          
         .box-btn {
         .box-btn {
             display: inline-block;
             display: inline-block;
             padding: 10px 25px;
             padding: 12px 35px;
             background: linear-gradient(135deg, #3c6d71 0%, #5a8d91 100%);
             background: linear-gradient(135deg, #3c6d71 0%, #5a8d91 100%);
             color: white;
             color: white;
             text-decoration: none;
             text-decoration: none;
             border-radius: 6px;
             border-radius: 8px;
             font-weight: 500;
             font-weight: 500;
             transition: all 0.3s ease;
             transition: all 0.3s ease;
             border: none;
             border: none;
             cursor: pointer;
             cursor: pointer;
             font-size: 0.95rem;
             font-size: 1.1rem;
         }
         }
          
          
         .box-btn:hover {
         .box-btn:hover {
             background: linear-gradient(135deg, #2a4d50 0%, #3c6d71 100%);
             background: linear-gradient(135deg, #2a4d50 0%, #3c6d71 100%);
             transform: translateY(-2px);
             transform: translateY(-3px);
             box-shadow: 0 4px 12px rgba(60, 109, 113, 0.3);
             box-shadow: 0 6px 20px rgba(60, 109, 113, 0.4);
         }
         }
          
          
         /* رسپانسیو برای تبلت - 2 ستون */
         /* رسپانسیو برای تبلت - 2 ستون */
         @media (max-width: 1024px) {
         @media (max-width: 1200px) {
             .boxes-grid {
             .boxes-grid {
                 grid-template-columns: repeat(2, 1fr);
                 grid-template-columns: repeat(2, 1fr);
                 grid-template-rows: repeat(3, auto);
                 grid-template-rows: repeat(3, auto);
                 gap: 20px;
                 gap: 30px;
             }
             }
              
              
             .section-title {
             .section-title {
                 font-size: 2.2rem;
                 font-size: 2.5rem;
                 margin-bottom: 40px;
                 margin-bottom: 50px;
            }
           
            .ancient-letters-overlay {
                font-size: 60px;
             }
             }
              
              
             .box {
             .box {
                 padding: 25px 20px;
                 padding: 35px 30px;
             }
             }
              
              
             .main-content {
             .container {
                 padding: 40px 30px;
                 padding: 30px 20px;
             }
             }
         }
         }
خط ۲۰۱: خط ۱۸۲:
                 grid-template-columns: 1fr;
                 grid-template-columns: 1fr;
                 grid-template-rows: repeat(6, auto);
                 grid-template-rows: repeat(6, auto);
                 gap: 15px;
                 gap: 25px;
                max-width: 600px;
                margin: 0 auto;
             }
             }
              
              
             .section-title {
             .section-title {
                 font-size: 1.8rem;
                 font-size: 2.2rem;
                 margin-bottom: 30px;
                 margin-bottom: 40px;
             }
             }
              
              
             .box {
             .box {
                 padding: 20px 15px;
                 padding: 30px 25px;
             }
             }
              
              
             .box-icon {
             .box-icon {
                 font-size: 2.5rem;
                 font-size: 3rem;
             }
             }
              
              
             .box-title {
             .box-title {
                 font-size: 1.3rem;
                 font-size: 1.6rem;
             }
             }
              
              
             .ancient-letters-overlay {
             .ancient-letters-overlay {
                 font-size: 45px;
                 font-size: 70px;
                padding: 30px;
             }
             }
              
              
             .main-content {
             .container {
                 padding: 30px 20px;
                 padding: 25px 15px;
            }
           
            body {
                padding: 30px 15px;
             }
             }
         }
         }
خط ۲۳۷: خط ۲۱۷:
         @media (max-width: 480px) {
         @media (max-width: 480px) {
             .section-title {
             .section-title {
                 font-size: 1.6rem;
                 font-size: 1.8rem;
             }
             }
              
              
             .box {
             .box {
                 padding: 18px 12px;
                 padding: 25px 20px;
             }
             }
              
              
             .box-btn {
             .box-btn {
                 padding: 8px 20px;
                 padding: 10px 25px;
                 font-size: 0.9rem;
                 font-size: 1rem;
             }
             }
              
              
             .ancient-letters-overlay {
             .ancient-letters-overlay {
                 font-size: 35px;
                 font-size: 50px;
            }
           
            .main-content {
                padding: 25px 15px;
             }
             }
         }
         }
خط ۲۶۰: خط ۲۳۶:
</head>
</head>
<body>
<body>
    <!-- حروف باستانی در کل صفحه -->
    <div class="ancient-letters-overlay">
        <span class="letter">α</span>
        <span class="letter">β</span>
        <span class="letter">γ</span>
        <span class="letter">δ</span>
        <span class="letter">א</span>
        <span class="letter">ב</span>
        <span class="letter">ג</span>
        <span class="letter">ד</span>
        <span class="letter">𐤀</span>
        <span class="letter">𐤁</span>
        <span class="letter">𐤂</span>
        <span class="letter">Δ</span>
        <span class="letter">Θ</span>
        <span class="letter">Λ</span>
        <span class="letter">Σ</span>
        <span class="letter">Ψ</span>
        <span class="letter">Ω</span>
    </div>
    <!-- محتوای اصلی -->
     <div class="container">
     <div class="container">
         <!-- محتوای اصلی با بکگراند محدود -->
         <section class="boxes-section">
        <div class="main-content">
            <h2 class="section-title">بخش‌های اصلی سایت</h2>
            <!-- حروف باستانی فقط در این محدوده -->
            <div class="boxes-grid">
            <div class="ancient-letters-overlay">
                <!-- باکس ۱ -->
                <span class="letter">α</span>
                <div class="box">
                <span class="letter">β</span>
                    <div class="box-icon">
                <span class="letter">γ</span>
                        <i class="fas fa-book"></i>
                <span class="letter">δ</span>
                <span class="letter">א</span>
                <span class="letter">ב</span>
                <span class="letter">ג</span>
                <span class="letter">ד</span>
                <span class="letter">Δ</span>
                <span class="letter">Θ</span>
                <span class="letter">Λ</span>
                <span class="letter">Σ</span>
            </div>
 
            <!-- بخش باکس‌ها -->
            <section class="boxes-section">
                <h2 class="section-title">بخش‌های اصلی سایت</h2>
                <div class="boxes-grid">
                    <!-- باکس ۱ -->
                    <div class="box">
                        <div class="box-icon">
                            <i class="fas fa-book"></i>
                        </div>
                        <h3 class="box-title">کتابخانه دیجیتال</h3>
                        <p class="box-description">
                            دسترسی به مجموعه کامل کتاب‌های مذهبی، تفسیرها و منابع مطالعاتی
                        </p>
                        <a href="#" class="box-btn">ورود به کتابخانه</a>
                     </div>
                     </div>
                    <h3 class="box-title">کتابخانه دیجیتال</h3>
                    <p class="box-description">
                        دسترسی به مجموعه کامل کتاب‌های مذهبی، تفسیرها و منابع مطالعاتی در زمینه‌های مختلف دینی و معنوی
                    </p>
                    <a href="#" class="box-btn">ورود به کتابخانه</a>
                </div>


                    <!-- باکس ۲ -->
                <!-- باکس ۲ -->
                    <div class="box">
                <div class="box">
                        <div class="box-icon">
                    <div class="box-icon">
                            <i class="fas fa-pray"></i>
                        <i class="fas fa-pray"></i>
                        </div>
                        <h3 class="box-title">مطالعات دینی</h3>
                        <p class="box-description">
                            مقالات تخصصی، داستان‌های آموزنده و مطالب عمیق معنوی
                        </p>
                        <a href="#" class="box-btn">مطالعه مطالب</a>
                     </div>
                     </div>
                    <h3 class="box-title">مطالعات دینی</h3>
                    <p class="box-description">
                        مقالات تخصصی، داستان‌های آموزنده و مطالب عمیق در زمینه سیر و سلوک و رشد معنوی
                    </p>
                    <a href="#" class="box-btn">مطالعه مطالب</a>
                </div>


                    <!-- باکس ۳ -->
                <!-- باکس ۳ -->
                    <div class="box">
                <div class="box">
                        <div class="box-icon">
                    <div class="box-icon">
                            <i class="fas fa-hands-praying"></i>
                        <i class="fas fa-hands-praying"></i>
                        </div>
                        <h3 class="box-title">مناجات و ادعیه</h3>
                        <p class="box-description">
                            مجموعه کامل ادعیه، مناجات‌ها و اذکار با ترجمه و تفسیر
                        </p>
                        <a href="#" class="box-btn">مشاهده ادعیه</a>
                     </div>
                     </div>
                    <h3 class="box-title">مناجات و ادعیه</h3>
                    <p class="box-description">
                        مجموعه کامل ادعیه، مناجات‌ها و اذکار با ترجمه و تفسیر برای استفاده در اوقات مختلف
                    </p>
                    <a href="#" class="box-btn">مشاهده ادعیه</a>
                </div>


                    <!-- باکس ۴ -->
                <!-- باکس ۴ -->
                    <div class="box">
                <div class="box">
                        <div class="box-icon">
                    <div class="box-icon">
                            <i class="fas fa-users"></i>
                        <i class="fas fa-users"></i>
                        </div>
                        <h3 class="box-title">جامعه معنوی</h3>
                        <p class="box-description">
                            ارتباط با دیگر علاقه‌مندان و مشارکت در بحث‌های سازنده
                        </p>
                        <a href="#" class="box-btn">پیوستن به جامعه</a>
                     </div>
                     </div>
                    <h3 class="box-title">جامعه معنوی</h3>
                    <p class="box-description">
                        ارتباط با دیگر علاقه‌مندان، پرسش و پاسخ دینی و مشارکت در بحث‌های سازنده معنوی
                    </p>
                    <a href="#" class="box-btn">پیوستن به جامعه</a>
                </div>


                    <!-- باکس ۵ -->
                <!-- باکس ۵ -->
                    <div class="box">
                <div class="box">
                        <div class="box-icon">
                    <div class="box-icon">
                            <i class="fas fa-question-circle"></i>
                        <i class="fas fa-question-circle"></i>
                        </div>
                        <h3 class="box-title">پرسش و پاسخ</h3>
                        <p class="box-description">
                            پاسخ به سوالات دینی و راهنمایی در مسائل مذهبی
                        </p>
                        <a href="#" class="box-btn">پرسش سوال</a>
                     </div>
                     </div>
                    <h3 class="box-title">پرسش و پاسخ</h3>
                    <p class="box-description">
                        پاسخ به سوالات دینی و راهنمایی در مسائل مذهبی با کمک متخصصان و کارشناسان
                    </p>
                    <a href="#" class="box-btn">پرسش سوال</a>
                </div>


                    <!-- باکس ۶ -->
                <!-- باکس ۶ -->
                    <div class="box">
                <div class="box">
                        <div class="box-icon">
                    <div class="box-icon">
                            <i class="fas fa-history"></i>
                        <i class="fas fa-history"></i>
                        </div>
                        <h3 class="box-title">تاریخ ادیان</h3>
                        <p class="box-description">
                            مطالعه تاریخ ادیان و تحولات مذهبی در طول زمان
                        </p>
                        <a href="#" class="box-btn">مطالعه تاریخ</a>
                     </div>
                     </div>
                    <h3 class="box-title">تاریخ ادیان</h3>
                    <p class="box-description">
                        مطالعه تاریخ ادیان و تحولات مذهبی در طول زمان با بررسی منابع معتبر و تحقیقات جدید
                    </p>
                    <a href="#" class="box-btn">مطالعه تاریخ</a>
                 </div>
                 </div>
             </section>
             </div>
         </div>
         </section>
     </div>
     </div>


خط ۳۶۴: خط ۳۴۲:
             const letters = document.querySelectorAll('.letter');
             const letters = document.querySelectorAll('.letter');
             letters.forEach((letter, index) => {
             letters.forEach((letter, index) => {
                 letter.style.animationDelay = `${index * 0.7}s`;
                 letter.style.animationDelay = `${index * 0.8}s`;
             });
             });
         });
         });

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

<!DOCTYPE html> سایت مذهبی - صفحه اصلی

α β γ δ א ב ג ד 𐤀 𐤁 𐤂 Δ Θ Λ Σ Ψ Ω

بخش‌های اصلی سایت

کتابخانه دیجیتال

دسترسی به مجموعه کامل کتاب‌های مذهبی، تفسیرها و منابع مطالعاتی در زمینه‌های مختلف دینی و معنوی

ورود به کتابخانه

مطالعات دینی

مقالات تخصصی، داستان‌های آموزنده و مطالب عمیق در زمینه سیر و سلوک و رشد معنوی

مطالعه مطالب

مناجات و ادعیه

مجموعه کامل ادعیه، مناجات‌ها و اذکار با ترجمه و تفسیر برای استفاده در اوقات مختلف

مشاهده ادعیه

جامعه معنوی

ارتباط با دیگر علاقه‌مندان، پرسش و پاسخ دینی و مشارکت در بحث‌های سازنده معنوی

پیوستن به جامعه

پرسش و پاسخ

پاسخ به سوالات دینی و راهنمایی در مسائل مذهبی با کمک متخصصان و کارشناسان

پرسش سوال

تاریخ ادیان

مطالعه تاریخ ادیان و تحولات مذهبی در طول زمان با بررسی منابع معتبر و تحقیقات جدید

مطالعه تاریخ

برگرفته از «https://www.pediabible.com/index.php?title=تست&oldid=4233»