|
|
| (Aynı kullanıcının aradaki bir diğer değişikliği gösterilmiyor) |
| 1. satır: |
1. satır: |
| /* ============================
| | #coordinates { |
| FM WIKI – SOFT MODERN DESIGN SYSTEM
| | line-height: 2; |
| Yumuşak geçişler, subtle gradientler, modern ambient
| | font-size: 92%; |
| Version: 3.0
| | white-space: nowrap; |
| ============================ */
| |
| | |
| /* ============================
| |
| DESIGN TOKENS – SOFT & AMBIENT
| |
| ============================ */
| |
| :root {
| |
| /* Soft background layers */
| |
| --color-bg-canvas: #0a0d12;
| |
| --color-bg-primary: #0f1318;
| |
| --color-bg-secondary: #161b22;
| |
| --color-bg-tertiary: #1c2128;
| |
| --color-bg-elevated: #21262d;
| |
|
| |
| /* Ambient overlays */
| |
| --color-surface: rgba(22, 27, 34, 0.6);
| |
| --color-surface-hover: rgba(33, 38, 45, 0.8);
| |
| --color-glass: rgba(22, 27, 34, 0.7);
| |
| --color-glass-border: rgba(255, 255, 255, 0.08);
| |
|
| |
| /* Soft brand colors - daha yumuşak tonlar */
| |
| --color-brand-primary: #3fb378;
| |
| --color-brand-hover: #4dc88c;
| |
| --color-brand-active: #35a069;
| |
| --color-brand-soft: rgba(63, 179, 120, 0.15);
| |
| --color-brand-glow: rgba(63, 179, 120, 0.25);
| |
|
| |
| /* Refined text hierarchy - daha az kontrast */
| |
| --color-text-primary: #d8dee9;
| |
| --color-text-secondary: #8b95a6;
| |
| --color-text-tertiary: #5e6a7a;
| |
| --color-text-inverse: #ecf0f7;
| |
| --color-text-link: #68d4a1;
| |
| --color-text-link-visited: #7db4ff;
| |
|
| |
| /* Subtle borders */
| |
| --color-border-default: rgba(255, 255, 255, 0.06);
| |
| --color-border-muted: rgba(255, 255, 255, 0.03);
| |
| --color-border-emphasis: rgba(63, 179, 120, 0.3);
| |
|
| |
| /* Soft functional colors */
| |
| --color-danger-soft: #e67c79;
| |
| --color-warning-soft: #d4a961;
| |
| --color-info-soft: #6ba4ff;
| |
| --color-success-soft: #5dc48f;
| |
|
| |
| /* Ambient gradients */
| |
| --gradient-ambient: linear-gradient(
| |
| 135deg,
| |
| rgba(63, 179, 120, 0.05) 0%,
| |
| rgba(22, 27, 34, 0) 50%,
| |
| rgba(107, 164, 255, 0.03) 100%
| |
| );
| |
|
| |
| --gradient-glass: linear-gradient(
| |
| 135deg,
| |
| rgba(255, 255, 255, 0.06) 0%,
| |
| rgba(255, 255, 255, 0.02) 100%
| |
| );
| |
|
| |
| /* Spacing scale (8px base) */
| |
| --space-1: 0.25rem;
| |
| --space-2: 0.5rem;
| |
| --space-3: 0.75rem;
| |
| --space-4: 1rem;
| |
| --space-5: 1.5rem;
| |
| --space-6: 2rem;
| |
| --space-8: 3rem;
| |
| --space-10: 4rem;
| |
|
| |
| /* Typography scale */
| |
| --font-size-xs: 0.75rem;
| |
| --font-size-sm: 0.875rem;
| |
| --font-size-base: 0.9375rem;
| |
| --font-size-md: 1rem;
| |
| --font-size-lg: 1.25rem;
| |
| --font-size-xl: 1.5rem;
| |
| --font-size-2xl: 2rem;
| |
|
| |
| /* Line heights */
| |
| --line-height-tight: 1.3;
| |
| --line-height-base: 1.65;
| |
| --line-height-relaxed: 1.8;
| |
|
| |
| /* Font weights - daha az ağır */
| |
| --font-weight-normal: 400;
| |
| --font-weight-medium: 500;
| |
| --font-weight-semibold: 600;
| |
| --font-weight-bold: 650;
| |
|
| |
| /* Border radius - daha yumuşak köşeler */
| |
| --radius-sm: 6px;
| |
| --radius-md: 8px;
| |
| --radius-lg: 12px;
| |
| --radius-xl: 16px;
| |
| --radius-full: 999px;
| |
|
| |
| /* Soft shadows */
| |
| --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.15);
| |
| --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.12);
| |
| --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.16);
| |
| --shadow-lg: 0 8px 28px rgba(0, 0, 0, 0.2);
| |
| --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.25);
| |
|
| |
| /* Glows */
| |
| --glow-brand: 0 0 24px rgba(63, 179, 120, 0.15);
| |
| --glow-brand-strong: 0 0 32px rgba(63, 179, 120, 0.25);
| |
|
| |
| /* Smooth transitions */
| |
| --transition-fast: 180ms cubic-bezier(0.4, 0, 0.2, 1);
| |
| --transition-base: 250ms cubic-bezier(0.4, 0, 0.2, 1);
| |
| --transition-slow: 350ms cubic-bezier(0.4, 0, 0.2, 1);
| |
|
| |
| /* Blur effects */
| |
| --blur-sm: 8px;
| |
| --blur-md: 16px;
| |
| --blur-lg: 24px;
| |
| }
| |
| | |
| /* ============================
| |
| BASE STYLES
| |
| ============================ */
| |
| .skin-vector-2022,
| |
| .skin-vector-2022 body {
| |
| background:
| |
| radial-gradient(
| |
| circle at top right,
| |
| rgba(63, 179, 120, 0.08) 0%,
| |
| transparent 45%
| |
| ),
| |
| radial-gradient(
| |
| circle at bottom left,
| |
| rgba(107, 164, 255, 0.06) 0%,
| |
| transparent 50%
| |
| ),
| |
| var(--color-bg-canvas);
| |
| background-attachment: fixed;
| |
| 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 #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 – GLASS EFFECT
| |
| ============================ */
| |
| .skin-vector-2022 .vector-header-container {
| |
| background: var(--color-glass);
| |
| backdrop-filter: blur(var(--blur-md)) saturate(180%);
| |
| -webkit-backdrop-filter: blur(var(--blur-md)) saturate(180%);
| |
| border-bottom: 1px solid var(--color-glass-border);
| |
| box-shadow: var(--shadow-sm);
| |
| position: sticky;
| |
| top: 0;
| |
| z-index: 100;
| |
| }
| |
| | |
| .skin-vector-2022 .mw-wiki-title {
| |
| background: var(--gradient-glass);
| |
| -webkit-background-clip: text;
| |
| -webkit-text-fill-color: transparent;
| |
| background-clip: text;
| |
| font-weight: var(--font-weight-bold);
| |
| font-size: var(--font-size-lg);
| |
| letter-spacing: -0.01em;
| |
| filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3));
| |
| }
| |
| | |
| .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 - soft glow */
| |
| .skin-vector-2022 .vector-menu-tabs .selected a {
| |
| background: linear-gradient(
| |
| 135deg,
| |
| var(--color-brand-primary),
| |
| var(--color-brand-hover)
| |
| );
| |
| color: var(--color-text-inverse);
| |
| border-radius: var(--radius-full);
| |
| padding: var(--space-2) var(--space-4);
| |
| box-shadow: var(--glow-brand);
| |
| }
| |
| | |
| /* Search input - glass style */
| |
| .skin-vector-2022 .vector-search-box input {
| |
| background: var(--color-surface);
| |
| backdrop-filter: blur(var(--blur-sm));
| |
| border: 1px solid var(--color-border-default);
| |
| border-radius: var(--radius-md);
| |
| color: var(--color-text-primary);
| |
| padding: var(--space-2) var(--space-4);
| |
| transition: all var(--transition-base);
| |
| }
| |
| | |
| .skin-vector-2022 .vector-search-box input:focus {
| |
| background: var(--color-surface-hover);
| |
| border-color: var(--color-border-emphasis);
| |
| box-shadow: 0 0 0 3px var(--color-brand-soft), var(--shadow-sm);
| |
| outline: none;
| |
| }
| |
| | |
| /* ============================
| |
| MAIN CONTENT – ELEVATED GLASS CARD
| |
| ============================ */
| |
| .skin-vector-2022 .mw-body-content {
| |
| background: var(--gradient-ambient), var(--color-bg-secondary);
| |
| backdrop-filter: blur(var(--blur-sm));
| |
| border: 1px solid var(--color-border-default);
| |
| border-radius: var(--radius-xl);
| |
| padding: var(--space-6);
| |
| margin: var(--space-5) 0;
| |
| box-shadow: var(--shadow-lg);
| |
| }
| |
| | |
| /* ============================
| |
| TYPOGRAPHY – SOFTER 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: 1px 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-semibold);
| |
| line-height: var(--line-height-tight);
| |
| margin: var(--space-6) 0 var(--space-4);
| |
| padding: var(--space-3) var(--space-4);
| |
| background: linear-gradient(
| |
| to right,
| |
| var(--color-brand-soft),
| |
| transparent
| |
| );
| |
| border-left: 3px solid var(--color-brand-primary);
| |
| border-radius: var(--radius-md);
| |
| }
| |
| | |
| .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 p {
| |
| color: var(--color-text-primary);
| |
| margin: var(--space-3) 0;
| |
| line-height: var(--line-height-relaxed);
| |
| }
| |
| | |
| /* ============================
| |
| LINKS – SOFT GLOW ON HOVER
| |
| ============================ */
| |
| .skin-vector-2022 .mw-parser-output a {
| |
| color: var(--color-text-link);
| |
| text-decoration: none;
| |
| font-weight: var(--font-weight-medium);
| |
| transition: all var(--transition-fast);
| |
| position: relative;
| |
| }
| |
| | |
| .skin-vector-2022 .mw-parser-output a:hover {
| |
| color: var(--color-brand-hover);
| |
| text-shadow: 0 0 8px rgba(63, 179, 120, 0.3);
| |
| }
| |
| | |
| .skin-vector-2022 .mw-parser-output a:visited {
| |
| color: var(--color-text-link-visited);
| |
| }
| |
| | |
| /* ============================
| |
| LISTS
| |
| ============================ */
| |
| .skin-vector-2022 .mw-parser-output ul,
| |
| .skin-vector-2022 .mw-parser-output ol {
| |
| padding-left: var(--space-5);
| |
| margin: var(--space-4) 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 – SOFT GLASS STYLE
| |
| ============================ */
| |
| .skin-vector-2022 table.wikitable {
| |
| background: var(--color-surface);
| |
| backdrop-filter: blur(var(--blur-sm));
| |
| border: 1px solid var(--color-border-default);
| |
| border-radius: var(--radius-lg);
| |
| border-collapse: separate;
| |
| border-spacing: 0;
| |
| margin: var(--space-5) 0;
| |
| width: 100%;
| |
| overflow: hidden;
| |
| box-shadow: var(--shadow-sm);
| |
| }
| |
| | |
| .skin-vector-2022 table.wikitable thead th {
| |
| background: linear-gradient(
| |
| 135deg,
| |
| var(--color-brand-active),
| |
| var(--color-brand-primary)
| |
| );
| |
| color: var(--color-text-inverse);
| |
| font-weight: var(--font-weight-semibold);
| |
| font-size: var(--font-size-sm);
| |
| text-transform: uppercase;
| |
| letter-spacing: 0.05em;
| |
| padding: var(--space-3) var(--space-4);
| |
| }
| |
| | |
| .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-base);
| |
| }
| |
| | |
| .skin-vector-2022 table.wikitable tbody tr:hover {
| |
| background: var(--color-brand-soft);
| |
| }
| |
| | |
| .skin-vector-2022 table.wikitable tbody tr:last-child td {
| |
| border-bottom: none;
| |
| }
| |
| | |
| /* ============================
| |
| INFOBOX – LIGHT GLASS CARD
| |
| ============================ */
| |
| .skin-vector-2022 .infobox {
| |
| background: linear-gradient(
| |
| 135deg,
| |
| rgba(255, 255, 255, 0.98) 0%,
| |
| rgba(246, 248, 250, 0.95) 100%
| |
| );
| |
| backdrop-filter: blur(var(--blur-md));
| |
| border: 1px solid rgba(0, 0, 0, 0.08);
| |
| 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-lg);
| |
| }
| |
| | |
| .skin-vector-2022 .infobox caption {
| |
| background: linear-gradient(
| |
| 135deg,
| |
| var(--color-brand-active),
| |
| var(--color-brand-hover)
| |
| );
| |
| color: var(--color-text-inverse);
| |
| font-weight: var(--font-weight-semibold);
| |
| font-size: var(--font-size-lg);
| |
| padding: var(--space-4);
| |
| text-align: center;
| |
| box-shadow: var(--glow-brand);
| |
| }
| |
| | |
| .skin-vector-2022 .infobox th {
| |
| background: rgba(232, 235, 241, 0.6);
| |
| color: #2f3542;
| |
| 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 rgba(0, 0, 0, 0.05);
| |
| width: 35%;
| |
| }
| |
| | |
| .skin-vector-2022 .infobox td {
| |
| background: rgba(255, 255, 255, 0.7);
| |
| color: #2f3542;
| |
| font-size: var(--font-size-sm);
| |
| padding: var(--space-2) var(--space-3);
| |
| border-bottom: 1px solid rgba(0, 0, 0, 0.05);
| |
| }
| |
| | |
| .skin-vector-2022 .infobox tr:last-child th,
| |
| .skin-vector-2022 .infobox tr:last-child td {
| |
| border-bottom: none;
| |
| }
| |
| | |
| /* ============================
| |
| NAVBOX – SUBTLE AMBIENT
| |
| ============================ */
| |
| .skin-vector-2022 .navbox {
| |
| background: var(--color-surface);
| |
| backdrop-filter: blur(var(--blur-sm));
| |
| border: 1px solid var(--color-border-default);
| |
| border-radius: var(--radius-lg);
| |
| margin: var(--space-5) 0;
| |
| overflow: hidden;
| |
| box-shadow: var(--shadow-sm);
| |
| }
| |
| | |
| .skin-vector-2022 .navbox-title {
| |
| background: linear-gradient(
| |
| to right,
| |
| var(--color-brand-active),
| |
| var(--color-brand-primary)
| |
| );
| |
| color: var(--color-text-inverse);
| |
| font-weight: var(--font-weight-semibold);
| |
| 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-medium);
| |
| font-size: var(--font-size-sm);
| |
| padding: var(--space-3) var(--space-3);
| |
| border-right: 2px solid var(--color-brand-primary);
| |
| width: 140px;
| |
| vertical-align: top;
| |
| }
| |
| | |
| .skin-vector-2022 .navbox-list {
| |
| background: var(--color-bg-tertiary);
| |
| padding: var(--space-3) var(--space-4);
| |
| }
| |
| | |
| .skin-vector-2022 .navbox-list a {
| |
| display: inline-block;
| |
| padding: var(--space-1) var(--space-2);
| |
| margin: var(--space-1);
| |
| border-radius: var(--radius-sm);
| |
| transition: all var(--transition-fast);
| |
| }
| |
| | |
| .skin-vector-2022 .navbox-list a:hover {
| |
| background: var(--color-brand-soft);
| |
| text-decoration: none;
| |
| }
| |
| | |
| /* ============================
| |
| DASHBOARD – AMBIENT CARDS
| |
| ============================ */
| |
| .skin-vector-2022 .fm-dashboard {
| |
| background: var(--gradient-ambient), var(--color-surface);
| |
| backdrop-filter: blur(var(--blur-sm));
| |
| border: 1px solid var(--color-border-default);
| |
| border-radius: var(--radius-xl);
| |
| padding: var(--space-6);
| |
| margin: var(--space-5) 0;
| |
| box-shadow: var(--shadow-md);
| |
| transition: all var(--transition-base);
| |
| }
| |
| | |
| .skin-vector-2022 .fm-dashboard:hover {
| |
| border-color: var(--color-border-emphasis);
| |
| box-shadow: var(--glow-brand), var(--shadow-lg);
| |
| transform: translateY(-2px);
| |
| }
| |
| | |
| .skin-vector-2022 .fm-dashboard .fm-card {
| |
| background: var(--color-bg-elevated);
| |
| border: 1px solid var(--color-border-muted);
| |
| border-radius: var(--radius-md);
| |
| padding: var(--space-4);
| |
| margin: var(--space-3) 0;
| |
| }
| |
| | |
| /* ============================
| |
| BUTTONS – SOFT GRADIENT
| |
| ============================ */
| |
| .skin-vector-2022 .mw-ui-button,
| |
| .skin-vector-2022 button {
| |
| background: linear-gradient(
| |
| 135deg,
| |
| var(--color-brand-primary),
| |
| var(--color-brand-hover)
| |
| );
| |
| color: var(--color-text-inverse);
| |
| border: none;
| |
| border-radius: var(--radius-md);
| |
| padding: var(--space-2) var(--space-5);
| |
| font-weight: var(--font-weight-semibold);
| |
| font-size: var(--font-size-sm);
| |
| cursor: pointer;
| |
| box-shadow: var(--shadow-sm);
| |
| transition: all var(--transition-fast);
| |
| }
| |
| | |
| .skin-vector-2022 .mw-ui-button:hover,
| |
| .skin-vector-2022 button:hover {
| |
| box-shadow: var(--glow-brand-strong), var(--shadow-md);
| |
| transform: translateY(-1px);
| |
| }
| |
| | |
| /* ============================
| |
| SIDEBAR – GLASS PANELS
| |
| ============================ */
| |
| .skin-vector-2022 .vector-toc,
| |
| .skin-vector-2022 .vector-menu-portal {
| |
| background: var(--color-surface);
| |
| backdrop-filter: blur(var(--blur-sm));
| |
| border: 1px solid var(--color-border-default);
| |
| border-radius: var(--radius-lg);
| |
| padding: var(--space-3);
| |
| margin: var(--space-4) 0;
| |
| box-shadow: var(--shadow-xs);
| |
| }
| |
| | |
| .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.08em;
| |
| padding: var(--space-2) 0;
| |
| }
| |
| | |
| .skin-vector-2022 .vector-menu-content a {
| |
| display: block;
| |
| color: var(--color-text-secondary);
| |
| padding: var(--space-2);
| |
| border-radius: var(--radius-sm);
| |
| font-size: var(--font-size-sm);
| |
| transition: all var(--transition-fast);
| |
| }
| |
| | |
| .skin-vector-2022 .vector-menu-content a:hover {
| |
| background: var(--color-brand-soft);
| |
| color: var(--color-text-primary);
| |
| text-decoration: none;
| |
| }
| |
| | |
| /* ============================
| |
| FOOTER
| |
| ============================ */
| |
| .skin-vector-2022 .mw-footer {
| |
| background: var(--color-surface);
| |
| backdrop-filter: blur(var(--blur-md));
| |
| border-top: 1px solid var(--color-border-default);
| |
| border-radius: var(--radius-lg);
| |
| margin-top: var(--space-10);
| |
| padding: var(--space-6);
| |
| color: var(--color-text-tertiary);
| |
| font-size: var(--font-size-sm);
| |
| }
| |
| | |
| /* ============================
| |
| SCROLLBAR – SUBTLE
| |
| ============================ */
| |
| .skin-vector-2022 ::-webkit-scrollbar {
| |
| width: 10px;
| |
| height: 10px;
| |
| }
| |
| | |
| .skin-vector-2022 ::-webkit-scrollbar-track {
| |
| background: transparent;
| |
| }
| |
| | |
| .skin-vector-2022 ::-webkit-scrollbar-thumb {
| |
| background: rgba(255, 255, 255, 0.1);
| |
| border-radius: var(--radius-full);
| |
| border: 2px solid transparent;
| |
| background-clip: padding-box;
| |
| }
| |
| | |
| .skin-vector-2022 ::-webkit-scrollbar-thumb:hover {
| |
| background: var(--color-brand-primary);
| |
| background-clip: padding-box;
| |
| }
| |
| | |
| /* ============================
| |
| RESPONSIVE
| |
| ============================ */
| |
| @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;
| |
| }
| |
| }
| |
| | |
| /* ============================
| |
| ACCESSIBILITY
| |
| ============================ */
| |
| .skin-vector-2022 :focus-visible {
| |
| outline: 2px solid var(--color-brand-primary);
| |
| outline-offset: 3px;
| |
| border-radius: var(--radius-sm);
| |
| }
| |
| | |
| @media (prefers-reduced-motion: reduce) {
| |
| .skin-vector-2022 * {
| |
| animation-duration: 0.01ms !important;
| |
| animation-iteration-count: 1 !important;
| |
| transition-duration: 0.01ms !important;
| |
| }
| |
| } | | } |