diff --git a/src/app/home/home.component.css b/src/app/home/home.component.css index 0e44c53..48a9281 100644 --- a/src/app/home/home.component.css +++ b/src/app/home/home.component.css @@ -1,7 +1,7 @@ .me-section { background: rgb(46,46,46); background: linear-gradient(180deg, rgba(46,46,46,1) 35%, rgba(51,51,51,1) 100%); - height: 90vh; + height: 90dvh; } .intro { @@ -97,7 +97,7 @@ .stack-section { background: rgb(241,241,241); /*background: linear-gradient(0deg, rgba(241,241,241,1) 80%, rgba(51,51,51,1) 100%);*/ - height: 80vh; + height: 80dvh; } .stack { height: 35%; @@ -120,6 +120,7 @@ .stack-slider { height: 65%; + min-height: 425px; } @@ -130,7 +131,7 @@ } .stack-section { - height: 90vh; + height: 90dvh; } .stack { padding-top: 60px; @@ -138,3 +139,14 @@ height: 30%; } } + +@media only screen and (max-height: 750px) { + .stack-section { + height: fit-content; + } + + .stack-slider { + height: fit-content; + /*min-height: 425px;*/ + } +} diff --git a/src/app/home/stack-slider/stack-slider.component.ts b/src/app/home/stack-slider/stack-slider.component.ts index ef32c00..d830ff9 100644 --- a/src/app/home/stack-slider/stack-slider.component.ts +++ b/src/app/home/stack-slider/stack-slider.component.ts @@ -94,7 +94,7 @@ export class StackSliderComponent implements AfterViewInit { this.ngxGlide.showBullets = false; this.ngxGlide.type = 'carousel'; this.ngxGlide.focusAt = 'center'; - this.ngxGlide.gap = 10; + this.ngxGlide.gap = numberOfCards === 1 ? 0 : 10; this.ngxGlide.autoplay = 3000; this.ngxGlide.recreate();