diff --git a/package.json b/package.json index f3c34ad7..ba834c73 100644 --- a/package.json +++ b/package.json @@ -31,27 +31,27 @@ }, "private": true, "dependencies": { - "@angular/animations": "^6.1.1", - "@angular/common": "^6.1.1", - "@angular/compiler": "^6.1.1", - "@angular/core": "^6.1.1", - "@angular/forms": "^6.1.1", - "@angular/http": "^6.1.1", - "@angular/platform-browser": "^6.1.1", - "@angular/platform-browser-dynamic": "^6.1.1", - "@angular/platform-server": "^6.1.1", + "@angular/animations": "^6.1.9", + "@angular/common": "^6.1.9", + "@angular/compiler": "^6.1.9", + "@angular/core": "^6.1.9", + "@angular/forms": "^6.1.9", + "@angular/http": "^6.1.9", + "@angular/platform-browser": "^6.1.9", + "@angular/platform-browser-dynamic": "^6.1.9", + "@angular/platform-server": "^6.1.9", "@angular/pwa": "^0.7.4", - "@angular/router": "^6.1.1", - "@angular/service-worker": "^6.1.1", + "@angular/router": "^6.1.9", + "@angular/service-worker": "^6.1.9", "@ngrx/core": "^1.2.0", "@ngrx/effects": "^6.1.0", "@ngrx/entity": "^6.1.0", "@ngrx/router-store": "^6.1.0", "@ngrx/store": "^6.1.0", - "@ngu/carousel": "^1.4.8", - "@nguniversal/common": "^6.0.0", - "@nguniversal/express-engine": "^6.0.0", - "@nguniversal/module-map-ngfactory-loader": "^6.0.0", + "@ngu/carousel": "^1.5.3", + "@nguniversal/common": "^6.1.0", + "@nguniversal/express-engine": "^6.1.0", + "@nguniversal/module-map-ngfactory-loader": "^6.1.0", "@ngx-lite/input-star-rating": "^0.1.5", "@ngx-lite/json-ld": "^0.4.2", "@ngx-progressbar/core": "^5.0.1", diff --git a/src/app/landing/components/lp-banner/lp-banner.component.html b/src/app/landing/components/lp-banner/lp-banner.component.html index a6a66b70..23a5a84a 100644 --- a/src/app/landing/components/lp-banner/lp-banner.component.html +++ b/src/app/landing/components/lp-banner/lp-banner.component.html @@ -1,5 +1,5 @@ - - + + diff --git a/src/app/landing/components/lp-banner/lp-banner.component.scss b/src/app/landing/components/lp-banner/lp-banner.component.scss index eb26473b..90684026 100644 --- a/src/app/landing/components/lp-banner/lp-banner.component.scss +++ b/src/app/landing/components/lp-banner/lp-banner.component.scss @@ -2,7 +2,7 @@ :host { /deep/ .banner { .bannerStyle { - min-height: 20vh; + max-height: 350px; img { background-color: $theme-main-color - 50; } diff --git a/src/app/landing/components/lp-banner/lp-banner.component.ts b/src/app/landing/components/lp-banner/lp-banner.component.ts index 6d77290b..464f46b9 100644 --- a/src/app/landing/components/lp-banner/lp-banner.component.ts +++ b/src/app/landing/components/lp-banner/lp-banner.component.ts @@ -1,6 +1,6 @@ import { environment } from './../../../../environments/environment'; import { Component, OnInit, ChangeDetectionStrategy, ViewChild } from '@angular/core'; -import { NguCarousel, NguCarouselStore } from '@ngu/carousel'; +import { NguCarouselStore, NguCarouselConfig } from '@ngu/carousel'; @Component({ selector: 'app-lp-banner', @@ -10,20 +10,18 @@ import { NguCarousel, NguCarouselStore } from '@ngu/carousel'; }) export class LpBannerComponent implements OnInit { public bannerItems = environment.config.landing_page_banner; - public carouselOne: NguCarousel; + public carouselBanner: NguCarouselConfig; @ViewChild('landingBanners') landingBanners: NguCarouselStore; constructor() {} ngOnInit() { - this.carouselOne = { + this.carouselBanner = { grid: { xs: 1, sm: 1, md: 1, lg: 1, all: 0 }, slide: 1, speed: 400, - interval: 4000, point: { visible: true, - pointStyles: '.ngucarouselPoint {}' // To apply our modification }, load: 2, touch: true, diff --git a/src/app/product/components/product-detail-page/product-images/product-images.component.html b/src/app/product/components/product-detail-page/product-images/product-images.component.html index 5070ea45..42e99650 100644 --- a/src/app/product/components/product-detail-page/product-images/product-images.component.html +++ b/src/app/product/components/product-detail-page/product-images/product-images.component.html @@ -19,8 +19,8 @@
- - + + diff --git a/src/app/product/components/product-detail-page/product-images/product-images.component.scss b/src/app/product/components/product-detail-page/product-images/product-images.component.scss index 28ca842c..208a7d07 100644 --- a/src/app/product/components/product-detail-page/product-images/product-images.component.scss +++ b/src/app/product/components/product-detail-page/product-images/product-images.component.scss @@ -52,3 +52,32 @@ img { width: 200px; height: 020px; } + +.ngucarouselPoint { + list-style-type: none; + padding: 10px; + white-space: nowrap; + overflow: auto; + position: relative; + left: 0; + box-sizing: border-box; + background-color: transparent; + margin: 0 auto -28px; + align-self: center; + width: fit-content; + border-radius: 5px 5px 0 0; +} +.ngucarouselPoint li { + display: inline-block; + border-radius: 999px; + background-color: rgba(0, 0, 255, 0.55); + padding: 5px; + margin: 0 3px; + transition: .4s ease all; +} +.ngucarouselPoint li a img{height:190px;margin:auto} +.ngucarouselPoint li.active { + background-color: transparent; + border: 1px solid rgba(0, 0, 255, 0.55); + width: 10px; +} diff --git a/src/app/product/components/product-detail-page/product-images/product-images.component.ts b/src/app/product/components/product-detail-page/product-images/product-images.component.ts index ae1500c5..62ac7ed7 100644 --- a/src/app/product/components/product-detail-page/product-images/product-images.component.ts +++ b/src/app/product/components/product-detail-page/product-images/product-images.component.ts @@ -1,8 +1,6 @@ import { Image } from './../../../../core/models/image'; -import { environment } from './../../../../../environments/environment'; -import { Product } from './../../../../core/models/product'; import { Component, OnInit, Input, ChangeDetectionStrategy } from '@angular/core'; -import { NguCarousel } from '@ngu/carousel'; +import { NguCarouselConfig } from '@ngu/carousel'; const img1 = require('../../../../../assets/thumbnail.jpg'); const img2 = require('../../../../../assets/thumbnail2.jpg'); @@ -30,7 +28,7 @@ export class ProductImagesComponent implements OnInit { } }; @Input() isMobile; - public carouselOne: NguCarousel; + public carouselOne: NguCarouselConfig; constructor() { } ngOnInit() { @@ -38,39 +36,8 @@ export class ProductImagesComponent implements OnInit { grid: { xs: 1, sm: 1, md: 1, lg: 1, all: 0 }, slide: 1, speed: 400, - interval: 4000, point: { visible: true, - pointStyles: ` - .ngucarouselPoint { - list-style-type: none; - padding: 10px; - white-space: nowrap; - overflow: auto; - position: relative; - left: 0; - box-sizing: border-box; - background-color: transparent; - margin: 0 auto -28px; - align-self: center; - width: fit-content; - border-radius: 5px 5px 0 0; - } - .ngucarouselPoint li { - display: inline-block; - border-radius: 999px; - background-color: rgba(0, 0, 255, 0.55); - padding: 5px; - margin: 0 3px; - transition: .4s ease all; - } - .ngucarouselPoint li a img{height:190px;margin:auto} - .ngucarouselPoint li.active { - background-color: transparent; - border: 1px solid rgba(0, 0, 255, 0.55); - width: 10px; - } - ` }, load: 2, touch: true, diff --git a/src/app/shared/components/product-slider/product-slider.component.html b/src/app/shared/components/product-slider/product-slider.component.html index e58b00a0..d5c2a73c 100644 --- a/src/app/shared/components/product-slider/product-slider.component.html +++ b/src/app/shared/components/product-slider/product-slider.component.html @@ -1,6 +1,6 @@
- - + + @@ -8,4 +8,4 @@
-
\ No newline at end of file + diff --git a/src/app/shared/components/product-slider/product-slider.component.scss b/src/app/shared/components/product-slider/product-slider.component.scss index 07a26fb0..e488b33a 100644 --- a/src/app/shared/components/product-slider/product-slider.component.scss +++ b/src/app/shared/components/product-slider/product-slider.component.scss @@ -51,6 +51,9 @@ :host { /deep/ .banner { + .ngucarousel { + position: initial; + } .leftRs, .rightRs { position: absolute; diff --git a/src/app/shared/components/product-slider/product-slider.component.ts b/src/app/shared/components/product-slider/product-slider.component.ts index 957c9140..d15d1161 100644 --- a/src/app/shared/components/product-slider/product-slider.component.ts +++ b/src/app/shared/components/product-slider/product-slider.component.ts @@ -1,4 +1,4 @@ -import { NguCarousel } from '@ngu/carousel'; +import { NguCarouselConfig } from '@ngu/carousel'; import { Component, OnInit, Input, ChangeDetectionStrategy } from '@angular/core'; @Component({ @@ -9,7 +9,7 @@ import { Component, OnInit, Input, ChangeDetectionStrategy } from '@angular/core }) export class ProductSliderComponent implements OnInit { @Input() productsList = new Array(10); - public carouselOne: NguCarousel; + public carouselOne: NguCarouselConfig; @Input() showRating: boolean; constructor() { this.carouselOne = { diff --git a/yarn.lock b/yarn.lock index 5c6491d1..500462ef 100644 --- a/yarn.lock +++ b/yarn.lock @@ -97,9 +97,9 @@ "@angular-devkit/core" "0.7.4" rxjs "^6.0.0" -"@angular/animations@^6.1.1": - version "6.1.1" - resolved "https://registry.yarnpkg.com/@angular/animations/-/animations-6.1.1.tgz#aea467f84e4344601bcb3c00929be4efe86d3606" +"@angular/animations@^6.1.9": + version "6.1.9" + resolved "https://registry.yarnpkg.com/@angular/animations/-/animations-6.1.9.tgz#1d87469e6f6b89a8713570dfbe97700ea85bd007" dependencies: tslib "^1.9.0" @@ -118,9 +118,9 @@ symbol-observable "^1.2.0" yargs-parser "^10.0.0" -"@angular/common@^6.1.1": - version "6.1.1" - resolved "https://registry.yarnpkg.com/@angular/common/-/common-6.1.1.tgz#78b2bb69604220720ee2f96d32469fae43dc6325" +"@angular/common@^6.1.9": + version "6.1.9" + resolved "https://registry.yarnpkg.com/@angular/common/-/common-6.1.9.tgz#638fa8e8e30626116ea9ea36e6f2f00fed971f77" dependencies: tslib "^1.9.0" @@ -133,27 +133,27 @@ reflect-metadata "^0.1.2" tsickle "^0.32.1" -"@angular/compiler@^6.1.1": - version "6.1.1" - resolved "https://registry.yarnpkg.com/@angular/compiler/-/compiler-6.1.1.tgz#ad0d638559448499834ad3cf45bc2aa03a6b4f14" +"@angular/compiler@^6.1.9": + version "6.1.9" + resolved "https://registry.yarnpkg.com/@angular/compiler/-/compiler-6.1.9.tgz#3696659f752b5e239f5186cea72cf17965b59cb8" dependencies: tslib "^1.9.0" -"@angular/core@^6.1.1": - version "6.1.1" - resolved "https://registry.yarnpkg.com/@angular/core/-/core-6.1.1.tgz#dfdc6dd4bb01cb12d0a1faac4cb3ac7caa3b35ba" +"@angular/core@^6.1.9": + version "6.1.9" + resolved "https://registry.yarnpkg.com/@angular/core/-/core-6.1.9.tgz#a21a35de551c95f276ecbb1f314949cc69326950" dependencies: tslib "^1.9.0" -"@angular/forms@^6.1.1": - version "6.1.1" - resolved "https://registry.yarnpkg.com/@angular/forms/-/forms-6.1.1.tgz#41aec34576d4e3fed5791b65dc6d638d180cd11e" +"@angular/forms@^6.1.9": + version "6.1.9" + resolved "https://registry.yarnpkg.com/@angular/forms/-/forms-6.1.9.tgz#d9d8591f4c74270e53e3184eb45e19ba490fdf32" dependencies: tslib "^1.9.0" -"@angular/http@^6.1.1": - version "6.1.1" - resolved "https://registry.yarnpkg.com/@angular/http/-/http-6.1.1.tgz#9ae2c36c15c793ab82830ecb8e1e69c10ae8dade" +"@angular/http@^6.1.9": + version "6.1.9" + resolved "https://registry.yarnpkg.com/@angular/http/-/http-6.1.9.tgz#241f35207d62f86bc155feb124a1e73515d66fb6" dependencies: tslib "^1.9.0" @@ -161,21 +161,21 @@ version "6.1.1" resolved "https://registry.yarnpkg.com/@angular/language-service/-/language-service-6.1.1.tgz#131a320be957a02dcf710d9242bd8e43b7c24c3c" -"@angular/platform-browser-dynamic@^6.1.1": - version "6.1.1" - resolved "https://registry.yarnpkg.com/@angular/platform-browser-dynamic/-/platform-browser-dynamic-6.1.1.tgz#2505f463d29827256944c1d134cd8519e7f954cd" +"@angular/platform-browser-dynamic@^6.1.9": + version "6.1.9" + resolved "https://registry.yarnpkg.com/@angular/platform-browser-dynamic/-/platform-browser-dynamic-6.1.9.tgz#e00f1a4948b4c299b17c9561d83f7ea588117818" dependencies: tslib "^1.9.0" -"@angular/platform-browser@^6.1.1": - version "6.1.1" - resolved "https://registry.yarnpkg.com/@angular/platform-browser/-/platform-browser-6.1.1.tgz#2ee638b6ff25a01943aa26906d83fe7b150d7101" +"@angular/platform-browser@^6.1.9": + version "6.1.9" + resolved "https://registry.yarnpkg.com/@angular/platform-browser/-/platform-browser-6.1.9.tgz#6c832e528c660ad880a16531754e65b9b97d4f9f" dependencies: tslib "^1.9.0" -"@angular/platform-server@^6.1.1": - version "6.1.1" - resolved "https://registry.yarnpkg.com/@angular/platform-server/-/platform-server-6.1.1.tgz#fb5d0aac97bd36d281871594c83333b40e674ee2" +"@angular/platform-server@^6.1.9": + version "6.1.9" + resolved "https://registry.yarnpkg.com/@angular/platform-server/-/platform-server-6.1.9.tgz#431f40278b52779825d5e087283b5d823d72c29d" dependencies: domino "^2.0.1" tslib "^1.9.0" @@ -190,15 +190,15 @@ "@schematics/angular" "0.7.4" typescript "~2.6.2" -"@angular/router@^6.1.1": - version "6.1.1" - resolved "https://registry.yarnpkg.com/@angular/router/-/router-6.1.1.tgz#b597da6009213b656347ec13b89de3643e5767c0" +"@angular/router@^6.1.9": + version "6.1.9" + resolved "https://registry.yarnpkg.com/@angular/router/-/router-6.1.9.tgz#29869e53442703c53a943ce375cbb0a0f36927fb" dependencies: tslib "^1.9.0" -"@angular/service-worker@^6.1.1": - version "6.1.1" - resolved "https://registry.yarnpkg.com/@angular/service-worker/-/service-worker-6.1.1.tgz#9d7bfea9c1b363dc81bc9109fee95147f0a55100" +"@angular/service-worker@^6.1.9": + version "6.1.9" + resolved "https://registry.yarnpkg.com/@angular/service-worker/-/service-worker-6.1.9.tgz#c45f929ddc369c3ba75985656c8774e94c9fd322" dependencies: tslib "^1.9.0" @@ -294,21 +294,23 @@ tree-kill "^1.0.0" webpack-sources "^1.1.0" -"@ngu/carousel@^1.4.8": - version "1.4.8" - resolved "https://registry.yarnpkg.com/@ngu/carousel/-/carousel-1.4.8.tgz#102a2472e319fa2c048d59b5c1c347f2ef60f922" +"@ngu/carousel@^1.5.3": + version "1.5.3" + resolved "https://registry.yarnpkg.com/@ngu/carousel/-/carousel-1.5.3.tgz#99b91df82b74bec9c6bfc7c55f963dbbf96c986a" + dependencies: + tslib "^1.9.0" -"@nguniversal/common@^6.0.0": - version "6.0.0" - resolved "https://registry.yarnpkg.com/@nguniversal/common/-/common-6.0.0.tgz#50e4b80d08618064e3404306b24b97877db9007d" +"@nguniversal/common@^6.1.0": + version "6.1.0" + resolved "https://registry.yarnpkg.com/@nguniversal/common/-/common-6.1.0.tgz#10e6bf8784f88d0fc43cdfe44e61a8de4d92a33c" -"@nguniversal/express-engine@^6.0.0": - version "6.0.0" - resolved "https://registry.yarnpkg.com/@nguniversal/express-engine/-/express-engine-6.0.0.tgz#f8bc7b5e940afb1ffdbdcb1bb22665d440ea0b0b" +"@nguniversal/express-engine@^6.1.0": + version "6.1.0" + resolved "https://registry.yarnpkg.com/@nguniversal/express-engine/-/express-engine-6.1.0.tgz#384d761556a0accc0738ae89b8a63afb43e76a86" -"@nguniversal/module-map-ngfactory-loader@^6.0.0": - version "6.0.0" - resolved "https://registry.yarnpkg.com/@nguniversal/module-map-ngfactory-loader/-/module-map-ngfactory-loader-6.0.0.tgz#0dd26c3f1c26d17bb21b8dfc0da53d82b7f11028" +"@nguniversal/module-map-ngfactory-loader@^6.1.0": + version "6.1.0" + resolved "https://registry.yarnpkg.com/@nguniversal/module-map-ngfactory-loader/-/module-map-ngfactory-loader-6.1.0.tgz#49eb65ed4dc3a3273c920b905e0925e0ed2fbcb8" "@ngx-lite/input-star-rating@^0.1.5": version "0.1.5"