missive / emoji-mart

🏪 One component to pick them all
https://missiveapp.com/open/emoji-mart
MIT License
8.67k stars 835 forks source link

Can't load css #25

Closed paejal closed 7 years ago

paejal commented 7 years ago

I was try this package, but when i add <Picker set='emojione' /> the css seems not loaded screenshot from 2016-11-22 14-12-44

what should i do so I can use this package ? thanks

EtienneLem commented 7 years ago

You will need to include the css file (https://github.com/missive/emoji-mart/blob/master/css/emoji-mart.css) in your html page. You can serve it locally or directly from a CDN (i.e. https://unpkg.com/emoji-mart@0.3.3/css/emoji-mart.css)

MarcusJay commented 5 years ago

For anyone having css issues with React + Nextjs, assuming you installed it without specifying a version number, e.g. 'npm install emoji-mart', I found the following:

import 'emoji-mart/css/emoji-mart.css' in your react component does not work. • import 'some/other/path/to/css.css' in your react component does not work. • including the css in your <NextHead> e.g. <link rel="stylesheet" href='/some/local/path/in/your/project'> does not work. • including the css in your <NextHead> e.g. <link rel="stylesheet" href="https://unpkg.com/emoji-mart@0.3.3/css/emoji-mart.css"> partially works, but the layout is still broken.

The only thing that worked was: –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– • including in your <NextHead>: <link rel="stylesheet" href="https://unpkg.com/emoji-mart@2.11.1/css/emoji-mart.css" /> ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––

Hope that saves you some time.

No css with React + NextJS: https://imgur.com/zNQkb4H