tallwave / sargon-qa Goto Github PK

Remove the "View Project" button over the images.

https://drive.google.com/file/d/1EnkfduBklveydJ0rFD_8j5qT2t3wx_G4/view?usp=sharing

Severity: Minor
Location: http://sargonmc.wpengine.com/our-work
OS / OS Version: All Platforms and Browsers
Device / Browser: All Platforms and Browsers
 
Expected Results:
When the user is viewing the Our Work page, the 'About Us', 'Explore Steel', and 'Explore Masonry' links will redirect to the correct corresponding pages.

Actual Results:
When the user is viewing the Our Work page, the 'About Us', 'Explore Steel', and 'Explore Masonry' links redirect the user to the Home page.
 
Steps To Reproduce:
1. Launch http://sargonmc.wpengine.com/ on any platform in scope
2. Proceed to 'Our Work' page
3. Scroll down until the user is viewing the 'About Us', 'Masonry Services', and 'Steel Services' links
4. Select each link
5. Observe each link redirects the user to the Home page
 
Notes: N/A

Rate of Reproduction: 100%

https://drive.google.com/file/d/11sY4nkviGYd4vofmSBBcBkWs8rQZBALq/view?usp=sharing

Links:
https://www.instagram.com/sargon_masonry/
https://www.linkedin.com/company/sargon-masonry/about/

See UI kit page 2 for interaction/hover state.

Jason's comment after submission:
The hover and icon look good.

But let's update so both external links open in a new tab.

What:
Please add a favicon
http://sargonmc.wpengine.com/

Why:
It is a common website practice.

cc: @NoelWormwood

Thanks!

Severity: Minor
Location: https://sargonmc.wpengine.com/
OS / OS Version: OSX 10.14.3, iOS 10.1.1, iOS 10.2.1, iOS 11.4, iOS 12.4.1
Device / Browser: Desktop Safari 12.0.3, iPhone 7, iPhone 8 Plus, iPhone X, iPad 4th Gen, iPad Air 2nd Gen
 
Expected Results:
The navigation menu will display when the user scroll to the top of any page.
 
Actual Results:
When the user scrolls to the top after exploring a page, the navigation menu remains hidden from view.
 
Steps To Reproduce:
1. Launch http://sargonmc.wpengine.com/ in Safari
2. On any page, scroll down to the bottom of the page
3. Scroll to the top of the page
4. Observe that the navigation menu remains hidden after the user reaches the top of the page
 
Notes: N/A

Rate of Reproduction: 100%

This was a client ask.

For the animation I'm thinking something like this: https://codepen.io/bewley/pen/revRQv

On desktop, the logo needs more space between it and the "Services" column of text. Can we move "Services..." over to the right so it sits closer to the other column of text.

Then on mobile, the layout isn't working as comped. Was thinking everything would go to centered (using the stacked logo). We need to make sure to add some padding beneath the logo so it has some breathing room, and let's keep the social logos all on the same line.

WP Screengrabs:
https://drive.google.com/file/d/12T_BrJdndGLfXfaetQYztM2A75CQ_ERa/view?usp=sharing
https://drive.google.com/file/d/12Tb_Hgd-CM8ANusdJZyhkrjTCN2sof6x/view?usp=sharing

Comps for reference:
https://drive.google.com/file/d/12bVl1ndVj34GKEhXYsxf93FJPvjo0NjO/view?usp=sharing
https://drive.google.com/file/d/12_Qv1JMlddBGWWqNFEjzV5T2ymLHRs3p/view?usp=sharing

Jason's comment after submission:
Cool, all looks good except one minor thing:

When viewing on mobile, the logo looks just a tad off-centered.

https://drive.google.com/file/d/19K6YqSJSQuq2M7PtZittQHmRsjITpPPT/view?usp=sharing

the diagonal line and the arrow aren't centering vertically within the container

The client would also like to remove the lightning bolt icon

Client would like each association to link out:

HBACA: https://www.hbaca.org/
Arizona Masonry Guild: https://azmasonry.org/
Arizona Masonry Contractors Association: https://azmasonry.org/
Valley Partnerships: https://www.valleypartnership.org/
icpi: https://www.icpi.org/

The "Submit" button under Partner with Us is not colored like the other pages.

See castlehotsprings.com for example

This is still too high...please lower to right above the next component

The 2 phone number links look like they're using the wrong blue link color.

Please update to #226c93

The client would like to add a third map (same box/line as the other two) and title it "Sargon Headquarters" with the text "Under Construction". Address TBD

