Emoji One Area Picker

kyra · January 9, 2025, 10:55pm

Hello! I am using the Emoji One Area Picker. It’s working great, but I need it to maintain the styling of the input it references. How can I do that?

Stephan · January 10, 2025, 2:10pm

Hello @kyra ,

Thank you for reaching out!

Regarding your question, indeed we have recently acquired the Emoji One Area Picker plugin. The plugin was indeed designed to change the default input styling, and we’ll definitely consider ways to improve how it interacts in the future.

For your use case, if you’d like to customize or remove some styling applied to the input, you can add a Bubble HTML element to your page.
Then, using your browser’s inspector, identify the specific styles you wish to remove or change:

Simply add those styles to the Bubble HTML element (see second image). This workaround should help you achieve the desired look for your input.

I hope this will prove helpful to you. Please let me know if anything is unclear or if you have any other questions.

Best regards,
Support Team
Browse all Zeroqode Plugins for Bubble

kyra · January 10, 2025, 6:56pm

Awesome thanks! Everything seems to be working except the border. Do you notice anything wrong?

Stephan · January 13, 2025, 10:36am

Hello @kyra ,

Thank you for your message, and apologies for the late reply over the weekend.

Regarding your concern, styling such as border radius or padding should indeed be applied to the parent div. To target it, you can use the following CSS div:has(> .emojionearea-editor) { the styling here }

<style>
div:has(> .emojionearea-editor) {
    min-height: 50px !important;
    max-height: 50px !important;
    height: 50px !important;
    padding: 6px 24px 6px 6px !important;
    border-radius: 100px !important;
}

.emojionearea-editor {
    min-height: 50px !important;
    max-height: 50px !important;
    height: 50px !important;
    padding: 6px 24px 6px 6px !important;
    border: 10px #f2f4f7 !important;
    border-radius: 100px !important;
}

</style>

Could you please try this on your end and let me know how it works for you? Feel free to reach out if you have any other questions.

Thank you, and I look forward to your reply.

Best regards,
Support Team
Browse all Zeroqode Plugins for Bubble

kyra · January 13, 2025, 5:42pm

Yes that did the trick thanks!

Stephan · January 14, 2025, 11:18am

Hello @kyra,

Thanks for updating us.

It’s great to hear that your inquiry was resolved and everything is now working fine. I’ve also forwarded these observations to our dev team so they can investigate further and possibly ensure the styles apply only to what you set from the input element, to avoid confusion in the next update. I’ll keep you informed of any updates as they become available.

If you have any other questions or inquiries, please feel free to reach out to us anytime.

Have a great day ahead!

Best regards,
Support Team
Browse all Zeroqode Plugins for Bubble