پرش به محتوا

مدیاویکی:Common.css

از ویکی داد
نسخهٔ تاریخ ۱۱ سپتامبر ۲۰۲۶، ساعت ۲۰:۰۶ توسط Rasool (بحث | مشارکت‌ها)

نکته: پس از انتشار ممکن است برای دیدن تغییرات نیاز باشد که حافظهٔ نهانی مرورگر خود را پاک کنید.

  • فایرفاکس / سافاری: کلید Shift را نگه دارید و روی دکمهٔ Reload کلیک کنید، یا کلید‌های Ctrl-F5 یا Ctrl-R را با هم فشار دهید (در رایانه‌های اپل مکینتاش کلید‌های ⌘-R)
  • گوگل کروم: کلیدهای Ctrl+Shift+R را با هم فشار دهید (در رایانه‌های اپل مکینتاش کلید‌های ⌘-Shift-R)
  • Edge: کلید Ctrl را نگه‌دارید و روی دکمهٔ Refresh کلیک کنید، یا کلید‌های Ctrl-F5 را با هم فشار دهید
/* =========================================================
   ویکی‌داد — سیستم طراحی اصلی
   MediaWiki:Common.css
   نسخه یکپارچه و اصلاحی
   ========================================================= */


/* =========================================================
   1. متغیرهای اصلی طراحی
   ========================================================= */

:root {

    --law-primary: #168477;
    --law-primary-dark: #11695f;

    --law-link: #176c88;

    --law-gold: #c49a3a;
    --law-blue: #3978ad;
    --law-purple: #8064a2;
    --law-orange: #d38a27;

    --law-text: #263238;
    --law-text-soft: #546e7a;

    --law-bg: #ffffff;
    --law-bg-soft: #f7f9f8;

    --law-border: #dfe7e5;

    --law-shadow:
        0 4px 18px rgba(20, 60, 55, 0.07);

    --law-radius: 12px;

    --law-space: 24px;
}


/* =========================================================
   2. پایه صفحات فارسی
   ========================================================= */

html {
    direction: rtl;
}

body {
    direction: rtl;
    text-align: right;
    color: var(--law-text);
    font-family:
        "Vazirmatn",
        "IRANSans",
        Tahoma,
        Arial,
        sans-serif;
}

input,
textarea,
select,
button {
    font-family: inherit;
}


/* =========================================================
   3. صفحه حقوقی
   ========================================================= */

.law-page {
    direction: rtl;
    text-align: right;
    line-height: 2;
    font-family:
        "Vazirmatn",
        "IRANSans",
        Tahoma,
        Arial,
        sans-serif;
}


/* =========================================================
   4. لینک‌های صفحات حقوقی
   ========================================================= */

.law-page a {
    color: var(--law-link);
    font-weight: 500;
}

.law-page a:hover {
    color: var(--law-primary-dark);
}


/* =========================================================
   5. تیترهای اصلی صفحات
   ========================================================= */

.mw-body h1,
.mw-body h2,
.mw-body h3,
.mw-body h4 {
    color: var(--law-text);
    font-weight: 700;
}


/* =========================================================
   6. بردکرامب حقوقی
   =========================================================

   ساختار:

   [ قوانین و مقررات ] ← [ قانون کار ] ← [ فصل اول ] ← [ ماده ۲ ]

   هر سطح یک کادر مستقل دارد.
   فلش‌ها خارج از کادرها هستند.
   ماده جاری با رنگ سبز مشخص می‌شود.

   ========================================================= */

.wd-breadcrumb {

    direction: rtl;

    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap: 7px;

    margin: 12px 0 24px;
    padding: 0;

    font-family:
        "Vazirmatn",
        "IRANSans",
        Tahoma,
        Arial,
        sans-serif;

    font-size: 13px;

    line-height: 1.8;
}


/* ---------- کادرهای قابل کلیک ---------- */

.wd-breadcrumb-item {

    display: inline-flex;
    align-items: center;

    box-sizing: border-box;

    min-height: 34px;

    padding: 5px 12px;

    background: #f5f8f7;

    border: 1px solid #d8e3df;

    border-radius: 7px;

    color: #3f5d58;

    white-space: nowrap;

    transition:
        background 0.15s ease,
        border-color 0.15s ease,
        color 0.15s ease,
        transform 0.15s ease;
}