Severity: Minor
Location: http://sargonmc.wpengine.com/employment, http://sargonmc.wpengine.com/about-us
OS / OS Version: All iPhones and Android Phones in scope
Device / Browser: All iPhones and Android Phones in scope
 
Expected Results:
All text on all pages will remain visible and easily readable to the user.
 
Actual Results:
The first paragraph of text on the "Employment" and "About Us" pages is overlapped at the bottom by the image directly beneath it, preventing the user from reading all the text.

 
Steps To Reproduce:
1. Launch http://sargonmc.wpengine.com/ on any iPhone or Android Phone
2. Select the hamburger menu icon in the top right corner
3. Select "Employment"
4. Observe the bottom of the first paragraph is obscured by the photo
 
Notes: N/A

Rate of Reproduction: 100%

https://drive.google.com/file/d/11jWeZGdh9ybgE4qtyXCApWplB3Jm5xuu/view?usp=sharing

This is not hovering to the correct color

The "Submit" button styling is incorrect. Should be the same gold treatment as the rest of the pages

Severity: Minor
Location: http://sargonmc.wpengine.com/
OS / OS Version: iOS 10.1.1
Device / Browser: iPhone 7 / Safari
 
Expected Results:
When the user is navigating the Home page, the navigation menu will fit the screen size.
 
Actual Results:
When the user is navigating the Home page on the iPhone 7, the navigation menu is stretched, causing the website to load with a large, blank space that allows for horizontal scrolling.
 
Steps To Reproduce:
1. Launch http://sargonmc.wpengine.com/ on an iPhone 7 in Safari
2. Note that the Menu icon is not displayed
3. Scroll to the right until the user reaches the end of the page
4. Reverse pinch to zoom out on the page
5. Observe that the navigation bar is stretched
 
Notes: N/A

Rate of Reproduction: 100%

https://drive.google.com/file/d/19BxDYElF3O7uhZISzgvhfB3BGsfkBSte/view?usp=sharing

I'm seeing the issue in the "Partner with Us" component throughout the site, and also the phone numbers on the Contact Us page

Remove the "View Project" button over the images.

Also on the Stone page, there are only 3, but it's holding a spot for a 4th and showing a broken image

The client would like to add a 4th circle image and content on each of these service pages. The team was able to add this within the CMS but it is not pulling through on the frontend

We would like to keep all 4 on the same line and centered

Let's reduce the height of this container when there are no entries listed. Right now there's a lot of extra space at the bottom

https://drive.google.com/file/d/19CB4byYBA6JBETo4LH8nd23l-xCbTnkR/view?usp=sharing

We're missing the "Featured Work" card/info in the lower right corner (and the carousel if multiple images). These should link off to the individual case study pages.

*If we don't end up launching with individual case study pages, this can link to the "Our Work" page

https://drive.google.com/file/d/12jqlIbDcKitSvA6ztkJGK1AE-lBBOxQi/view?usp=sharing

I have updated the last circle icon (currently Stone Veneer) to Commercial Buildings and new imagery but it is not pulling through on the front end. Can we please have this resolved before 10am on 10/16.

This is not functioning as expected and is showing a white block in place of the hamburger menu.

Let's left-align the logo, with hamburger menu icon to the right of it.

I think we should also switch it to the mobile nav a bit earlier (like at 990px wide), because the phone number and contact us are getting cut off between 770 and 990.

https://drive.google.com/file/d/12AmfSWrTMHGjOJWnNcpAulpDkHmXvEtr/view?usp=sharing
https://drive.google.com/file/d/12Bwkh9txn6vCOjN1pwN5DnLxWttfnCwR/view?usp=sharing

Comment from Jason after submission:
The hamburger icon and the switch to mobile nav looks good.

But we have too much padding around the outside edges of both the logo and hamburger icon.

Let's tighten that up so there's about 15px from screen edge to both of those elements

https://drive.google.com/file/d/19C4vmdzpi3ElAuW520kkiq_uwJFWNog5/view?usp=sharing

2 specific spots I'm seeing:

1. Home page, the two "people" photos surrounding the gold testimonial quote area.

2. About Us page, in the "community involvement" section

3. Contact Us page, the 4-image quadrant

On the Stone page, there are only 3, but it's holding a spot for a 4th and showing a broken image

Let's have it center vertically within browser

https://drive.google.com/file/d/13Cs84EAN0pCSsWlO973LNiwo48bxRhfH/view?usp=sharing

