fix(home): fix to lazy img src on safari

Author: luiskcs89

src/components.d.ts

@@ -176,207 +176,207 @@ declare global {
       prototype: HTMLAppCarouselIndicatorsElement;
       new (): HTMLAppCarouselIndicatorsElement;
     };
-
+    
 
     interface HTMLAppCtaElement extends StencilComponents.AppCta, HTMLStencilElement {}
 
     var HTMLAppCtaElement: {
       prototype: HTMLAppCtaElement;
       new (): HTMLAppCtaElement;
     };
-
+    
 
     interface HTMLAppFooterElement extends StencilComponents.AppFooter, HTMLStencilElement {}
 
     var HTMLAppFooterElement: {
       prototype: HTMLAppFooterElement;
       new (): HTMLAppFooterElement;
     };
-
+    
 
     interface HTMLAppImgElement extends StencilComponents.AppImg, HTMLStencilElement {}
 
     var HTMLAppImgElement: {
       prototype: HTMLAppImgElement;
       new (): HTMLAppImgElement;
     };
-
+    
 
     interface HTMLLazyImgElement extends StencilComponents.LazyImg, HTMLStencilElement {}
 
     var HTMLLazyImgElement: {
       prototype: HTMLLazyImgElement;
       new (): HTMLLazyImgElement;
     };
-
+    
 
     interface HTMLAppInputElement extends StencilComponents.AppInput, HTMLStencilElement {}
 
     var HTMLAppInputElement: {
       prototype: HTMLAppInputElement;
       new (): HTMLAppInputElement;
     };
-
+    
 
     interface HTMLAppMembersElement extends StencilComponents.AppMembers, HTMLStencilElement {}
 
     var HTMLAppMembersElement: {
       prototype: HTMLAppMembersElement;
       new (): HTMLAppMembersElement;
     };
-
+    
 
     interface HTMLAppNavHeaderElement extends StencilComponents.AppNavHeader, HTMLStencilElement {}
 
     var HTMLAppNavHeaderElement: {
       prototype: HTMLAppNavHeaderElement;
       new (): HTMLAppNavHeaderElement;
     };
-
+    
 
     interface HTMLAppRadioElement extends StencilComponents.AppRadio, HTMLStencilElement {}
 
     var HTMLAppRadioElement: {
       prototype: HTMLAppRadioElement;
       new (): HTMLAppRadioElement;
     };
-
+    
 
     interface HTMLAppSliderElement extends StencilComponents.AppSlider, HTMLStencilElement {}
 
     var HTMLAppSliderElement: {
       prototype: HTMLAppSliderElement;
       new (): HTMLAppSliderElement;
     };
-
+    
 
     interface HTMLAppTextareaElement extends StencilComponents.AppTextarea, HTMLStencilElement {}
 
     var HTMLAppTextareaElement: {
       prototype: HTMLAppTextareaElement;
       new (): HTMLAppTextareaElement;
     };
-
+    
 
     interface HTMLAppTranslateElement extends StencilComponents.AppTranslate, HTMLStencilElement {}
 
     var HTMLAppTranslateElement: {
       prototype: HTMLAppTranslateElement;
       new (): HTMLAppTranslateElement;
     };
-
+    
 
     interface HTMLContentGraphicElement extends StencilComponents.ContentGraphic, HTMLStencilElement {}
 
     var HTMLContentGraphicElement: {
       prototype: HTMLContentGraphicElement;
       new (): HTMLContentGraphicElement;
     };
-
+    
 
     interface HTMLApp404Element extends StencilComponents.App404, HTMLStencilElement {}
 
     var HTMLApp404Element: {
       prototype: HTMLApp404Element;
       new (): HTMLApp404Element;
     };
-
+    
 
     interface HTMLAppAboutElement extends StencilComponents.AppAbout, HTMLStencilElement {}
 
     var HTMLAppAboutElement: {
       prototype: HTMLAppAboutElement;
       new (): HTMLAppAboutElement;
     };
-
+    
 
     interface HTMLAppCaseStudyElement extends StencilComponents.AppCaseStudy, HTMLStencilElement {}
 
     var HTMLAppCaseStudyElement: {
       prototype: HTMLAppCaseStudyElement;
       new (): HTMLAppCaseStudyElement;
     };
-
+    
 
     interface HTMLAppContactElement extends StencilComponents.AppContact, HTMLStencilElement {}
 
     var HTMLAppContactElement: {
       prototype: HTMLAppContactElement;
       new (): HTMLAppContactElement;
     };
-
+    
 
     interface HTMLAppDetailedServiceElement extends StencilComponents.AppDetailedService, HTMLStencilElement {}
 
     var HTMLAppDetailedServiceElement: {
       prototype: HTMLAppDetailedServiceElement;
       new (): HTMLAppDetailedServiceElement;
     };
-
+    
 
     interface HTMLAppHomeElement extends StencilComponents.AppHome, HTMLStencilElement {}
 
     var HTMLAppHomeElement: {
       prototype: HTMLAppHomeElement;
       new (): HTMLAppHomeElement;
     };
-
+    
 
     interface HTMLAppOpportunitiesElement extends StencilComponents.AppOpportunities, HTMLStencilElement {}
 
     var HTMLAppOpportunitiesElement: {
       prototype: HTMLAppOpportunitiesElement;
       new (): HTMLAppOpportunitiesElement;
     };
-
+    
 
     interface HTMLAppResourcesElement extends StencilComponents.AppResources, HTMLStencilElement {}
 
     var HTMLAppResourcesElement: {
       prototype: HTMLAppResourcesElement;
       new (): HTMLAppResourcesElement;
     };
-
+    
 
     interface HTMLAppServiceLevelAgreementElement extends StencilComponents.AppServiceLevelAgreement, HTMLStencilElement {}
 
     var HTMLAppServiceLevelAgreementElement: {
       prototype: HTMLAppServiceLevelAgreementElement;
       new (): HTMLAppServiceLevelAgreementElement;
     };
-
+    
 
     interface HTMLAppTeamLandingElement extends StencilComponents.AppTeamLanding, HTMLStencilElement {}
 
     var HTMLAppTeamLandingElement: {
       prototype: HTMLAppTeamLandingElement;
       new (): HTMLAppTeamLandingElement;
     };
-
+    
 
     interface HTMLAppToolboxElement extends StencilComponents.AppToolbox, HTMLStencilElement {}
 
     var HTMLAppToolboxElement: {
       prototype: HTMLAppToolboxElement;
       new (): HTMLAppToolboxElement;
     };
-
+    
 
     interface HTMLAppTosElement extends StencilComponents.AppTos, HTMLStencilElement {}
 
     var HTMLAppTosElement: {
       prototype: HTMLAppTosElement;
       new (): HTMLAppTosElement;
     };
-
+    
 
     interface HTMLOpenForgeAppElement extends StencilComponents.OpenForgeApp, HTMLStencilElement {}
 
     var HTMLOpenForgeAppElement: {
       prototype: HTMLOpenForgeAppElement;
       new (): HTMLOpenForgeAppElement;
     };
-
+    
 
   namespace JSX {
     interface Element {}

src/components/app-img/lazy-img.tsx

@@ -50,8 +50,9 @@ export class LazyImg {
   }
 
   handleImage() {
+    console.log('a');
     const image = this.image;
-    image.setAttribute('src', image.getAttribute('data-src') || '');
+    image.setAttribute('src', this.src || '');
     image.onload = () => {
       image.removeAttribute('data-src');
       this.lazyImgloaded.emit(image);

src/pages/app-home/app-home.scss

@@ -298,9 +298,11 @@
       }
 
       .phone-image {
-        height: 440px;
-        @include media-breakpoint-down(sm) {
-          height: auto;
+        img {
+          height: 440px;
+          @include media-breakpoint-down(sm) {
+            height: auto;
+          }
         }
       }
     }