مدیاویکی:Common.css: تفاوت میان نسخه‌ها

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

@@ خط ۹۷۰: / خط ۹۷۰: @@
 }
+/* استایل اختصاصی برای شبکه استان‌ها */
-/* برای دسته‌بندی استان‌ها */
 .provinces-grid .main-grid {
      display: grid;
-     grid-template-columns: repeat(6, 1fr); /* فقط اینجا ۶ ستونه است */
+     grid-template-columns: repeat(5, 1fr); /* ۵ ستون */
-     gap: 10px;
+     gap: 15px;
+    justify-items: center;
 }
-/* برای دسته‌بندی‌های دیگر (مثلاً موضوعی) */
+/* ریسپانسیو اختصاصی برای استان‌ها */
-.category-grid .main-grid {
+@media (max-width: 900px) {
-    display: grid;
+    .provinces-grid .main-grid {
-    grid-template-columns: repeat(4, 1fr); /* اینجا مثلاً ۴ ستونه است */
+        grid-template-columns: repeat(3, 1fr); /* تبلت ۳ ستونه */
-     gap: 10px;
+     }
 }
-/* آیتم‌ها می‌توانند استایل مشترک داشته باشند */
+@media (max-width: 500px) {
-.grid-item {
+    .provinces-grid .main-grid {
-    background-color: #f4f7fa;
+        grid-template-columns: repeat(2, 1fr); /* موبایل ۲ ستونه */
-    border: 2px solid #9bbbd9;
+    }
-    padding: 8px;
-    border-radius: 6px;
-    /* ... سایر استایل‌های مشترک */
 }