src/fonts.css - master - pvldchkv/unity

src/fonts.css
105 строк3 KB
Dyachkov Pavel
Дополнительные пользователи + типографика + ячейки деталки
14 май 2026, 21:36
14 май 2026, 21:364d06da3
/* SberUnity грузит только 4 начертания. См. /docs/typography.
   • Display SemiBold (600) — все заголовки
   • Text Regular (400) — основной текст
   • Text Italic (400) — плейсхолдеры и редкие выделения
   • Text SemiBold (600) — кнопки, акценты
   Bold/700 принципиально не используем — переменная Radix
   `--font-weight-bold` переопределена на 600. */

@font-face {
  font-family: 'SB Sans Display';
  src: url('./assets/fonts/SBSansDisplay-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'SB Sans Text';
  src: url('./assets/fonts/SBSansText-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'SB Sans Text';
  src: url('./assets/fonts/SBSansText-Italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'SB Sans Text';
  src: url('./assets/fonts/SBSansText-Semibold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* ── Override Radix UI Themes default font ── */
/* ── Override Radix accent color: rgb(171, 66, 120) ── */
.radix-themes {
  --default-font-family: 'SB Sans Text', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --heading-font-family: 'SB Sans Display', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --accent-1: #fdf2f8;
  --accent-2: #fce7f3;
  --accent-3: #f9c6e0;
  --accent-4: #f3a1cc;
  --accent-5: #ec7db8;
  --accent-6: #d95ca0;
  --accent-7: #c44d8a;
  --accent-8: #ab4278;
  --accent-9: #ab4278;
  --accent-10: #963a6a;
  --accent-11: #7e2f58;
  --accent-12: #4a1533;

  --accent-a1: rgba(171, 66, 120, 0.02);
  --accent-a2: rgba(171, 66, 120, 0.06);
  --accent-a3: rgba(171, 66, 120, 0.12);
  --accent-a4: rgba(171, 66, 120, 0.2);
  --accent-a5: rgba(171, 66, 120, 0.3);
  --accent-a6: rgba(171, 66, 120, 0.4);
  --accent-a7: rgba(171, 66, 120, 0.54);
  --accent-a8: rgba(171, 66, 120, 0.72);
  --accent-a9: rgba(171, 66, 120, 1);
  --accent-a10: rgba(150, 58, 106, 1);
  --accent-a11: rgba(126, 47, 88, 1);
  --accent-a12: rgba(74, 21, 51, 0.95);

  --font-weight-bold: 600;

  --accent-contrast: #fff;
  --accent-surface: rgba(171, 66, 120, 0.06);
  --accent-indicator: #ab4278;
  --accent-track: #ab4278;
}

h1, h2, h3, h4, h5, h6,
.radix-themes [class*="rt-Heading"] {
  font-family: var(--heading-font-family) !important;
}

/* Ensure all native elements inherit the custom font */
.radix-themes button,
.radix-themes input,
.radix-themes select,
.radix-themes textarea {
  font-family: inherit;
}

/* Шарм SberUnity — все плейсхолдеры курсивом. */
.radix-themes input::placeholder,
.radix-themes textarea::placeholder {
  font-style: italic;
}

/* ── Link colors: purple default, accent on hover ── */
.radix-themes a[class*="rt-Link"] {
  color: var(--purple-9);
}

.radix-themes a[class*="rt-Link"]:hover {
  color: var(--accent-9);
}