itube-specs 0.0.1028 → 0.0.1029

package/SITE_UPDATES.md

@@ -11,6 +11,13 @@
 коммиты до бампа); `npm run patch` сам проставит ей номер версии. Формат пункта: что сделать и где,
 кому именно (всем / сайтам с N), что будет, если не сделать.
 
+## 0.0.1029 — 2026-10-13
+
+- **Сайтам с рекламными ссылками над контентом на мобиле (videosection-redesign):** новая вторая навигация —
+  `LayoutSecondNav` в `layouts/default.vue` (до 1024px, на всех страницах основного лэйаута). Пункты задаёт сайт в
+  `appConfig.secondNav`: `{ title, link, icon?, dot?, featureFlag? }`, `link` — строка или адреса по нишам. Пример —
+  `config/second-nav.config.ts` videosection-redesign. Остальным сайтам ничего не делать: без `secondNav` блока нет.
+
 ## 0.0.1023 — 2026-10-08
 
 - **Всем сайтам:** в `package.json` заменить скрипт `spec` на `"spec": "sh node_modules/itube-specs/scripts/spec.sh"`

package/assets/scss/themes/dark/_theme.scss

@@ -1008,11 +1008,35 @@ $auth-register-link: $color-indigo-400;
 $auth-register-link--hover: $color-indigo-300;
 $auth-register-login: $color-zinc-500;
 
+// ─── Layout: second nav (рекламные ссылки над контентом на мобиле) ───
+$layout-second-nav-link-bg: $color-indigo-600;
+$layout-second-nav-link-text: $color-white;
+$layout-second-nav-dot-bg: $color-green-400;
+
 // ─── Native card ───
 $native-card-bg: $color-black;
 $native-card-primary: $color-zinc-400;
 $native-card-secondary: $color-zinc-500;
 
+// ─── Adv: плашка «Реклама» поверх креатива ───
+$adv-label-text: $color-white;
+$adv-label-bg: $color-black-50;
+
+// ─── Adv: партнёрская карусель FapHouse ───
+$faphouse-item-text: $video-card-text;
+$faphouse-item-text--hover: $video-card-text--hover;
+$faphouse-poster-bg: $native-card-bg;
+$faphouse-ad-text: $color-white;
+$faphouse-ad-bg: $color-indigo-600;
+$faphouse-duration-text: $color-white;
+$faphouse-duration-bg: $color-black-75;
+$faphouse-promo-bg-from: $color-amber-400;
+$faphouse-promo-bg-to: $color-amber-500;
+$faphouse-promo-text: $color-black;
+$faphouse-promo-shadow--hover: 0 10px 15px -3px #{$color-black-25};
+$faphouse-promo-action-text: $color-white;
+$faphouse-promo-action-bg: $color-red-700;
+
 // ─── Page: grouped categories ───
 $grouped-highlight-border: $color-zinc-800;
 $grouped-category-icon: $color-zinc-500;

package/assets/scss/themes/light/_theme.scss

@@ -1035,11 +1035,35 @@ $auth-register-link: $color-indigo-soft;
 $auth-register-link--hover: $color-indigo-blue;
 $auth-register-login: $color-gray-400;
 
+// ─── Layout: second nav (рекламные ссылки над контентом на мобиле) ───
+$layout-second-nav-link-bg: $color-indigo-600;
+$layout-second-nav-link-text: $color-white;
+$layout-second-nav-dot-bg: $color-green-400;
+
 // ─── Native card ───
 $native-card-bg: $color-slate-800;
 $native-card-primary: $color-gray-400;
 $native-card-secondary: $color-gray-500;
 
+// ─── Adv: плашка «Реклама» поверх креатива ───
+$adv-label-text: $color-white;
+$adv-label-bg: $color-black-50;
+
+// ─── Adv: партнёрская карусель FapHouse ───
+$faphouse-item-text: $video-card-text;
+$faphouse-item-text--hover: $color-indigo-600;
+$faphouse-poster-bg: $color-gray-200;
+$faphouse-ad-text: $color-white;
+$faphouse-ad-bg: $color-indigo-600;
+$faphouse-duration-text: $color-white;
+$faphouse-duration-bg: $color-black-75;
+$faphouse-promo-bg-from: $color-amber-400;
+$faphouse-promo-bg-to: $color-amber-500;
+$faphouse-promo-text: $color-black;
+$faphouse-promo-shadow--hover: 0 10px 15px -3px #{$color-black-15};
+$faphouse-promo-action-text: $color-white;
+$faphouse-promo-action-bg: $color-red-700;
+
 // ─── Page: grouped categories ───
 $grouped-highlight-border: transparent;
 $grouped-category-icon: $color-gray-500;

package/components/layout/second-nav.vue

@@ -0,0 +1,80 @@
+<!-- Вторая навигация: ряд рекламных ссылок над контентом, только на мобиле (до бургера), на всех страницах
+основного лэйаута. Пункты — `appConfig.secondNav` сайта; пусто — блока нет. -->
+<template>
+  <nav
+    v-if="items.length"
+    class="layout-second-nav"
+  >
+    <a
+      v-for="item in items"
+      :key="item.title"
+      :href="item.href"
+      :class="{'--dot': item.dot}"
+      class="layout-second-nav__link"
+      target="_blank"
+      rel="nofollow noopener sponsored"
+    >
+      {{ t(`navigation.${item.title}`) }}
+      <UiIcon
+        v-if="item.icon"
+        :name="item.icon"
+        size="14"
+      />
+    </a>
+  </nav>
+</template>
+
+<script setup lang="ts">
+import type { ISecondNavItem } from '../../types';
+
+const { t } = useI18n();
+const { featureFlags } = useRuntimeConfig().public;
+const secondNav = (useAppConfig().secondNav || []) as ISecondNavItem[];
+const nicheState = useState<string>('niche');
+const defaultNiche = NicheHelper.getSiteDefaultNiche();
+
+const items = computed(() => {
+  const niche = nicheState.value || defaultNiche;
+
+  return secondNav
+    .filter(item => !item.featureFlag || featureFlags[item.featureFlag])
+    .map(item => ({ ...item, href: typeof item.link === 'string' ? item.link : item.link[niche] }))
+    .filter(item => !!item.href);
+});
+</script>
+
+<style lang="scss">
+.layout-second-nav {
+  display: flex;
+  justify-content: center;
+  gap: 12px;
+  padding: 8px var(--container-padding-inline);
+}
+
+.layout-second-nav__link {
+  @include font-sm;
+
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  padding: 4px 12px;
+  font-weight: 600;
+  white-space: nowrap;
+  color: $layout-second-nav-link-text;
+  background-color: $layout-second-nav-link-bg;
+  border-radius: $radius-md;
+}
+
+.layout-second-nav__link.--dot::after {
+  content: '';
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: 10px;
+  height: 10px;
+  background-color: $layout-second-nav-dot-bg;
+  border-radius: $radius-full;
+  transform: translate(40%, -40%);
+}
+</style>

package/layouts/default.vue

@@ -10,6 +10,8 @@
         hydrate-on-idle
       />
 
+      <LayoutSecondNav class="_to-sd"/>
+
       <main
         id="main"
         class="main"

package/package.json

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

package/types/index.d.ts

@@ -47,6 +47,7 @@ export * from './model-filter.d.ts';
 export * from './model-filter-payload.d.ts';
 export * from './multi-suggest.d.ts';
 export * from './navigation-items.d.ts';
+export * from './second-nav-item.d.ts';
 export * from './link-item.d.ts';
 export * from './fluid-player.d.ts';
 export * from './chips-item.d.ts';

package/types/second-nav-item.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Пункт второй навигации — ряд рекламных ссылок над контентом на мобиле (`appConfig.secondNav`).
+ * `link` — один адрес или адреса по нишам (`{ straight, gay, shemale }`); нет адреса для ниши — пункт
+ * не показывается. `title` — ключ `navigation.<title>`.
+ */
+export interface ISecondNavItem {
+  title: string
+  link: string | Record<string, string>
+  icon?: string
+  /** Зелёная точка «онлайн» в углу пункта. */
+  dot?: boolean
+  /** Имя фича-флага сайта: флаг выключен — пункта нет. */
+  featureFlag?: string
+}