|
|
| (Aynı kullanıcının aradaki diğer 2 değişikliği gösterilmiyor) |
| 1. satır: |
1. satır: |
| /* ============================
| | #coordinates { |
| FM WIKI – PROFESSIONAL DESIGN SYSTEM
| | line-height: 2; |
| Production-ready, scalable & maintainable
| | font-size: 92%; |
| Version: 2.0
| | white-space: nowrap; |
| ============================ */
| |
| | |
| /* ============================
| |
| DESIGN TOKENS – FOUNDATION
| |
| Tüm renk, spacing ve tipografi değerleri merkezi
| |
| ============================ */
| |
| :root {
| |
| /* Semantic color system */
| |
| --color-bg-primary: #0d1117;
| |
| --color-bg-secondary: #161b22;
| |
| --color-bg-tertiary: #21262d;
| |
| --color-bg-elevated: #1c2128;
| |
|
| |
| /* Surface & overlays */
| |
| --color-surface: #161b22;
| |
| --color-surface-hover: #21262d;
| |
| --color-overlay: rgba(13, 17, 23, 0.95);
| |
|
| |
| /* Brand colors */
| |
| --color-brand-primary: #2ea043;
| |
| --color-brand-hover: #3fb950;
| |
| --color-brand-active: #238636;
| |
| --color-brand-muted: rgba(46, 160, 67, 0.1);
| |
|
| |
| /* Text hierarchy */
| |
| --color-text-primary: #e6edf3;
| |
| --color-text-secondary: #7d8590;
| |
| --color-text-tertiary: #484f58;
| |
| --color-text-inverse: #ffffff;
| |
| --color-text-link: #3fb950;
| |
| --color-text-link-visited: #58a6ff;
| |
|
| |
| /* Borders & dividers */
| |
| --color-border-default: #30363d;
| |
| --color-border-muted: #21262d;
| |
| --color-border-emphasis: #2ea043;
| |
|
| |
| /* Functional colors */
| |
| --color-danger: #da3633;
| |
| --color-warning: #bf8700;
| |
| --color-info: #1f6feb;
| |
| --color-success: #2ea043;
| |
|
| |
| /* Spacing scale (8px base) */
| |
| --space-1: 0.25rem; /* 4px */
| |
| --space-2: 0.5rem; /* 8px */
| |
| --space-3: 0.75rem; /* 12px */
| |
| --space-4: 1rem; /* 16px */
| |
| --space-5: 1.5rem; /* 24px */
| |
| --space-6: 2rem; /* 32px */
| |
| --space-8: 3rem; /* 48px */
| |
| --space-10: 4rem; /* 64px */
| |
|
| |
| /* Typography scale */
| |
| --font-size-xs: 0.75rem; /* 12px */
| |
| --font-size-sm: 0.875rem; /* 14px */
| |
| --font-size-base: 0.9375rem; /* 15px */
| |
| --font-size-md: 1rem; /* 16px */
| |
| --font-size-lg: 1.25rem; /* 20px */
| |
| --font-size-xl: 1.5rem; /* 24px */
| |
| --font-size-2xl: 2rem; /* 32px */
| |
|
| |
| /* Line heights */
| |
| --line-height-tight: 1.25;
| |
| --line-height-base: 1.6;
| |
| --line-height-relaxed: 1.75;
| |
|
| |
| /* Font weights */
| |
| --font-weight-normal: 400;
| |
| --font-weight-medium: 500;
| |
| --font-weight-semibold: 600;
| |
| --font-weight-bold: 700;
| |
|
| |
| /* Border radius */
| |
| --radius-sm: 4px;
| |
| --radius-md: 6px;
| |
| --radius-lg: 8px;
| |
| --radius-xl: 12px;
| |
| --radius-full: 999px;
| |
|
| |
| /* Shadows */
| |
| --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
| |
| --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
| |
| --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.5);
| |
| --shadow-xl: 0 12px 36px rgba(0, 0, 0, 0.6);
| |
|
| |
| /* Transitions */
| |
| --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
| |
| --transition-base: 200ms cubic-bezier(0.4, 0, 0.2, 1);
| |
| --transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);
| |
|
| |
| /* Z-index scale */
| |
| --z-base: 1;
| |
| --z-dropdown: 100;
| |
| --z-sticky: 200;
| |
| --z-fixed: 300;
| |
| --z-modal: 400;
| |
| --z-tooltip: 500;
| |
| }
| |
| | |
| /* ============================
| |
| RESET & BASE STYLES
| |
| ============================ */
| |
| .skin-vector-2022,
| |
| .skin-vector-2022 body {
| |
| background: var(--color-bg-primary);
| |
| color: var(--color-text-primary);
| |
| font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans', Helvetica, Arial, sans-serif;
| |
| font-size: var(--font-size-base);
| |
| line-height: var(--line-height-base);
| |
| -webkit-font-smoothing: antialiased;
| |
| -moz-osx-font-smoothing: grayscale;
| |
| }
| |
| | |
| .skin-vector-2022 *,
| |
| .skin-vector-2022 *::before,
| |
| .skin-vector-2022 *::after {
| |
| box-sizing: border-box;
| |
| }
| |
| | |
| .skin-vector-2022 #mw-page-base,
| |
| .skin-vector-2022 .mw-page-container,
| |
| .skin-vector-2022 .mw-page-container-inner,
| |
| .skin-vector-2022 .vector-body {
| |
| background: transparent;
| |
| }
| |
| | |
| .skin-vector-2022 .mw-page-container {
| |
| max-width: 100%;
| |
| padding: 0 var(--space-4);
| |
| }
| |
| | |
| /* ============================
| |
| HEADER & NAVIGATION
| |
| ============================ */
| |
| .skin-vector-2022 .vector-header-container {
| |
| background: var(--color-bg-secondary);
| |
| border-bottom: 1px solid var(--color-border-default);
| |
| box-shadow: var(--shadow-sm);
| |
| position: sticky;
| |
| top: 0;
| |
| z-index: var(--z-sticky);
| |
| }
| |
| | |
| .skin-vector-2022 .vector-header-start,
| |
| .skin-vector-2022 .vector-header-end {
| |
| background: transparent;
| |
| }
| |
| | |
| /* Logo & branding */
| |
| .skin-vector-2022 .mw-wiki-title {
| |
| color: var(--color-text-inverse);
| |
| font-weight: var(--font-weight-bold);
| |
| font-size: var(--font-size-lg);
| |
| letter-spacing: -0.02em;
| |
| }
| |
| | |
| /* Navigation links */
| |
| .skin-vector-2022 .vector-header a,
| |
| .skin-vector-2022 .vector-menu-tabs a {
| |
| color: var(--color-text-primary);
| |
| font-weight: var(--font-weight-medium);
| |
| transition: color var(--transition-fast);
| |
| }
| |
| | |
| .skin-vector-2022 .vector-header a:hover {
| |
| color: var(--color-text-inverse);
| |
| }
| |
| | |
| /* Active tab state */
| |
| .skin-vector-2022 .vector-menu-tabs .selected a {
| |
| background: var(--color-brand-primary);
| |
| color: var(--color-text-inverse);
| |
| border-radius: var(--radius-md);
| |
| padding: var(--space-2) var(--space-3);
| |
| }
| |
| | |
| /* Search input */
| |
| .skin-vector-2022 .vector-search-box input {
| |
| background: var(--color-bg-tertiary);
| |
| border: 1px solid var(--color-border-default);
| |
| border-radius: var(--radius-md);
| |
| color: var(--color-text-primary);
| |
| padding: var(--space-2) var(--space-3);
| |
| transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
| |
| }
| |
| | |
| .skin-vector-2022 .vector-search-box input:focus {
| |
| border-color: var(--color-brand-primary);
| |
| box-shadow: 0 0 0 3px var(--color-brand-muted);
| |
| outline: none;
| |
| }
| |
| | |
| /* ============================
| |
| MAIN CONTENT AREA
| |
| ============================ */
| |
| .skin-vector-2022 .mw-body {
| |
| background: transparent;
| |
| }
| |
| | |
| .skin-vector-2022 .mw-body-content {
| |
| background: var(--color-bg-secondary);
| |
| border: 1px solid var(--color-border-default);
| |
| border-radius: var(--radius-lg);
| |
| padding: var(--space-6);
| |
| margin: var(--space-4) 0;
| |
| box-shadow: var(--shadow-md);
| |
| }
| |
| | |
| /* ============================
| |
| TYPOGRAPHY SYSTEM
| |
| ============================ */
| |
| | |
| /* Heading hierarchy */
| |
| .skin-vector-2022 h1 {
| |
| color: var(--color-text-inverse);
| |
| font-size: var(--font-size-2xl);
| |
| font-weight: var(--font-weight-bold);
| |
| line-height: var(--line-height-tight);
| |
| margin: 0 0 var(--space-5);
| |
| padding-bottom: var(--space-3);
| |
| border-bottom: 2px solid var(--color-border-default);
| |
| letter-spacing: -0.02em;
| |
| }
| |
| | |
| .skin-vector-2022 .mw-parser-output h2 {
| |
| color: var(--color-text-inverse);
| |
| font-size: var(--font-size-xl);
| |
| font-weight: var(--font-weight-bold);
| |
| line-height: var(--line-height-tight);
| |
| margin: var(--space-6) 0 var(--space-4);
| |
| padding: var(--space-3) var(--space-4);
| |
| background: var(--color-bg-tertiary);
| |
| border-left: 4px solid var(--color-brand-primary);
| |
| border-radius: var(--radius-sm);
| |
| }
| |
| | |
| .skin-vector-2022 .mw-parser-output h3 {
| |
| color: var(--color-text-inverse);
| |
| font-size: var(--font-size-lg);
| |
| font-weight: var(--font-weight-semibold);
| |
| line-height: var(--line-height-tight);
| |
| margin: var(--space-5) 0 var(--space-3);
| |
| }
| |
| | |
| .skin-vector-2022 .mw-parser-output h4 {
| |
| color: var(--color-text-primary);
| |
| font-size: var(--font-size-md);
| |
| font-weight: var(--font-weight-semibold);
| |
| margin: var(--space-4) 0 var(--space-2);
| |
| }
| |
| | |
| /* Body text */
| |
| .skin-vector-2022 .mw-parser-output p {
| |
| color: var(--color-text-primary);
| |
| margin: var(--space-3) 0;
| |
| }
| |
| | |
| .skin-vector-2022 .mw-parser-output small {
| |
| color: var(--color-text-secondary);
| |
| font-size: var(--font-size-sm);
| |
| }
| |
| | |
| /* ============================
| |
| LINKS & INTERACTIONS
| |
| ============================ */
| |
| .skin-vector-2022 .mw-parser-output a {
| |
| color: var(--color-text-link);
| |
| text-decoration: none;
| |
| font-weight: var(--font-weight-medium);
| |
| transition: color var(--transition-fast);
| |
| }
| |
| | |
| .skin-vector-2022 .mw-parser-output a:hover {
| |
| color: var(--color-text-inverse);
| |
| text-decoration: underline;
| |
| }
| |
| | |
| .skin-vector-2022 .mw-parser-output a:visited {
| |
| color: var(--color-text-link-visited);
| |
| }
| |
| | |
| /* External links */
| |
| .skin-vector-2022 .mw-parser-output a.external {
| |
| padding-right: 1.2em;
| |
| background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%233fb950' d='M10.5 1.5h-3v1h2.293L5.5 6.793l.707.707 4.293-4.293V6h1V1.5z'/%3E%3Cpath fill='%233fb950' d='M8.5 10.5h-7v-7h3v-1h-4v9h9v-4h-1z'/%3E%3C/svg%3E");
| |
| background-repeat: no-repeat;
| |
| background-position: right center;
| |
| }
| |
| | |
| /* ============================
| |
| LISTS
| |
| ============================ */
| |
| .skin-vector-2022 .mw-parser-output ul,
| |
| .skin-vector-2022 .mw-parser-output ol {
| |
| padding-left: var(--space-5);
| |
| margin: var(--space-3) 0;
| |
| }
| |
| | |
| .skin-vector-2022 .mw-parser-output li {
| |
| margin: var(--space-2) 0;
| |
| color: var(--color-text-primary);
| |
| }
| |
| | |
| .skin-vector-2022 .mw-parser-output ul li::marker {
| |
| color: var(--color-brand-primary);
| |
| }
| |
| | |
| /* ============================
| |
| TABLES – DATA PRESENTATION
| |
| ============================ */
| |
| .skin-vector-2022 table.wikitable {
| |
| background: var(--color-bg-tertiary);
| |
| border: 1px solid var(--color-border-default);
| |
| border-radius: var(--radius-md);
| |
| border-collapse: separate;
| |
| border-spacing: 0;
| |
| margin: var(--space-5) 0;
| |
| width: 100%;
| |
| overflow: hidden;
| |
| }
| |
| | |
| .skin-vector-2022 table.wikitable thead th {
| |
| background: var(--color-brand-active);
| |
| color: var(--color-text-inverse);
| |
| font-weight: var(--font-weight-semibold);
| |
| font-size: var(--font-size-sm);
| |
| text-align: left;
| |
| text-transform: uppercase;
| |
| letter-spacing: 0.05em;
| |
| padding: var(--space-3) var(--space-4);
| |
| border-bottom: 2px solid var(--color-brand-primary);
| |
| }
| |
| | |
| .skin-vector-2022 table.wikitable tbody td,
| |
| .skin-vector-2022 table.wikitable tbody th {
| |
| padding: var(--space-3) var(--space-4);
| |
| border-bottom: 1px solid var(--color-border-muted);
| |
| color: var(--color-text-primary);
| |
| }
| |
| | |
| .skin-vector-2022 table.wikitable tbody tr {
| |
| transition: background-color var(--transition-fast);
| |
| }
| |
| | |
| .skin-vector-2022 table.wikitable tbody tr:hover {
| |
| background: var(--color-brand-muted);
| |
| }
| |
| | |
| .skin-vector-2022 table.wikitable tbody tr:last-child td {
| |
| border-bottom: none;
| |
| }
| |
| | |
| /* Responsive table wrapper */
| |
| @media (max-width: 768px) {
| |
| .skin-vector-2022 .table-wrapper {
| |
| overflow-x: auto;
| |
| -webkit-overflow-scrolling: touch;
| |
| }
| |
| }
| |
| | |
| /* ============================
| |
| INFOBOX – STRUCTURED DATA CARD
| |
| ============================ */
| |
| .skin-vector-2022 .infobox {
| |
| background: linear-gradient(180deg, #f6f8fa 0%, #ffffff 100%);
| |
| border: 2px solid var(--color-border-default);
| |
| border-radius: var(--radius-lg);
| |
| overflow: hidden;
| |
| margin: var(--space-4) 0 var(--space-4) var(--space-5);
| |
| float: right;
| |
| max-width: 320px;
| |
| box-shadow: var(--shadow-md);
| |
| }
| |
| | |
| .skin-vector-2022 .infobox caption {
| |
| background: linear-gradient(135deg, var(--color-brand-active), var(--color-brand-primary));
| |
| color: var(--color-text-inverse);
| |
| font-weight: var(--font-weight-bold);
| |
| font-size: var(--font-size-lg);
| |
| padding: var(--space-4);
| |
| text-align: center;
| |
| }
| |
| | |
| .skin-vector-2022 .infobox th {
| |
| background: #e8ebed;
| |
| color: #24292f;
| |
| font-weight: var(--font-weight-semibold);
| |
| font-size: var(--font-size-sm);
| |
| padding: var(--space-2) var(--space-3);
| |
| text-align: left;
| |
| border-bottom: 1px solid #d0d7de;
| |
| width: 35%;
| |
| vertical-align: top;
| |
| }
| |
| | |
| .skin-vector-2022 .infobox td {
| |
| background: #ffffff;
| |
| color: #24292f;
| |
| font-size: var(--font-size-sm);
| |
| padding: var(--space-2) var(--space-3);
| |
| border-bottom: 1px solid #d0d7de;
| |
| }
| |
| | |
| .skin-vector-2022 .infobox tr:last-child th,
| |
| .skin-vector-2022 .infobox tr:last-child td {
| |
| border-bottom: none;
| |
| }
| |
| | |
| /* Infobox images */
| |
| .skin-vector-2022 .infobox img {
| |
| display: block;
| |
| width: 100%;
| |
| height: auto;
| |
| border-radius: var(--radius-sm);
| |
| }
| |
| | |
| /* ============================
| |
| NAVBOX – NAVIGATION PANEL
| |
| ============================ */
| |
| .skin-vector-2022 .navbox {
| |
| background: var(--color-bg-tertiary);
| |
| border: 1px solid var(--color-border-default);
| |
| border-radius: var(--radius-md);
| |
| margin: var(--space-5) 0;
| |
| overflow: hidden;
| |
| }
| |
| | |
| .skin-vector-2022 .navbox-title {
| |
| background: var(--color-brand-active);
| |
| color: var(--color-text-inverse);
| |
| font-weight: var(--font-weight-bold);
| |
| font-size: var(--font-size-sm);
| |
| text-transform: uppercase;
| |
| letter-spacing: 0.05em;
| |
| padding: var(--space-3) var(--space-4);
| |
| }
| |
| | |
| .skin-vector-2022 .navbox-group {
| |
| background: var(--color-bg-secondary);
| |
| color: var(--color-text-link);
| |
| font-weight: var(--font-weight-semibold);
| |
| font-size: var(--font-size-sm);
| |
| padding: var(--space-2) var(--space-3);
| |
| border-right: 3px solid var(--color-brand-primary);
| |
| width: 140px;
| |
| vertical-align: top;
| |
| }
| |
| | |
| .skin-vector-2022 .navbox-list {
| |
| background: var(--color-bg-tertiary);
| |
| padding: var(--space-2) var(--space-3);
| |
| }
| |
| | |
| .skin-vector-2022 .navbox-list a {
| |
| display: inline-block;
| |
| padding: var(--space-1) var(--space-2);
| |
| margin: 0 var(--space-1);
| |
| border-radius: var(--radius-sm);
| |
| transition: background-color var(--transition-fast);
| |
| }
| |
| | |
| .skin-vector-2022 .navbox-list a:hover {
| |
| background: var(--color-surface-hover);
| |
| text-decoration: none;
| |
| }
| |
| | |
| .skin-vector-2022 .navbox tbody tr {
| |
| border-bottom: 1px solid var(--color-border-muted);
| |
| }
| |
| | |
| .skin-vector-2022 .navbox tbody tr:last-child {
| |
| border-bottom: none;
| |
| }
| |
| | |
| /* Navbox semantic colors */
| |
| .skin-vector-2022 .navbox-group.physical {
| |
| border-right-color: var(--color-danger);
| |
| color: #ff7b72;
| |
| }
| |
| | |
| .skin-vector-2022 .navbox-group.mental {
| |
| border-right-color: var(--color-info);
| |
| color: #79c0ff;
| |
| }
| |
| | |
| .skin-vector-2022 .navbox-group.technical {
| |
| border-right-color: var(--color-warning);
| |
| color: #d29922;
| |
| }
| |
| | |
| /* ============================
| |
| DASHBOARD COMPONENTS
| |
| ============================ */
| |
| .skin-vector-2022 .fm-dashboard {
| |
| background: var(--color-bg-tertiary);
| |
| border: 1px solid var(--color-border-default);
| |
| border-radius: var(--radius-lg);
| |
| padding: var(--space-5);
| |
| margin: var(--space-4) 0;
| |
| box-shadow: var(--shadow-sm);
| |
| transition: border-color var(--transition-base), box-shadow var(--transition-base);
| |
| }
| |
| | |
| .skin-vector-2022 .fm-dashboard:hover {
| |
| border-color: var(--color-brand-primary);
| |
| box-shadow: 0 4px 12px var(--color-brand-muted), var(--shadow-md);
| |
| }
| |
| | |
| .skin-vector-2022 .fm-dashboard .fm-card {
| |
| background: var(--color-bg-secondary);
| |
| border: 1px solid var(--color-border-muted);
| |
| border-radius: var(--radius-md);
| |
| padding: var(--space-4);
| |
| margin: var(--space-3) 0;
| |
| }
| |
| | |
| /* ============================
| |
| BUTTONS & FORM ELEMENTS
| |
| ============================ */
| |
| .skin-vector-2022 .mw-ui-button,
| |
| .skin-vector-2022 button {
| |
| background: var(--color-brand-primary);
| |
| color: var(--color-text-inverse);
| |
| border: 1px solid transparent;
| |
| border-radius: var(--radius-md);
| |
| padding: var(--space-2) var(--space-4);
| |
| font-weight: var(--font-weight-semibold);
| |
| font-size: var(--font-size-sm);
| |
| cursor: pointer;
| |
| transition: background-color var(--transition-fast), transform var(--transition-fast);
| |
| }
| |
| | |
| .skin-vector-2022 .mw-ui-button:hover,
| |
| .skin-vector-2022 button:hover {
| |
| background: var(--color-brand-hover);
| |
| transform: translateY(-1px);
| |
| }
| |
| | |
| .skin-vector-2022 .mw-ui-button:active,
| |
| .skin-vector-2022 button:active {
| |
| transform: translateY(0);
| |
| }
| |
| | |
| /* ============================
| |
| SIDEBAR NAVIGATION
| |
| ============================ */
| |
| .skin-vector-2022 .vector-toc,
| |
| .skin-vector-2022 .vector-menu-portal {
| |
| background: var(--color-bg-secondary);
| |
| border: 1px solid var(--color-border-default);
| |
| border-radius: var(--radius-md);
| |
| padding: var(--space-3);
| |
| margin: var(--space-4) 0;
| |
| }
| |
| | |
| .skin-vector-2022 .vector-menu-heading {
| |
| color: var(--color-text-inverse);
| |
| font-weight: var(--font-weight-semibold);
| |
| font-size: var(--font-size-xs);
| |
| text-transform: uppercase;
| |
| letter-spacing: 0.05em;
| |
| padding: var(--space-2) 0;
| |
| }
| |
| | |
| .skin-vector-2022 .vector-menu-content a {
| |
| display: block;
| |
| color: var(--color-text-primary);
| |
| padding: var(--space-2);
| |
| border-radius: var(--radius-sm);
| |
| font-size: var(--font-size-sm);
| |
| transition: background-color var(--transition-fast), color var(--transition-fast);
| |
| }
| |
| | |
| .skin-vector-2022 .vector-menu-content a:hover {
| |
| background: var(--color-surface-hover);
| |
| color: var(--color-text-inverse);
| |
| text-decoration: none;
| |
| }
| |
| | |
| /* ============================
| |
| FOOTER
| |
| ============================ */
| |
| .skin-vector-2022 .mw-footer {
| |
| background: var(--color-bg-secondary);
| |
| border-top: 1px solid var(--color-border-default);
| |
| border-radius: var(--radius-md);
| |
| margin-top: var(--space-8);
| |
| padding: var(--space-5);
| |
| color: var(--color-text-secondary);
| |
| font-size: var(--font-size-sm);
| |
| }
| |
| | |
| .skin-vector-2022 .mw-footer a {
| |
| color: var(--color-text-secondary);
| |
| transition: color var(--transition-fast);
| |
| }
| |
| | |
| .skin-vector-2022 .mw-footer a:hover {
| |
| color: var(--color-text-primary);
| |
| }
| |
| | |
| /* ============================
| |
| CUSTOM SCROLLBAR
| |
| ============================ */
| |
| .skin-vector-2022 ::-webkit-scrollbar {
| |
| width: 12px;
| |
| height: 12px;
| |
| }
| |
| | |
| .skin-vector-2022 ::-webkit-scrollbar-track {
| |
| background: var(--color-bg-primary);
| |
| }
| |
| | |
| .skin-vector-2022 ::-webkit-scrollbar-thumb {
| |
| background: var(--color-border-default);
| |
| border-radius: var(--radius-md);
| |
| border: 2px solid var(--color-bg-primary);
| |
| }
| |
| | |
| .skin-vector-2022 ::-webkit-scrollbar-thumb:hover {
| |
| background: var(--color-brand-primary);
| |
| }
| |
| | |
| /* ============================
| |
| RESPONSIVE DESIGN
| |
| ============================ */
| |
| @media (max-width: 1200px) {
| |
| .skin-vector-2022 .mw-body-content {
| |
| padding: var(--space-5);
| |
| }
| |
| }
| |
| | |
| @media (max-width: 768px) {
| |
| .skin-vector-2022 .mw-body-content {
| |
| padding: var(--space-4);
| |
| }
| |
|
| |
| .skin-vector-2022 .infobox {
| |
| float: none;
| |
| max-width: 100%;
| |
| margin: var(--space-4) 0;
| |
| }
| |
|
| |
| .skin-vector-2022 h1 {
| |
| font-size: var(--font-size-xl);
| |
| }
| |
|
| |
| .skin-vector-2022 .mw-parser-output h2 {
| |
| font-size: var(--font-size-lg);
| |
| padding: var(--space-2) var(--space-3);
| |
| }
| |
|
| |
| .skin-vector-2022 table.wikitable {
| |
| font-size: var(--font-size-sm);
| |
| }
| |
| }
| |
| | |
| @media (max-width: 480px) {
| |
| .skin-vector-2022 .mw-page-container {
| |
| padding: 0 var(--space-2);
| |
| }
| |
|
| |
| .skin-vector-2022 .mw-body-content {
| |
| padding: var(--space-3);
| |
| }
| |
| }
| |
| | |
| /* ============================
| |
| UTILITY CLASSES
| |
| ============================ */
| |
| .skin-vector-2022 .text-muted {
| |
| color: var(--color-text-secondary);
| |
| }
| |
| | |
| .skin-vector-2022 .text-small {
| |
| font-size: var(--font-size-sm);
| |
| }
| |
| | |
| .skin-vector-2022 .font-bold {
| |
| font-weight: var(--font-weight-bold);
| |
| }
| |
| | |
| .skin-vector-2022 .mt-0 { margin-top: 0; }
| |
| .skin-vector-2022 .mb-0 { margin-bottom: 0; }
| |
| | |
| /* ============================
| |
| ACCESSIBILITY IMPROVEMENTS
| |
| ============================ */
| |
| .skin-vector-2022 :focus-visible {
| |
| outline: 2px solid var(--color-brand-primary);
| |
| outline-offset: 2px;
| |
| }
| |
| | |
| .skin-vector-2022 .sr-only {
| |
| position: absolute;
| |
| width: 1px;
| |
| height: 1px;
| |
| padding: 0;
| |
| margin: -1px;
| |
| overflow: hidden;
| |
| clip: rect(0, 0, 0, 0);
| |
| white-space: nowrap;
| |
| border-width: 0;
| |
| }
| |
| | |
| /* ============================
| |
| PRINT STYLES
| |
| ============================ */
| |
| @media print {
| |
| .skin-vector-2022 {
| |
| background: white;
| |
| color: black;
| |
| }
| |
|
| |
| .skin-vector-2022 .vector-header-container,
| |
| .skin-vector-2022 .mw-footer,
| |
| .skin-vector-2022 .vector-toc {
| |
| display: none;
| |
| }
| |
| } | | } |