الگو:جعبه اطلاعات کتاب: تفاوت میان نسخه‌ها

→ تفاوت با ویرایش قدیمی‌تر تفاوت با ویرایش جدیدتر ←

دیداریویکی‌متن

@@ خط ۳: / خط ۳: @@
 </noinclude>
 <includeonly>
-<div class="book-template" style="display: flex; direction: rtl; margin: 15px 0; border: 1px solid #e0e0e0; padding: 20px; background: #ffffff; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); flex-wrap: wrap;">
+<div style="display: table; width: 100%; direction: rtl; margin: 15px 0; border: 1px solid #e0e0e0; padding: 20px; background: #ffffff; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.1);">
-     <!-- بخش عکس کتاب برای دسکتاپ -->
+     <!-- بخش عکس کتاب -->
-     <div class="book-image-desktop" style="margin-left: 20px; flex: 0 0 200px;">
+     <div style="display: table-cell; vertical-align: top; width: 200px; padding-left: 20px; text-align: center;">
-        <div style="text-align: center;">
+         [[پرونده:{{{عکس|}}}|200px|فریم|پیوند={{{لینک_عکس|}}}|alt=جلد کتاب {{{عنوان|}}}]]
-            [[پرونده:{{{عکس|}}}|200px|فریم|پیوند={{{لینک_عکس|}}}|alt=جلد کتاب {{{عنوان|}}}]]
-        </div>
-    </div>
-    <!-- بخش عکس کتاب برای موبایل -->
-    <div class="book-image-mobile" style="width: 100%; text-align: center; margin-bottom: 20px; display: none;">
-         [[پرونده:{{{عکس|}}}|250px|فریم|پیوند={{{لینک_عکس|}}}|alt=جلد کتاب {{{عنوان|}}}]]
      </div>
      <!-- بخش مشخصات کتاب -->
-     <div class="book-info" style="flex: 1; min-width: 250px;">
+     <div style="display: table-cell; vertical-align: top;">
          <h2 style="margin: 0 0 15px 0; color: #2c3e50; font-size: 1.4em; border-bottom: 2px solid #3498db; padding-bottom: 8px;">{{{عنوان|}}}</h2>
@@ خط ۲۹: / خط ۲۲: @@
          <!-- بخش کادر رنگی برای دانلود -->
-         <div style="background: linear-gradient(135deg, #e8f4fd, #d6eaf8); padding: 15px; border-radius: 8px; border-right: 4px solid #3498db; margin-top: 20px;">
+         <div style="background: #e8f4fd; padding: 15px; border-radius: 8px; border-right: 4px solid #3498db; margin-top: 20px;">
              <strong style="display: block; margin-bottom: 10px; color: #2c3e50; font-size: 1.1em;">📥 دریافت کتاب</strong>
-             <div style="display: flex; gap: 15px; flex-wrap: wrap;">
+             <div>
-                 <span style="background: #3498db; padding: 8px 15px; border-radius: 5px;">
+                 <span style="background: #3498db; padding: 8px 15px; border-radius: 5px; margin-left: 10px;">
                      [[:پرونده:{{{فایل_کتاب|}}}|<span style="color: white; text-decoration: none;">📋 دانلود کتاب</span>]]
                  </span>
@@ خط ۴۳: / خط ۳۶: @@
 </div>
-<style>
+<!-- برای موبایل از طریق MediaWiki CSS -->
-/* تنظیمات برای موبایل */
+<div style="display: none; direction: rtl; margin: 15px 0; border: 1px solid #e0e0e0; padding: 20px; background: #ffffff; border-radius: 8px; text-align: center;">
-@media only screen and (max-width: 768px) {
+     [[پرونده:{{{عکس|}}}|250px|فریم|پیوند={{{لینک_عکس|}}}|alt=جلد کتاب {{{عنوان|}}}]]
-    .book-template {
-        flex-direction: column;
+    <h2 style="margin: 15px 0; color: #2c3e50; font-size: 1.4em; border-bottom: 2px solid #3498db; padding-bottom: 8px;">{{{عنوان|}}}</h2>
-        padding: 15px;
-     }
+     <div style="margin-bottom: 15px; line-height: 1.8; text-align: right;">
-     .book-image-desktop {
+        <strong>✍️ نویسنده:</strong> {{{نویسنده|}}}<br>
-        display: none !important;
+         <strong>🏢 ناشر:</strong> {{{ناشر|}}}<br>
-     }
+        <strong>📅 سال انتشار:</strong> {{{سال|}}}<br>
-     .book-image-mobile {
+         <strong>📄 تعداد صفحات:</strong> {{{صفحات|}}}
-         display: block !important;
+     </div>
-    }
-    .book-info {
-         width: 100%;
-     }
-}
-/* تنظیمات برای تبلت */
+    <div style="background: #e8f4fd; padding: 15px; border-radius: 8px; border-right: 4px solid #3498db;">
-@media only screen and (max-width: 1024px) and (min-width: 769px) {
+        <strong style="display: block; margin-bottom: 10px; color: #2c3e50; font-size: 1.1em;">📥 دریافت کتاب</strong>
-    .book-template {
+        <div style="display: flex; flex-direction: column; gap: 10px;">
-        padding: 15px;
+            <span style="background: #3498db; padding: 10px; border-radius: 5px;">
-    }
+                [[:پرونده:{{{فایل_کتاب|}}}|<span style="color: white; text-decoration: none;">📋 دانلود کتاب</span>]]
-    .book-image-desktop {
+            </span>
-        margin-left: 15px;
+            <span style="background: #27ae60; padding: 10px; border-radius: 5px;">
-         flex: 0 0 180px;
+                [{{{لینک_مطالعه|}}} <span style="color: white; text-decoration: none;">📖 مطالعه آنلاین</span>]
-     }
+            </span>
-}
+         </div>
-</style>
+     </div>
-</includeonly>
+</div>
+</includeonly><noinclude>