bundle feedback xwee, make it transparent

Oops, I shipped with the images.neopets.com TODO undone! Also, the white background was intersecting with the close X for the feedback form.

In this change, we move the xwee image into our bundle instead of depending on images.neopets.com, and we edit it to have a transparent background, which looks nicer for dark mode. (And we do a srcset!)
This commit is contained in:
Emi Matchu 2020-10-09 08:01:46 -07:00
parent 423ab5c98d
commit b713aeea96
3 changed files with 7 additions and 10 deletions

View file

@ -18,10 +18,12 @@ import { useLazyQuery } from "@apollo/client";
import { Heading1, usePageTitle } from "./util"; import { Heading1, usePageTitle } from "./util";
import OutfitPreview from "./components/OutfitPreview"; import OutfitPreview from "./components/OutfitPreview";
import SpeciesColorPicker from "./components/SpeciesColorPicker";
import HomepageSplashImg from "../images/homepage-splash.png"; import HomepageSplashImg from "../images/homepage-splash.png";
import HomepageSplashImg2x from "../images/homepage-splash@2x.png"; import HomepageSplashImg2x from "../images/homepage-splash@2x.png";
import SpeciesColorPicker from "./components/SpeciesColorPicker"; import FeedbackXweeImg from "../images/feedback-xwee.png";
import FeedbackXweeImg2x from "../images/feedback-xwee@2x.png";
function HomePage() { function HomePage() {
usePageTitle(null); usePageTitle(null);
@ -294,20 +296,15 @@ function FeedbackFormSection() {
cursor={!isOpen && "pointer"} cursor={!isOpen && "pointer"}
onClick={!isOpen ? openForm : null} onClick={!isOpen ? openForm : null}
> >
<Box <Box padding="2" borderRadius="lg" overflow="hidden" flex="0 0 auto">
padding="2"
background="white"
borderRadius="lg"
overflow="hidden"
flex="0 0 auto"
>
<Box <Box
as="img" as="img"
// TODO: Bundle this after we're done prototyping! src={FeedbackXweeImg}
src="http://images.neopets.com/new_shopkeepers/1524.gif" srcSet={`${FeedbackXweeImg} 1x, ${FeedbackXweeImg2x} 2x`}
height="90px" height="90px"
width="90px" width="90px"
opacity="0.9" opacity="0.9"
alt=""
/> />
</Box> </Box>
<Box <Box

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB