i18n(ru): Update fonts.mdx translation (#7907)

Co-authored-by: Yan <61414485+yanthomasdev@users.noreply.github.com>

src/content/docs/ru/guides/fonts.mdx

@@ -6,14 +6,15 @@ description: >-
 i18nReady: true
 ---
 import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
-
+import { Steps } from '@astrojs/starlight/components'
 
 Это руководство покажет вам, как добавить веб-шрифты в ваш проект и использовать их в ваших компонентах.
 
 ## Использование локального файла шрифта
 
 Этот пример покажет, как добавить пользовательский шрифт, используя файл шрифта `DistantGalaxy.woff`.
 
+<Steps>
 1. Добавьте ваш файл шрифта в `public/fonts/`.
 2. Добавьте следующее правило `@font-face` в ваш CSS. Это может быть в глобальном файле `.css`, который вы импортируете, в блоке `<style is:global>`, или в блоке `<style>` в конкретном макете или компоненте, где вы хотите использовать этот шрифт.
 
@@ -45,10 +46,13 @@ import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
     </style>
     ```
 
+</Steps>
+
 ## Использование Fontsource
 
 Проект [Fontsource](https://fontsource.org/) упрощает использование Google Fonts и других шрифтов с открытым исходным кодом. Он предоставляет npm-модули, которые вы можете установить для нужных вам шрифтов.
 
+<Steps>
 1. Найдите шрифт, который хотите использовать, в [каталоге Fontsource](https://fontsource.org/). В этом примере будет использоваться [Twinkle Star](https://fontsource.org/fonts/twinkle-star).
 
 2. Установите пакет для выбранного вами шрифта.
@@ -93,12 +97,15 @@ import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
     }
     ```
 
+</Steps>
+
 ## Добавление шрифтов с Tailwind
 
 Если вы используете интеграцию [Tailwind](/ru/guides/integrations-guide/tailwind/), вы можете использовать любой из предыдущих методов на этой странице для установки вашего шрифта, с некоторыми изменениями. Вы можете либо добавить [`@font-face` правило для локального шрифта](#использование-локального-файла-шрифта), либо использовать стратегию [`импорта` Fontsource](#использование-fontsource) для установки шрифта.
 
 Чтобы добавить ваш шрифт в Tailwind:
 
+<Steps>
 1. Следуйте любому из приведенных выше руководств, но пропустите последний шаг добавления `font-family` в CSS.
 2. Добавьте название шрифта в файл `tailwind.config.mjs`.
 
@@ -121,6 +128,8 @@ import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
     }
     ```
 
+</Steps>
+
 Теперь весь текст sans-serif (по умолчанию в Tailwind) в вашем проекте будет использовать выбранный вами шрифт, а класс `font-sans` будет также применять шрифт Inter.
 
 Дополнительные сведения см. в [Документации Tailwind по добавлению пользовательских шрифтов](https://tailwindcss.com/docs/font-family#using-custom-values).