itube-specs 0.0.966 → 0.0.967

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -5,7 +5,10 @@
5
5
  макете её нет, но формат живёт именно в этой колонке.
6
6
 
7
7
  Если моделей у ролика нет (и рекламы тоже), колонка не пустует: показываем пару
8
- рекомендаций, как было до макета. -->
8
+ рекомендаций, как было до макета.
9
+
10
+ Высота колонки ограничена высотой плеера, лишнее уходит в прокрутку внутри неё —
11
+ см. комментарий к стилям. -->
9
12
  <template>
10
13
  <div
11
14
  :class="[
@@ -13,26 +16,28 @@
13
16
  ]"
14
17
  class="player-aside-videos _from-sd"
15
18
  >
16
- <PlayerAsideModels
17
- v-for="item in models || []"
18
- :key="`aside-model-${item.slug}`"
19
- :title="item.title"
20
- :slug="item.slug"
21
- :info="item.info"
22
- :videos="item.videos?.items"
23
- class="player-aside-videos__model"
24
- />
19
+ <div class="player-aside-videos__inner">
20
+ <PlayerAsideModels
21
+ v-for="item in models || []"
22
+ :key="`aside-model-${item.slug}`"
23
+ :title="item.title"
24
+ :slug="item.slug"
25
+ :info="item.info"
26
+ :videos="item.videos?.items"
27
+ class="player-aside-videos__model"
28
+ />
25
29
 
26
- <AdvNtv v-if="featureFlags.AdsNTVEnabled" />
30
+ <AdvNtv v-if="featureFlags.AdsNTVEnabled" />
27
31
 
28
- <template v-if="!models?.length && !featureFlags.AdsNTVEnabled">
29
- <CardVideo
30
- v-for="item in asideVideos?.items?.slice(0, 2)"
31
- :key="`aside-video-${item.guid}`"
32
- :card="item"
33
- mini
34
- />
35
- </template>
32
+ <template v-if="!models?.length && !featureFlags.AdsNTVEnabled">
33
+ <CardVideo
34
+ v-for="item in asideVideos?.items?.slice(0, 2)"
35
+ :key="`aside-video-${item.guid}`"
36
+ :card="item"
37
+ mini
38
+ />
39
+ </template>
40
+ </div>
36
41
  </div>
37
42
  </template>
38
43
 
@@ -56,16 +61,36 @@ defineProps<{
56
61
  </script>
57
62
 
58
63
  <style lang="scss">
64
+ /**
65
+ * Высоту колонке задаёт плеер, а не её содержимое: блоков моделей может быть
66
+ * больше, чем помещается рядом с роликом, и тогда колонка растягивала строку
67
+ * сетки — плеер с описанием уезжали вверх от остальной страницы. Поэтому сама
68
+ * колонка держит только рамку (её собственная высота для сетки — ноль), а всё
69
+ * содержимое лежит абсолютным слоем поверх и прокручивается внутри. Скроллбар
70
+ * общий, из base/_global.scss.
71
+ */
59
72
  .player-aside-videos {
60
73
  @include from-br(sd) {
61
- display: grid;
62
- gap: 32px;
63
- grid-template-columns: 1fr;
74
+ position: relative;
64
75
  width: 288px;
65
- height: 100%;
66
76
  grid-column: 2;
67
77
  grid-row: 1;
68
- align-content: start;
78
+ }
79
+ }
80
+
81
+ .player-aside-videos__inner {
82
+ display: grid;
83
+ gap: 32px;
84
+ grid-template-columns: 1fr;
85
+ align-content: start;
86
+
87
+ @include from-br(sd) {
88
+ position: absolute;
89
+ inset: 0;
90
+ overflow-y: auto;
91
+
92
+ // полоса прокрутки не должна наезжать на карточки
93
+ padding-right: 4px;
69
94
  }
70
95
  }
71
96
  </style>
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "itube-specs",
3
3
  "type": "module",
4
- "version": "0.0.966",
4
+ "version": "0.0.967",
5
5
  "main": "./nuxt.config.ts",
6
6
  "types": "./types/index.d.ts",
7
7
  "scripts": {