itube-specs 0.0.921 → 0.0.922

package/assets/scss/base/_global.scss

@@ -82,15 +82,18 @@ summary::-webkit-details-marker {
   clip-path: inset(100%);
 }
 
+// Убрать элемент из потока целиком, в отличие от ._visually-hidden.
 ._hidden {
   display: none !important;
 }
 
 @for $i from 1 through 12 {
+  // Отбивка снизу: чётные значения 2…24px (._mb-8 = margin-bottom: 8px).
   ._mb-#{$i * 2} {
     margin-bottom: #{$i * 2}px;
   }
 
+  // Отбивка сверху: чётные значения 2…24px (._mt-8 = margin-top: 8px).
   ._mt-#{$i * 2} {
     margin-top: #{$i * 2}px;
   }

package/assets/scss/base/_loading.scss

@@ -1,5 +1,6 @@
 @use 'vars' as *;
 
+// Состояние загрузки блока: заблюренная подложка со спиннером поверх содержимого (::before/::after).
 ._loading {
   position: relative;
 

package/assets/scss/base/_utils.scss

@@ -1,21 +1,31 @@
 @use '../mixins/breakpoints' as *;
 
+// Виден только ниже xs (475px), на xs и шире скрыт.
 @include from-br(xs) { ._to-xs { display: none !important; } }
 
+// Виден только ниже sm (960px), на sm и шире скрыт.
 @include from-br(sm) { ._to-sm { display: none !important; } }
 
+// Виден только ниже md (1350px), на md и шире скрыт.
 @include from-br(md) { ._to-md { display: none !important; } }
 
+// Виден только ниже lg (1792px), на lg и шире скрыт.
 @include from-br(lg) { ._to-lg { display: none !important; } }
 
+// Виден с xs (475px) и шире, ниже скрыт.
 @include to-br(xs) { ._from-xs { display: none !important; } }
 
+// Виден с sm (960px) и шире, ниже скрыт.
 @include to-br(sm) { ._from-sm { display: none !important; } }
 
+// Виден с md (1350px) и шире, ниже скрыт.
 @include to-br(md) { ._from-md { display: none !important; } }
 
+// Виден с lg (1792px) и шире, ниже скрыт.
 @include to-br(lg) { ._from-lg { display: none !important; } }
 
+// Обрезка текста в N строк: число строк задаётся --line-clamp (по умолчанию 1),
+// выравнивание — --align, перенос — --word-break.
 ._truncate {
   display: -webkit-box !important;
   -webkit-line-clamp: var(--line-clamp, 1);

package/assets/scss/layout/_page.scss

@@ -1,15 +1,18 @@
 @use 'vars' as *;
 @use '../mixins' as *;
 
+// Корень страницы: колонка с вертикальными отступами. Вешается на корневой элемент в pages/**.
 ._page {
   @include page;
 }
 
+// Хлебные крошки. Свой верхний отступ нужен, когда крошки лежат вне ._page.
 ._breadcrumbs {
   margin-bottom: 24px;
   padding-top: 24px;
 }
 
+// Крошки на страницах с инфо-блоком — отбивка снизу меньше.
 ._breadcrumbs-info {
   margin-bottom: 16px;
   padding-top: 24px;
@@ -20,20 +23,24 @@
   padding-top: 0;
 }
 
+// Блок SEO-ссылок внизу страницы: прижат к низу и отбит линией.
 ._footer-links {
   @include page-footer-links;
 }
 
+// Заголовок страницы: font-lg, uppercase, 700.
 ._title {
   @include page-title;
 
   margin-bottom: 24px;
 }
 
+// Строка фильтров/навигации под заголовком — только отбивка снизу.
 ._nav-filter {
   margin-bottom: 32px;
 }
 
+// Центрирующий контейнер: боковые паддинги из --container-padding-inline, с md — max-width.
 ._container {
   width: 100%;
   margin: 0 auto;
@@ -44,6 +51,7 @@
   }
 }
 
+// Пагинация внизу листинга — только отбивка сверху.
 ._pagination {
   margin-top: 32px;
 }

package/assets/scss/mixins/_breakpoints.scss

@@ -60,9 +60,9 @@ $brkpnts: (
 }
 
 /**
-  Container query брейкпоинты
-  @include from-cq($width) { ... }
-  @include to-cq($width) { ... }
+  Container query брейкпоинты — меряют контейнер, а не окно. Требуют `container-type`
+  на предке; значение только в единицах, ключей из $brkpnts тут нет.
+  @include from-cq(400px) { ... }
  */
 @mixin from-cq($bp) {
   @container (min-width: #{$bp}) {
@@ -70,6 +70,9 @@ $brkpnts: (
   }
 }
 
+/**
+  @include to-cq(400px) { ... }
+ */
 @mixin to-cq($bp) {
   @container (max-width: #{$bp - 1px}) {
     @content;

package/assets/scss/mixins/_font-sizes.scss

@@ -1,58 +1,70 @@
+// 10px / 10px
 @mixin font-4xs {
   font-size: 10px;
   line-height: 1;
 }
 
+// 11px / 11px
 @mixin font-3xs {
   font-size: 11px;
   line-height: 1;
 }
 
+// 12px / 16px
 @mixin font-xs {
   font-size: 12px;
   line-height: 1.333;
 }
 
+// 13px / 19.5px
 @mixin font-2xs {
   font-size: 13px;
   line-height: 1.5;
 }
 
+// 14px / 20px
 @mixin font-sm {
   font-size: 14px;
   line-height: 1.429;
 }
 
+// 15px / 22.5px
 @mixin font-md {
   font-size: 15px;
   line-height: 1.5;
 }
 
+// 16px / 24px
 @mixin font-base {
   font-size: 16px;
   line-height: 1.5;
 }
 
+// 18px / 28px
 @mixin font-lg {
   font-size: 18px;
   line-height: 1.556;
 }
 
+// 20px / 28px
 @mixin font-xl {
   font-size: 20px;
   line-height: 1.4;
 }
 
+// 24px / 32px
 @mixin font-2xl {
   font-size: 24px;
   line-height: 1.333;
 }
 
+// 30px / 36px
 @mixin font-3xl {
   font-size: 30px;
   line-height: 1.2;
 }
 
+// 36px / 40px
 @mixin font-4xl {
   font-size: 36px;
   line-height: 1.111;

package/assets/scss/mixins/_page.scss

@@ -2,6 +2,8 @@
 @use 'font-sizes' as *;
 @use 'vars' as *;
 
+// Каркас страницы: колонка с вертикальными отступами. В разметке используется через
+// глобальный класс `._page` (layout/_page.scss), напрямую в компонентах не нужен.
 @mixin page {
   display: flex;
   flex-direction: column;
@@ -9,6 +11,7 @@
   padding-bottom: 24px;
 }
 
+// Заголовок страницы: font-lg, uppercase, 700. В разметке — глобальный класс `._title`.
 @mixin page-title {
   @include font-lg;
 
@@ -17,6 +20,8 @@
   font-weight: 700;
 }
 
+// Блок SEO-ссылок внизу страницы: прижат к низу (margin-top: auto) и отбит линией.
+// В разметке — глобальный класс `._footer-links`.
 @mixin page-footer-links {
   margin-top: auto;
   padding-top: 8px;

package/assets/scss/mixins/_video-card.scss

@@ -2,6 +2,7 @@
 @use 'font-sizes' as *;
 @use 'vars' as *;
 
+// Каркас карточки видео: колонка «постер + мета» с зазором 16px, контент прижат к верху.
 @mixin video-card {
   display: grid;
   row-gap: 16px;
@@ -32,6 +33,7 @@
   }
 }
 
+// Постер карточки: 16/9, скруглённый, с обрезкой — база для абсолютных бейджей поверх.
 @mixin video-card-poster {
   position: relative;
   aspect-ratio: 16/9;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "itube-specs",
   "type": "module",
-  "version": "0.0.921",
+  "version": "0.0.922",
   "main": "./nuxt.config.ts",
   "types": "./types/index.d.ts",
   "scripts": {

package/server/middleware/x-domain.ts

@@ -0,0 +1,19 @@
+/**
+ * Гарантирует `X-Domain` у запросов к BFF.
+ *
+ * Бекенд разруливает сайты по этому заголовку — у stripcash-ручек к домену
+ * привязан ещё и ключ провайдера, поэтому без него они отвечают 500
+ * («mux: route doesn't have a host»). Заголовок ставит `ApiHelper`, но не каждый
+ * вызов идёт через него: блок вебкамов, например, дёргает свою ручку обычным
+ * `useFetch`, и тогда до бекенда доезжали только проксированные заголовки запроса
+ * страницы — на локальной машине это прощалось, а за прокси на стенде ломалось.
+ *
+ * Значение берём из runtimeConfig сайта и НЕ перебиваем то, что уже пришло.
+ */
+export default defineEventHandler((event) => {
+  if (!event.path.startsWith('/api/') && !event.path.startsWith('/bff/')) return;
+  if (event.node.req.headers['x-domain']) return;
+
+  const xDomain = useRuntimeConfig(event).public.xDomain;
+  if (xDomain) event.node.req.headers['x-domain'] = String(xDomain);
+});