/* لینک داخل کادر */

.wd-breadcrumb-item a {

    color: #3d6861 !important;

    text-decoration: none !important;

    font-weight: 600;
}


/* هاور */

.wd-breadcrumb-item:hover {

    background: #edf5f2;

    border-color: #a9c8c1;

    transform: translateY(-1px);
}

.wd-breadcrumb-item:hover a {

    color: #11695f !important;
}


/* ---------- فلش بین کادرها ---------- */

.wd-breadcrumb-arrow {

    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-width: 17px;

    color: #8a9b97;

    font-size: 14px;
    font-weight: 600;

    user-select: none;
}


/* ---------- ماده جاری ---------- */

.wd-breadcrumb-current {

    display: inline-flex;
    align-items: center;

    box-sizing: border-box;

    min-height: 34px;

    padding: 5px 13px;

    background: #e5f1ed;

    border: 1px solid #b8d5cc;

    border-right: 3px solid #168477;

    border-radius: 7px;

    color: #11695f;

    font-weight: 800;

    white-space: nowrap;
}


/* ---------- لینک‌های داخل بردکرامب ---------- */

.wd-breadcrumb-item span[itemprop="name"],
.wd-breadcrumb-current span[itemprop="name"] {

    display: inline-block;
}


/* ---------- موبایل ---------- */

@media (max-width: 700px) {

    .wd-breadcrumb {

        gap: 5px;

        margin: 10px 0 18px;

        font-size: 12px;

        line-height: 1.7;
    }

    .wd-breadcrumb-item,
    .wd-breadcrumb-current {

        min-height: 31px;

        padding: 4px 9px;

        border-radius: 6px;
    }

    .wd-breadcrumb-arrow {

        min-width: 12px;

        font-size: 12px;
    }
}


/* =========================================================
   7. نکته مهم درباره جعبه ماده
   =========================================================

   طراحی نهایی الگو:جعبه ماده داخل خود Template قرار دارد.
   بنابراین اینجا عمداً روی آن background / padding / border
   تحمیل نمی‌کنیم تا طراحی نهایی Template خراب نشود.

   ========================================================= */


/* =========================================================
   8. اصطلاحات کلیدی
   ========================================================= */

.term-box {

    background: #f3eff8;

    border-right: 5px solid var(--law-purple);

    border-radius: 10px;

    padding: 18px 22px;

    margin: 18px 0;
}


/* =========================================================
   9. مواد مرتبط
   ========================================================= */

.related-laws-box {

    background: #f5f1e8;

    border-right: 5px solid var(--law-gold);

    border-radius: 10px;

    padding: 18px 22px;

    margin: 20px 0;
}

.related-laws-title {

    color: #80621e;

    font-weight: bold;

    font-size: 1.12em;
}


/* =========================================================
   10. رأی قضایی
   ========================================================= */

.judgment-box {

    background: #eef4fa;

    border-right: 5px solid var(--law-blue);

    border-radius: 10px;

    padding: 20px 24px;

    margin: 18px 0;
}

.judgment-title {

    color: #245d89;

    font-weight: bold;
}


/* =========================================================
   11. نظریه مشورتی
   ========================================================= */

.advisory-box {

    background: #f5f0e9;

    border-right: 5px solid #a9783b;

    border-radius: 10px;

    padding: 20px 24px;

    margin: 18px 0;
}


/* =========================================================
   12. شرح ماده
   ========================================================= */

.explanation-box {

    background: #ffffff;

    border-right: 5px solid var(--law-primary);

    border-radius: 10px;

    padding: 20px 24px;

    margin: 18px 0;

    box-shadow:
        0 2px 8px rgba(0, 0, 0, 0.06);
}


/* =========================================================
   13. جستارهای وابسته
   ========================================================= */

.related-topics-box {

    background: #f7f7f7;

    border-right: 4px solid #777;

    border-radius: 8px;

    padding: 18px 22px;

    margin: 20px 0;
}


/* =========================================================
   14. ناوبری مواد
   ========================================================= */