The text links in the main nav bar are no longer centered vertically, within the blue bar.

They looked good previously

Severity: Minor
Location: http://sargonmc.wpengine.com/employment
OS / OS Version: All Platforms and Browsers
Device / Browser: All Platforms and Browsers

Expected Results:
When the user selects 'Contact Us' on the 'Employment' page, the user will be sent to the 'Contact Us' page.
 
Actual Results:
When the user selects 'Contact Us' on the 'Employment' page, the user is sent to the Employment page, the page they already on.
 
Steps To Reproduce:
1. Launch http://sargonmc.wpengine.com/ on any platform in scope
2. Proceed to the Employment page
3. Scroll down to the 'Contact Us' button
4. Select Contact Us
5. Observe the user is sent to the Employment page
 
Notes: N/A

Rate of Reproduction: 100%

The 4 images on the left side have been updated in WP, but are not showing up on the front end currently. This is happening for both the Steel and Stone pages:

https://drive.google.com/file/d/19B6uC0KGiKsOgDvaSLx0WSYWG19-xbPw/view?usp=sharing

1. Can we add auto-formatting to the phone number field

2. Can we use instant form validation (so that when user types an invalid email format or zip we let them know right away)

On the contact us page, just under the intro text, the phone number and email are both missing their respective icons.

• Add Company as a field in Partner with Us
• Break First/Last name into two fields

Severity: Minor
Location: http://sargonmc.wpengine.com/
OS / OS Version: All Platforms and Browsers
Device / Browser: All Platforms and Browsers
 
Expected Results:
When the user selects the Sargon link in the Footer, the user will be taken to http://sargonmc.wpengine.com
 
Actual Results:
When the user selects the Sargon link in the Footer, they are directed to https://tallwave.com.
 
Steps To Reproduce:
1. Launch http://sargonmc.wpengine.com/ on any platform in scope
2. On any page, scroll to the Footer
3. Select the Sargon link
4. Observe that the link directs to https://tallwave.com
 
Notes: N/A

Rate of Reproduction: 100%

Can we have the "View Projects" text stay stacked during hover?

https://drive.google.com/file/d/1F_RjRFM5pMTVrw5Y1EOd2wHcTNIsb1dI/view?usp=sharing

The text columns are too narrow, and it's unreadable and extending the hero image too far down the page. See mobile comp for expected layout.

If we need to reduce the size of the subhead copy in order to make that work, let's look at doing that.

https://drive.google.com/file/d/12cbVWhnO7Y-YnaPGV83dIKvH-nwxQZDz/view?usp=sharing

Jason's comment:
This is mostly fixed, except the subhead copy is going all the way to the edge when the screen size is 920 and below. Looks like we just need to add some padding to the right side.

Moving this ticket into the backlog

In WP I'm not able to change the states icon image.

We need to update that to this file:
https://drive.google.com/file/d/1Qv9VERz6X3ap4WWqp0XwGBqZ555Kx-B0/view?usp=sharing

Staging: https://drive.google.com/file/d/1FbrtBA3eCA3UWDLDuh5FIHyS6_nytYqu/view?usp=sharing

Comp: https://invis.io/NUUH2FG2CJ8

Phone number and email should be linked.

They are on other pages

The team has made a few different content/imagery changes within the CMS and not showing on the front end. Can we please ensure this is resolved across the full site.

On all pages the card images at the bottom of each page have been updated but are not pulling through to the CMS

The spacing looks off, both horizontally and vertically, and especially when Im looking at it at smaller/responsive sizes, the logos become off-center and start crashing into each other.

Can we space the logos out more horizontally, and keep everything centered vertically within the white divider area?

The logos also look low quality. Recommend using the 2x image files for better quality.

Example screengrabs:
https://drive.google.com/file/d/125qGJsFlFzpPWlG0F7frWyAFwZq9sZpP/view?usp=sharing
https://drive.google.com/file/d/125qGJsFlFzpPWlG0F7frWyAFwZq9sZpP/view?usp=sharing

@jthiel16 commented after submission:
FYI, we swapped out logo files for the 2x versions, so the quality issue is resolved. The spacing issue remains

What:
The site is not loading on IE 11
http://sargonmc.wpengine.com/

IE version: 11.805.17763.0
Windows version: 10 Pro

What I see on IE 11:

Expected Result that I see on Chrome:

Why:
Per the SOW we support IE 11

Timeline:
n/a

CC:
@NoelWormwood