@shift72/core-template 1.9.21 → 1.9.23

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.
package/CHANGELOG.md CHANGED
@@ -1,6 +1,22 @@
1
1
  # Changelog
2
2
 
3
- ## [Unreleased](https://github.com/shift72/core-template/compare/1.9.21...HEAD)
3
+ ## [Unreleased](https://github.com/shift72/core-template/compare/1.9.23...HEAD)
4
+
5
+ ## [1.9.23](https://github.com/shift72/core-template/compare/1.9.22...1.9.23)
6
+
7
+ ### Added
8
+
9
+ - Film title image support
10
+
11
+ ### Fixed
12
+
13
+ - Carousel video mute button to support light / custom theme
14
+
15
+ ## [1.9.22](https://github.com/shift72/core-template/compare/1.9.21...1.9.22)
16
+
17
+ ### Fixed
18
+
19
+ - Bug with carousel attempting to pause / play when video not found
4
20
 
5
21
  ## [1.9.21](https://github.com/shift72/core-template/compare/1.9.20...1.9.21)
6
22
 
package/kibble.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "core-template",
3
- "version": "0.0.1",
4
- "siteUrl": "https://tvoddemo.shift72.com",
3
+ "version": "1.9.23",
4
+ "siteUrl": "https://staging-store-kibble.shift72.com",
5
5
  "builderVersion": "0.17.5",
6
6
  "defaultLanguage": "en",
7
7
  "languages": {
@@ -194,5 +194,5 @@
194
194
  "pageSize": 0
195
195
  }
196
196
  ],
197
- "coreTemplateVersion": "1.9.21"
197
+ "coreTemplateVersion": "1.9.23"
198
198
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@shift72/core-template",
3
- "version": "1.9.21",
3
+ "version": "1.9.23",
4
4
  "description": "Shift72 core template",
5
5
  "license": "MIT",
6
6
  "scripts": {
@@ -502,6 +502,7 @@ function initCarouselVideo(app) {
502
502
 
503
503
  function playVideoSlide(slide) {
504
504
  const video = slide.querySelector('video');
505
+ if (!video) return;
505
506
  let s = video.querySelector('source');
506
507
  if (s.getAttribute('src')) {
507
508
  video.play();
@@ -512,6 +513,7 @@ function playVideoSlide(slide) {
512
513
  }
513
514
  function pauseVideoSlide(slide) {
514
515
  const video = slide.querySelector('video');
516
+ if (!video) return;
515
517
  video.pause();
516
518
  }
517
519
 
@@ -196,7 +196,7 @@
196
196
  width: 42px;
197
197
 
198
198
  svg {
199
- fill: #fff;
199
+ fill: var(--body-color);
200
200
  height: 26px;
201
201
  width: 26px;
202
202
  }
@@ -0,0 +1,19 @@
1
+ .item-title-image {
2
+ max-height: var(--title-image-max-height);
3
+ margin-left: var(--title-image-left-margin);
4
+ object-fit: contain;
5
+ object-position: left;
6
+ width: var(--title-image-width);
7
+ @include media-breakpoint-up(sm) {
8
+ width: var(--title-image-width-sm);
9
+ }
10
+ @include media-breakpoint-up(lg) {
11
+ width: var(--title-image-width-lg);
12
+ }
13
+ &.carousel {
14
+ margin-bottom: 16px;
15
+ }
16
+ &.film {
17
+ margin-bottom: 8px;
18
+ }
19
+ }
@@ -362,7 +362,7 @@
362
362
  left: 5px;
363
363
  pointer-events: none;
364
364
  position: absolute;
365
- top: 50%;
365
+ top: calc(50% + 2px);
366
366
  transform: translateY(-50%);
367
367
  transition: none;
368
368
  }
@@ -121,6 +121,13 @@
121
121
  --carousel-image-object-position-sm: center;
122
122
  --carousel-image-object-position-lg: center;
123
123
 
124
+ // Title Image sizing - carousel and detail page:
125
+ --title-image-width: 250px;
126
+ --title-image-width-sm: 350px;
127
+ --title-image-width-lg: 400px;
128
+ --title-image-max-height: 180px;
129
+ --title-image-left-margin: 0px;
130
+
124
131
  // Pages
125
132
  --collection-padding-bottom: 40px;
126
133
 
@@ -21,6 +21,7 @@
21
21
  @import '_meta-item';
22
22
  @import '_meta-sub-item';
23
23
  @import '_meta-item-tagline';
24
+ @import '_meta-item-title';
24
25
  @import '_availability-tags';
25
26
 
26
27
  @import '_collections';
@@ -1,10 +1,10 @@
1
1
  {{import "../../common/awards/carousel.jet"}}
2
- {{import "./item/title.jet"}}
3
2
  {{import "./item/tagline.jet"}}
4
3
  {{import "./item/image.jet"}}
5
4
  {{import "./item/synopsis.jet"}}
6
5
  {{import "../../common/sponsor-image.jet"}}
7
6
  {{import "../../common/cta_buttons.jet"}}
7
+ {{import "../../items/title.jet"}}
8
8
 
9
9
 
10
10
 
@@ -37,7 +37,7 @@
37
37
  {{end}}
38
38
 
39
39
  <div class="meta-item-content">
40
- {{yield carouselItemTitle(title=item.GetTitle(i18n))}}
40
+ {{yield itemTitle(title=item.GetTitle(i18n),class="carousel",element="h3") item.InnerItem}}
41
41
 
42
42
  {{yield carouselItemTagline() item.InnerItem}}
43
43
 
@@ -1,6 +1,7 @@
1
1
  {{extends "../application/application.jet"}}
2
2
  {{import "../common/slider.jet"}}
3
3
  {{import "../items/tagline.jet"}}
4
+ {{import "../items/title.jet"}}
4
5
  {{import "../items/sub_item.jet"}}
5
6
  {{import "../collection/page_collection_item.jet"}}
6
7
  {{import "../collection/slider.jet"}}
@@ -45,7 +46,7 @@
45
46
  </div>
46
47
 
47
48
  <div class="meta-detail-content">
48
- <h1>{{ film.Title }}</h1>
49
+ {{yield itemTitle(title=film.Title,class="carousel",element="h1") film}}
49
50
  <div class="meta-detail-tagline-and-classification">
50
51
  <div class="meta-detail-tagline">
51
52
  {{yield metaItemTagline() film}}
@@ -0,0 +1,10 @@
1
+ {{block itemTitle(title,class,element="h1")}}
2
+
3
+ {{titleImage := .ImageMap["Title"]}}
4
+
5
+ {{if isset(titleImage)}}
6
+ <img src="{{titleImage}}" alt="{{title}}" class="item-title-image {{class}}" />
7
+ {{else}}
8
+ <{{element}}>{{title}}</{{element}}>
9
+ {{end}}
10
+ {{end}}
@@ -1,3 +0,0 @@
1
- {{block carouselItemTitle(title)}}
2
- <h3>{{title}}</h3>
3
- {{end}}