Netcentric / vg-macktrucks-com-rd

Franklin Site Redesign for https://www.macktrucks.com
Apache License 2.0
1 stars 0 forks source link

Truck features #43 #155

Closed TomaszDziezykNetcentric closed 8 months ago

TomaszDziezykNetcentric commented 8 months ago

Fix #43

Test URLs:

aem-code-sync[bot] commented 8 months ago

Hello, I'm the AEM Code Sync Bot and I will run some test suites that validate the page speed. In case there are problems, just click the checkbox below to rerun the respective action.

aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
cogniSyb commented 8 months ago

I expect the main browser scrollbar to be present, and that as a user I can also use the keyboard (arrows/spacebar/page up/page down).

Example of this can be found on https://www.elgato.com/eu/en/p/prompter: Screenshot 2023-10-31 at 09 51 04

aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
TomaszDziezykNetcentric commented 8 months ago

I expect the main browser scrollbar to be present, and that as a user I can also use the keyboard (arrows/spacebar/page up/page down).

Example of this can be found on https://www.elgato.com/eu/en/p/prompter: Screenshot 2023-10-31 at 09 51 04

Updated

aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
TomaszDziezykNetcentric commented 8 months ago

I am not sure if it is my keyboard. seems to be not working properly for me key up , down, left, right

@Lakshmishri What do you mean that keys up, down, left and right aren't working properly? The key up and down should scroll the page. The left and right buttons shouldn't have any special behavior. I didn't add any special behavior for the keyboard.

aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
TomaszDziezykNetcentric commented 8 months ago

UX-wise I’m expecting to switch faster to another slide. I think that right now we’re scrolling past the whole image before switching. Could we make it more 'responsive' to the user scroll/keyboard action?

I made the changes. Now we can change the number of pixels needed to change the slide in one variable (SLIDE_SCROLL_PADDING_IN_PX).

taimurCognizant commented 8 months ago
image

@TomaszDziezykNetcentric In mobile view there a is huge space after the bottom text. As per my understanding of the requirements and design the bottom text should stick to the bottom of the mobile screen and the images should be in the middle of the heading and the text @cogniSyb do you have any comments on this?

taimurCognizant commented 8 months ago

@TomaszDziezykNetcentric also the blur effect is missing for mobile. Not sure if that was part of requirement or not

aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
cogniSyb commented 8 months ago

@TomaszDziezykNetcentric In mobile view there a is huge space after the bottom text. As per my understanding of the requirements and design the bottom text should stick to the bottom of the mobile screen and the images should be in the middle of the heading and the text @cogniSyb do you have any comments on this?

Good point, @taimurCognizant. This is a bit difficult to get out of Figma. We might want to use justify-content: space-evenly; or justify-content: center; here for mobile.

TomaszDziezykNetcentric commented 8 months ago

@TomaszDziezykNetcentric also the blur effect is missing for mobile. Not sure if that was part of requirement or not

I agree that the blur effect should be there. Code updated

aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
TomaszDziezykNetcentric commented 8 months ago

@TomaszDziezykNetcentric In mobile view there a is huge space after the bottom text. As per my understanding of the requirements and design the bottom text should stick to the bottom of the mobile screen and the images should be in the middle of the heading and the text @cogniSyb do you have any comments on this?

Good point, @taimurCognizant. This is a bit difficult to get out of Figma. We might want to use justify-content: space-evenly; or justify-content: center; here for mobile.

@cogniSyb @taimurCognizant The aligments is updated

obraz
aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
aem-code-sync[bot] commented 8 months ago
Page Scores Audits Google
/drafts/tdziezyk/v2/truck-features PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI