VEGA-4499: адаптация UI главной страницы документации

2025-08-25 11:21:09 +00:00
parent 2ce47117e1
commit baca55494c
140 changed files with 2458 additions and 325 deletions
@@ -0,0 +1,53 @@
+<script lang="ts" setup>
+import type { ButtonTranslations } from 'vitepress/types/local-search'
+import { createSearchTranslate } from 'vitepress/dist/client/theme-default/support/translation'
+
+const defaultTranslations: { button: ButtonTranslations } = {
+  button: {
+    buttonText: 'Поиск',
+    buttonAriaLabel: 'Поиск'
+  }
+}
+
+const $t = createSearchTranslate(defaultTranslations)
+</script>
+
+<template>
+  <button type="button" :class="$style.HomeHeroSearchButton" :aria-label="$t('button.buttonAriaLabel')">
+    <span :class="$style.HomeHeroSearchButtonContainer">
+      <img :class="$style.HomeHeroSearchButtonIcon" src="/icons/search.svg" alt="Поиск">
+      <span :class="$style.HomeHeroSearchButtonPlaceholder">{{ $t('button.buttonText') }}</span>
+    </span>
+  </button>
+</template>
+
+<style lang="scss" module>
+@use "@beeline/design-tokens/scss/tokens/themes";
+@use "@beeline/design-tokens/scss/tokens/globals/sizes";
+@use "@beeline/design-tokens/scss/mixin";
+@use "@beeline/design-tokens/scss/tokens/components/search";
+
+.HomeHeroSearchButton {
+  display: flex;
+  width: 100%;
+  align-items: center;
+  border-radius: search.$search-border-radius;
+  height: search.$search-medium-height;
+  background: search.$search-background-color;
+
+  &Container {
+    display: flex;
+  }
+
+  &Icon {
+    margin: 0 search.$search-category-icon-spacing;
+    color: themes.$color-text-inactive;
+    fill: currentColor;
+  }
+
+  &Placeholder {
+    @include mixin.body2;
+    color: themes.$color-text-disabled;
+  }
+}
+</style>