.law-navigation {

    margin: 35px 0;

    padding: 18px;

    background: #f1f7f6;

    border: 1px solid #c9e3df;

    border-radius: 12px;

    direction: rtl;
    text-align: center;
}

.law-navigation-title {

    color: var(--law-primary-dark);

    font-weight: bold;

    font-size: 1.15em;

    margin-bottom: 12px;
}


/* =========================================================
   15. فهرست قانون
   ========================================================= */

.wd-law-index {

    direction: rtl;
    text-align: right;

    margin: 24px 0;

    font-family:
        "Vazirmatn",
        "IRANSans",
        Tahoma,
        Arial,
        sans-serif;
}


/* ---------- سربرگ فهرست ---------- */

.wd-law-index-head {

    padding: 20px 22px;

    background:
        linear-gradient(
            135deg,
            #eef6f3 0%,
            #e5f0ed 100%
        );

    border-right: 5px solid var(--law-primary);

    border-radius: 10px;

    margin-bottom: 16px;
}

.wd-law-index-title {

    color: var(--law-primary-dark);

    font-size: 21px;

    font-weight: 800;

    line-height: 1.9;
}

.wd-law-index-description {

    margin-top: 5px;

    color: #5b6d69;

    font-size: 13px;

    line-height: 2;
}

.wd-law-index-meta {

    display: flex;

    flex-wrap: wrap;

    gap: 7px;

    margin-top: 12px;
}

.wd-law-index-meta span {

    display: inline-block;

    padding: 4px 9px;

    background: #ffffff;

    border: 1px solid #d8e3df;

    border-radius: 6px;

    color: #52635f;

    font-size: 11px;
}

.wd-law-index-status {

    font-weight: 700;
}


/* =========================================================
   16. فصل قانون
   ========================================================= */

.wd-law-chapter {

    margin: 12px 0;
}

.wd-law-chapter a {

    display: block;

    color: inherit !important;

    text-decoration: none !important;
}

.wd-law-chapter-clickable {

    display: flex;

    align-items: center;

    justify-content: space-between;

    width: 100%;

    box-sizing: border-box;

    min-height: 62px;

    padding: 12px 17px;

    background: #f1f6f4;

    border: 1px solid #d5e2de;

    border-right: 5px solid #2f6f68;

    border-radius: 9px;

    transition:
        background 0.15s ease,
        border-color 0.15s ease,
        transform 0.15s ease,
        box-shadow 0.15s ease;
}

.wd-law-chapter-clickable:hover {

    background: #e8f2ef;

    border-color: #a9c8c1;

    box-shadow:
        0 3px 10px rgba(30, 90, 80, 0.07);

    transform: translateY(-1px);
}

.wd-law-chapter-main {

    display: flex;

    flex-direction: column;

    min-width: 0;
}

.wd-law-chapter-title {

    color: #245b55;

    font-size: 16px;

    font-weight: 800;

    line-height: 1.9;
}

.wd-law-chapter-description {

    margin-top: 2px;

    color: #71817e;

    font-size: 12px;

    line-height: 1.8;
}

.wd-law-chapter-arrow {

    flex: 0 0 auto;

    margin-right: 15px;

    color: #397d74;

    font-size: 17px;

    font-weight: bold;
}


/* =========================================================
   17. مبحث قانون
   ========================================================= */

.wd-law-topic {

    margin: 9px 0;
}

.wd-law-topic a {

    display: block;

    color: inherit !important;

    text-decoration: none !important;
}

.wd-law-topic-clickable {

    display: flex;

    align-items: center;

    justify-content: space-between;

    width: 100%;

    box-sizing: border-box;

    min-height: 54px;

    padding: 10px 16px;

    background: #fafcfb;

    border: 1px solid #e0e7e4;

    border-right: 4px solid #719b94;

    border-radius: 8px;

    transition:
        background 0.15s ease,
        border-color 0.15s ease,
        transform 0.15s ease;
}

.wd-law-topic-clickable:hover {

    background: #f1f7f5;

    border-color: #b9d0ca;

    transform: translateY(-1px);
}

.wd-law-topic-main {

    display: flex;

    flex-direction: column;

    min-width: 0;
}

