مدیاویکی:Common.css: تفاوت میان نسخهها
Esfandiari (بحث | مشارکتها) بدون خلاصۀ ویرایش |
Esfandiari (بحث | مشارکتها) بدون خلاصۀ ویرایش |
||
| خط ۸۲۲: | خط ۸۲۲: | ||
} | } | ||
/* کانتینر اصلی برای نگه داشتن عنوان و گرید */ | |||
.grid-wrapper { | |||
margin: 20px 0; | |||
padding: 15px; | |||
border: 1px solid #dbe7ff; | |||
border-radius: 8px; | |||
background-color: #ffffff; | |||
} | |||
/* استایل عنوان دستهبندی */ | |||
.grid-title { | |||
text-align: center; | |||
font-size: 18px; | |||
font-weight: bold; | |||
color: #5a8ab8; | |||
margin-bottom: 20px; | |||
padding-bottom: 10px; | |||
border-bottom: 2px solid #9bbbd9; | |||
} | |||
/* شبکه ۱۰ ستونه شما */ | |||
.main-grid { | .main-grid { | ||
display: grid; | display: grid; | ||
grid-template-columns: repeat(10, 1fr); | grid-template-columns: repeat(10, 1fr); | ||
gap: 10px; | gap: 10px; | ||
justify-items: center; | justify-items: center; | ||
} | } | ||
| خط ۸۳۶: | خط ۸۵۴: | ||
border: 2px solid #9bbbd9; | border: 2px solid #9bbbd9; | ||
border-radius: 6px; | border-radius: 6px; | ||
width: 100px; | |||
height: 40px; | |||
width: 100px; | |||
height: 40px; | |||
font-size: 13px; | font-size: 13px; | ||
display: flex; | display: flex; | ||
align-items: center; | align-items: center; | ||
justify-content: center; | justify-content: center; | ||
transition: all 0.2s ease-in-out; | transition: all 0.2s ease-in-out; | ||
} | } | ||
| خط ۸۵۶: | خط ۸۶۹: | ||
} | } | ||
/* تنظیم ریسپانسیو | /* تنظیم ریسپانسیو */ | ||
@media (max-width: 900px) { | @media (max-width: 900px) { | ||
.main-grid { | .main-grid { | ||
| خط ۸۶۲: | خط ۸۷۵: | ||
} | } | ||
.grid-item { | .grid-item { | ||
width: 80px; | width: 80px; | ||
height: 35px; | height: 35px; | ||
} | } | ||
} | } | ||