مدیاویکی:Common.css: تفاوت میان نسخهها
صفحهای تازه حاوی «←دستورات این بخش همهٔ کاربران را تحت تاثیر قرار میدهند.: ←لود کردن فونت وزیرمتن: @import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;700&display=swap'); ←اعمال فونت روی کل بدنه سایت: body { font-family: 'Vazirmatn', sans-serif !important; } ←اعمال فونت روی تایتلها و منوها: h1, h2,...» ایجاد کرد |
بدون خلاصۀ ویرایش |
||
| (۶ نسخهٔ میانیِ ایجادشده توسط همین کاربر نشان داده نشد) | |||
| خط ۱: | خط ۱: | ||
/* دستورات این بخش همهٔ کاربران را تحت تاثیر قرار میدهند. */ | /* دستورات این بخش همهٔ کاربران را تحت تاثیر قرار میدهند. */ | ||
/* اعمال فونت | /* فونت لوکال وزیرمتن */ | ||
@font-face { | |||
font-family: 'Vazirmatn'; | |||
src: url('/fonts/Vazirmatn-Regular.woff2') format('woff2'); | |||
font-weight: 400; | |||
font-style: normal; | |||
font-display: swap; | |||
} | |||
@font-face { | |||
font-family: 'Vazirmatn'; | |||
src: url('/fonts/Vazirmatn-Bold.woff2') format('woff2'); | |||
font-weight: 700; | |||
font-style: normal; | |||
font-display: swap; | |||
} | |||
/* اعمال فونت */ | |||
body, h1, h2, h3, h4, h5, h6, p, div, span, a, button, input, textarea, select, .mw-body, .mw-heading, .vector-menu-heading, td, th { | |||
font-family: 'Vazirmatn', Tahoma, sans-serif !important; | |||
} | |||
/* تنظیمات پایه */ | |||
body { | body { | ||
font- | direction: rtl; | ||
text-align: right; | |||
} | |||
/* کلاس برای لیست چند ستونه */ | |||
.cols-2 { column-count: 2; column-gap: 20px; } | |||
.cols-3 { column-count: 3; column-gap: 20px; } | |||
.cols-4 { column-count: 4; column-gap: 20px; } | |||
/* تنظیمات کلی باکس */ | |||
.infobox-universal { | |||
/* گزینه 1: افزودن سایه برای عمق دادن */ | |||
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); | |||
/* گزینه 2: گرد کردن گوشهها (مقدار بیشتر از قبل) */ | |||
border-radius: 12px; | |||
float: left; | |||
width: 300px; | |||
background: #f8f9fa; | |||
border: 1px solid #a2a9b1; /* حاشیه نازک دور کل باکس */ | |||
border-collapse: separate; /* برای نمایش درست گوشههای گرد */ | |||
border-spacing: 0; | |||
margin: 0 15px 10px 0; | |||
font-size: 90%; | |||
line-height: 1.5; | |||
overflow: hidden; | |||
} | |||
/* عنوان اصلی */ | |||
.infobox-universal th { | |||
/* گزینه 3: گرادینت رنگی برای عنوان اصلی */ | |||
background: linear-gradient(to bottom, #b0c4de, #8ecae6); | |||
padding: 12px; | |||
text-align: center; | |||
font-weight: bold; | |||
font-size: 110%; | |||
color: #1e3a5f; /* رنگ متن تیرهتر برای خوانایی روی گرادینت */ | |||
/* گزینه 6: خط ضخیمتر زیر عنوان اصلی */ | |||
border-bottom: 3px solid #5a8eb5; | |||
} | |||
/* هدر بخشها */ | |||
.infobox-section td { | |||
/* گزینه 3: گرادینت ملایم برای هدر بخشها */ | |||
background: linear-gradient(to bottom, #e8cce8, #f3d6f3); | |||
font-weight: bold; | |||
text-align: center; | |||
padding: 8px; | |||
font-size: 95%; | |||
/* گزینه 6: حاشیههای مشخص برای هدر بخشها */ | |||
border-top: 1px solid #d3b5d3; | |||
border-bottom: 2px solid #d3b5d3; | |||
} | |||
/* سلولهای داده و لیبل */ | |||
.infobox-universal td { | |||
padding: 8px 10px; | |||
vertical-align: top; | |||
/* گزینه 6: حذف حاشیههای بین سطرها برای ظاهر تمیز */ | |||
border-bottom: none !important; | |||
} | |||
/* گزینه 4: افکت هاور (رفتن موس روی سطرها) */ | |||
.infobox-universal tr:hover td { | |||
background-color: #eef6fc !important; /* رنگ آبی بسیار کمرنگ */ | |||
transition: background-color 0.3s ease; /* انیمیشن نرم */ | |||
} | |||
/* ستون عنوانها (لیبلها) */ | |||
.infobox-label { | |||
background: #eef3fb; | |||
font-weight: bold; | |||
width: 40%; | |||
color: #202122; | |||
} | |||
/* تصویر */ | |||
.infobox-image td { | |||
text-align: center; | |||
padding: 10px; | |||
background: #ffffff; | |||
border-bottom: 1px solid #e6e6e6; /* نگه داشتن خط زیر عکس */ | |||
} | } | ||
.infobox-image img { | |||
max-width: 100%; | |||
height: auto; | |||
border-radius: 4px; | |||
} | } | ||