.wd-law-topic-title {

    color: #385f5a;

    font-size: 14px;

    font-weight: 700;

    line-height: 1.9;
}

.wd-law-topic-description {

    color: #7a8986;

    font-size: 11px;

    line-height: 1.8;
}

.wd-law-topic-arrow {

    flex: 0 0 auto;

    margin-right: 12px;

    color: #648b85;

    font-size: 15px;
}


/* =========================================================
   18. ماده در فهرست
   ========================================================= */

.wd-law-item {

    margin: 7px 0;
}

.wd-law-item a {

    display: block;

    color: inherit !important;

    text-decoration: none !important;
}

.wd-law-item-clickable {

    display: flex;

    align-items: center;

    width: 100%;

    box-sizing: border-box;

    min-height: 49px;

    padding: 8px 13px;

    background: #ffffff;

    border: 1px solid #e3e9e7;

    border-radius: 7px;

    transition:
        background 0.15s ease,
        border-color 0.15s ease,
        box-shadow 0.15s ease,
        transform 0.15s ease;
}

.wd-law-item-clickable:hover {

    background: #f7faf9;

    border-color: #b7d0c9;

    box-shadow:
        0 2px 8px rgba(20, 60, 55, 0.05);

    transform: translateY(-1px);
}

.wd-law-item-number {

    flex: 0 0 auto;

    min-width: 72px;

    color: #28706a;

    font-size: 13px;

    font-weight: 800;
}

.wd-law-item-text {

    display: flex;

    flex-direction: column;

    flex: 1;

    min-width: 0;
}

.wd-law-item-title {

    color: #3d514e;

    font-size: 13px;

    font-weight: 700;

    line-height: 1.8;
}

.wd-law-item-summary {

    margin-top: 1px;

    color: #7b8986;

    font-size: 11px;

    line-height: 1.8;
}

.wd-law-item-status {

    flex: 0 0 auto;

    margin-right: 9px;

    padding: 3px 7px;

    border-radius: 5px;

    background: #edf6f2;

    color: #34786e;

    font-size: 10px;

    font-weight: 700;
}

.wd-law-item-arrow {

    flex: 0 0 auto;

    margin-right: 9px;

    color: #79928d;

    font-size: 14px;
}


/* =========================================================
   19. جدول فهرست قدیمی
   ========================================================= */

.law-index-table {

    width: 100%;

    border-collapse: collapse;

    direction: rtl;

    margin: 20px 0;
}

.law-index-table th {

    background: var(--law-primary);

    color: #ffffff;

    padding: 10px;

    font-weight: 700;
}

.law-index-table td {

    padding: 9px;

    border: 1px solid #ddd;
}

.law-index-table tr:nth-child(even) {

    background: #f8fbfa;
}

.law-index-table a {

    text-decoration: none;
}


/* =========================================================
   20. سیستم تست تعاملی
   ========================================================= */

.wd-test {

    direction: rtl;

    text-align: right;

    margin: 32px 0;

    font-family:
        "Vazirmatn",
        "IRANSans",
        Tahoma,
        Arial,
        sans-serif;
}


/* ---------- گزینه‌ها ---------- */

.wd-test-options {

    display: flex;

    flex-direction: column;

    gap: 9px;
}

.wd-test-options ul {

    margin: 0 !important;

    padding: 0 !important;
}

.wd-test-options li {

    list-style: none !important;

    margin: 0 !important;

    padding: 0 !important;
}


/* ---------- خود گزینه ---------- */

.wd-test-option {

    display: flex;

    align-items: center;

    width: 100%;

    box-sizing: border-box;

    padding: 12px 15px;

    background: #ffffff;

    border: 1px solid #dfe7e5;

    border-radius: 8px;

    color: #37474f !important;

    font-family:
        "Vazirmatn",
        "IRANSans",
        Tahoma,
        Arial,
        sans-serif;

    font-size: 15px;

    line-height: 1.9;

    text-align: right;

    cursor: pointer;

    user-select: none;

    transition:
        background 0.15s ease,
        border-color 0.15s ease,
        transform 0.15s ease;
}

.wd-test-option:hover {

    background: #f7faf9;

    border-color: var(--law-primary);

    transform: translateY(-1px);
}


