Change of style dropdown
# 👀feature-requests
b
Hi guys, I would like to see the drop-down list improved. In website, when you have more than 5 or more than certain characters, it goes to a dropdown instead of showing all the options. Also, the menu shown is really not professional and have been told by a couple of clients. That they don't like the dropdown and would like to have it changed. Here I show an example. Thanks! https://cdn.discordapp.com/attachments/1229426911948832808/1229426912221204541/image.png?ex=662fa409&is=661d2f09&hm=491af3fa9754e24de7430bb49c452ad2a0ae8ff4531f06c00a386f81658b8c9c&
g
I agree, most people including me dont find that part of the bot attractive at all :x
b
I know. Quite annoying as I am thinking about changing to voiceflow just for that 😦
l
You can just add CSS to make it look how you want 🤷
b
Hi Ryan. I have tried, but I haven't seen anywhere to do that. Could you please tell me where I can do it? I would appreciate it!
g
Like this but these changes are only for the color of the dropdown
#react-select-2-listbox div div { background-color:black!important; color:white!important; } #react-select-2-listbox div div:hover{ background-color: blue!important; color:black!important; }
b
But where can you modify It? O I can't find it anywhere
g
In the stylesheet you add that code save it and add it to your new bot and test to see if it works with the shareable URL
b
Sorry for the dumb question mate, but I am a bit new to botpress. Where is the stylesheet?
g
https://styler.botpress.app you need to go on the advanced section of the code
d
Hi, is it also possible to set the width of the dropdown list? The color change is working. Thank you 😀
g
Probably
With the css property width and adding the !important after the number of pixels that you set for the width like width: 50px!important
d
Yes thank you. I had a cache problem and now it works. 😀
2 Views