hicetnunc icon indicating copy to clipboard operation
hicetnunc copied to clipboard

Add a popup component

Open sf-pixel opened this issue 4 years ago • 4 comments

Simple Popups


An example of the component (commented out of course) can be found in the about.js file. The only parameters are sad, happy, exclamation, and null. Each corresponds to the respective svg, when null or not sad, happy nor exclamation, the HEN svg is returned.

Feedback please :). (First PR)

sf-pixel avatar Jun 16 '21 21:06 sf-pixel

**Forgot to mention there's a title parameter, simply returns the title of the popup as a bolded text

sf-pixel avatar Jun 16 '21 21:06 sf-pixel

some screenshots for reference. I started reviewing this and think it looks pretty good code-wise with maybe some aesthetic feedback, will give it some more thought later or if anyone else has feedback that's great. image_657 image_658

couple of ideas: white border instead of box shadow, hacky backdrop with box-shadow: 0 0 0 99999px #1119;, and a bigger close button (tiny close buttons are no fun on mobile) image

kylegrover avatar Jun 17 '21 06:06 kylegrover

@Pixel10312 can you update to remove the demo? needs to be out before merge into live site. also let me know what you think on the CSS ideas.

kylegrover avatar Jun 18 '21 20:06 kylegrover

@Pixel10312 can you update to remove the demo? needs to be out before merge into live site. also let me know what you think on the CSS ideas.

Going to commit the CSS changes, really liked the 'focused' view. Increased the close__btn font size to x-large, should make a difference when on mobile. Will also remove the demo.

sf-pixel avatar Jun 19 '21 00:06 sf-pixel