Closed Bug 958502 Opened 6 years ago Closed 6 years ago

tripit.com mobile landing page doesn't display gradients correctly

Categories

(Web Compatibility :: Mobile, defect)

All
Android
defect
Not set

Tracking

(Not tracked)

RESOLVED FIXED

People

(Reporter: alefteris, Assigned: adamopenweb)

References

()

Details

(Whiteboard: [country-all][webkitcss][contactready])

:: Steps To Reproduce

1. Open Firefox for Android browser
2. Type tripit.com in the browser address bar

:: Expected Result

We get a mobile landing page with different buttons to choose our next destination. The top button that links to the Android app Google Play store page should have the text "Download FREE Android App" and it should have an orange gradient background.

:: Actual Result

The top button has no background color and it's text is not visible. The CSS for the page uses only the webkit prefix for the button background gradient:

background: -webkit-gradient(linear,left top,left bottom,from(#fc9f30),to(#ce7002));
https://www.tripit.com/css/uhp/index-noblackberry.css?v=r58173

.button.orange{
	color:#FFF;
	background:-webkit-gradient(linear,left top,left bottom,from(#fc9f30),to(#ce7002));
	border:1px solid #ce7002
}

We should reach out and ask that they add non-prefixed gradients, or at least a solid background-color before the webkit-gradient.
Whiteboard: [country-all][css][contactready]
Whiteboard: [country-all][css][contactready] → [country-all][webkitcss][contactready]
Assignee: nobody → astevenson
Status: NEW → ASSIGNED
Appears to be fixed, verified on Nightly that orange gradient for "Download FREE iPhone App" appears.
Status: ASSIGNED → RESOLVED
Closed: 6 years ago
Resolution: --- → FIXED
Product: Tech Evangelism → Web Compatibility
You need to log in before you can comment on or make changes to this bug.