/* ---------- مربع گزینه ---------- */

.wd-test-option::before {

    content: "□";

    flex: 0 0 auto;

    margin-left: 11px;

    font-size: 21px;

    line-height: 1;

    color: #78909c;
}

.wd-test-option.wd-selected::before {

    content: "☑";
}


/* ---------- پاسخ صحیح ---------- */

.wd-test-option.wd-correct {

    background: #edf8f2;

    border-color: #4b9b57;

    color: #276b35 !important;
}

.wd-test-option.wd-correct::before {

    color: #4b9b57;
}


/* ---------- پاسخ غلط ---------- */

.wd-test-option.wd-wrong {

    background: #fff1f1;

    border-color: #c85b5b;

    color: #9a3f3f !important;
}

.wd-test-option.wd-wrong::before {

    content: "☒";

    color: #c85b5b;
}


/* ---------- نتیجه ---------- */

.wd-test-result-message.wd-result-correct {

    color: #287653;
}

.wd-test-result-message.wd-result-wrong {

    color: #a04444;
}

.wd-test.wd-test-finished .wd-test-option {

    cursor: default;
}

.wd-test.wd-test-finished .wd-test-option:hover {

    transform: none;
}


/* ---------- نوع سؤال ---------- */

.wd-test-source {

    font-size: 12px;

    font-weight: normal;

    color: var(--law-purple);

    white-space: nowrap;
}


/* =========================================================
   21. سیستم قدیمی بانک تست — حفظ سازگاری
   ========================================================= */

.test-bank {

    margin: 25px 0;
}

.test-card {

    border-radius: 12px;

    padding: 20px 22px;

    margin: 22px 0;

    box-shadow:
        0 3px 12px rgba(0, 0, 0, 0.07);

    direction: rtl;

    text-align: right;
}

.test-official {

    background: #edf6fc;

    border-right: 6px solid var(--law-blue);
}

.test-official .test-label {

    color: #245d89;
}

.test-authored {

    background: #f5effa;

    border-right: 6px solid var(--law-purple);
}

.test-authored .test-label {

    color: #694d8b;
}

.test-trap {

    background: #fff5e7;

    border-right: 6px solid var(--law-orange);
}

.test-trap .test-label {

    color: #a56311;
}

.test-label {

    font-weight: bold;

    font-size: .92em;

    margin-bottom: 10px;
}

.test-option {

    display: block;

    background: rgba(255,255,255,.72);

    border: 1px solid #ddd;

    border-radius: 8px;

    padding: 10px 13px;

    margin: 8px 0;

    cursor: pointer;
}

.test-option:hover {

    background: #ffffff;
}

.test-answer {

    margin-top: 15px;

    padding: 15px 18px;

    background: #eef8ef;

    border-right: 4px solid #4b9b57;

    border-radius: 8px;
}

.test-answer-title {

    color: #31743a;

    font-weight: bold;
}

.exam-tip {

    background: #fff9df;

    border-right: 4px solid #d0a928;

    border-radius: 8px;

    padding: 13px 16px;

    margin-top: 12px;
}


/* =========================================================
   22. منابع و مآخذ
   ========================================================= */

.wd-references {

    direction: rtl;

    text-align: right;

    font-family:
        "Vazirmatn",
        "IRANSans",
        Tahoma,
        Arial,
        sans-serif;

    font-size: 13px;

    color: #52615e;
}

.wd-references ol {

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    column-gap: 28px;

    row-gap: 2px;

    margin: 0 !important;

    padding: 0 !important;

    list-style: none !important;

    counter-reset: wd-reference;
}

.wd-references li {

    position: relative;

    box-sizing: border-box;

    margin: 0 !important;

    padding: 4px 27px 4px 0 !important;

    background: transparent !important;

    border: 0 !important;

    border-radius: 0 !important;

    line-height: 1.9;

    min-height: 0;

    counter-increment: wd-reference;
}

.wd-references li::before {

    content: counter(wd-reference);

    position: absolute;

    right: 0;

    top: 50%;

    transform: translateY(-50%);

    color: var(--law-primary);

    font-size: 11px;

    font-weight: 800;
}

.wd-references a {

    color: var(--law-link);

    text-decoration: none;
}

.wd-references a:hover {

    color: var(--law-primary-dark);

    text-decoration: underline;
}

.wd-references .mw-cite-backlink {

    margin-right: 4px;

    white-space: nowrap;
}

.wd-references .mw-cite-backlink a {

    color: var(--law-primary);

    font-weight: bold;
}


/* =========================================================
   23. جزئیات بازشونده
   ========================================================= */

.law-collapsible {

    margin: 20px 0;

    border: 1px solid var(--law-border);

    border-radius: 10px;

    background: #ffffff;

    overflow: hidden;
}

.law-collapsible summary {

    cursor: pointer;

    padding: 13px 17px;

    background: #f4f8f6;

    color: var(--law-primary-dark);

    font-weight: 800;

    list-style: none;
}

.law-collapsible summary::-webkit-details-marker {

    display: none;
}

.law-collapsible > div,
.law-collapsible > p {

    padding: 0 18px;
}


/* =========================================================
   24. صفحه اصلی
   ========================================================= */

.wd-home {

    direction: rtl;

    text-align: right;

    font-family:
        "Vazirmatn",
        "IRANSans",
        Tahoma,
        Arial,
        sans-serif;
}

.wd-hero {

    margin-bottom: 28px;

    padding: 34px 28px;

    background:
        linear-gradient(
            135deg,
            #edf7f4 0%,
            #e2f0ec 100%
        );

    border-right: 6px solid var(--law-primary);

    border-radius: 12px;

    box-shadow:
        0 4px 18px rgba(20, 60, 55, .07);
}

.wd-hero-title {

    color: var(--law-primary-dark);

    font-size: 30px;

    font-weight: 900;

    line-height: 1.7;
}

.wd-hero-subtitle {

    margin-top: 5px;

    color: #60736f;

    font-size: 15px;

    line-height: 2;
}

.wd-search-box {

    margin-top: 22px;
}


/* =========================================================
   25. جداول عمومی حقوقی
   ========================================================= */

.mw-body table {

    direction: rtl;
}


/* =========================================================
   26. لیست‌های داخل صفحات حقوقی
   ========================================================= */

.law-page ul,
.law-page ol {

    line-height: 2.1;
}

.law-page li {

    margin-bottom: 4px;
}


/* =========================================================
   27. لینک‌های داخلی در محتوای حقوقی
   ========================================================= */

.law-page a {

    color: var(--law-link);

    text-decoration: none;
}

.law-page a:hover {

    color: #0e4e63;

    text-decoration: underline;
}


/* =========================================================
   28. موبایل — فهرست قوانین
   ========================================================= */

@media (max-width: 700px) {

    .wd-law-index-head {

        padding: 16px 15px;
    }

    .wd-law-index-title {

        font-size: 18px;
    }

    .wd-law-chapter-clickable {

        min-height: 55px;

        padding: 10px 12px;
    }

    .wd-law-chapter-title {

        font-size: 14px;
    }

    .wd-law-topic-clickable {

        padding: 9px 11px;
    }

    .wd-law-topic-title {

        font-size: 13px;
    }

    .wd-law-item-clickable {

        padding: 8px 10px;
    }

    .wd-law-item-number {

        min-width: 63px;

        font-size: 12px;
    }

    .wd-law-item-title {

        font-size: 12px;
    }

    .wd-law-item-summary {

        font-size: 10px;
    }

    .wd-references ol {

        grid-template-columns: 1fr;

        column-gap: 0;
    }

}


/* =========================================================
   29. چاپ
   ========================================================= */

@media print {

    .wd-breadcrumb {

        margin-bottom: 15px;
    }

    .wd-breadcrumb-item,
    .wd-breadcrumb-current {

        background: #ffffff !important;

        border-color: #999 !important;

        color: #000 !important;
    }

    .wd-breadcrumb-arrow {

        color: #555 !important;
    }

    .wd-test-option {

        break-inside: avoid;
    }

    .law-navigation {

        break-inside: avoid;
    }

}
برگرفته از «https://wikidad.ir/index.php?title=مدیاویکی:Common.css&oldid=284»