[BUG] <In the Dropdown section, contents are not perfectly aligned in the mobile view>

[souvikjs01]

Describe the bug.

Dropdown icon does not showing, and 'All' is aligned in left side.

Expected behavior

Dropdown icon should be shown, and the inner content of the button should be in the middle.

Screenshots

How to Reproduce

1. I first did this
2. I then did this
3. And so on . . .

🥦 Browser

Google Chrome

👀 Have you checked for similar open issues?

• I checked and didn't find similar issue

🏢 Have you read the Contributing Guidelines?

• I have read the Contributing Guidelines

Are you willing to work on this issue ?

Yes I am willing to submit a PR!

[github-actions]

Welcome to AsyncAPI. Thanks a lot for reporting your first issue. Please check out our contributors guide and the instructions about a basic recommended setup useful for opening a pull request.
Keep in mind there are also other channels you can use to interact with AsyncAPI community. For more details check out this issue.

[ashmit-coder]

Hey @Mayaleeeee could provide some insight on weather it's a bug or design decision?

[souvikjs01]

Actually, there is code conflicting in Dropdown component, which has written justify-center and at the same time justify-between, so do you want these elements to be in the center or both end according to your design?

[Mayaleeeee]

Hey @Mayaleeeee could provide some insight on weather it's a bug or design decision?

Thanks for the ping @ashmit-coder

I'm still trying to understand what the issue is l @souvikjs01 because it's working perfectly here from my side.

Please listen to the recording below.

XRecorder_Compressed_12072024_144645.mp4

Also, @ashmit-coder, we should change the colour of the drop-down icon, I can barely see it.

[souvikjs01]

Hey @Mayaleeeee
I did not notice the dropdown icon, the bg color are same, so i thought it should be in the center like the picture.
Also "justify-center" that create confusion this to be in center.

[anuragnegi000]

is this issue is already completed? if not please assign it to me

[AceTheCreator]

@Mayaleeeee @souvikjs01 @ashmit-coder, what's the status of this discussion?

[ashmit-coder]

Hey @Mayaleeeee could provide some insight on weather it's a bug or design decision?

Thanks for the ping @ashmit-coder

I'm still trying to understand what the issue is l @souvikjs01 because it's working perfectly here from my side.

Please listen to the recording below.

XRecorder_Compressed_12072024_144645.mp4
Also, @ashmit-coder, we should change the colour of the drop-down icon, I can barely see it.

Hey @Mayaleeeee sorry for the late reply.

The colour feature is a good, point and I think this issue should resolve that.

About the back feature that you suggested, I dont think thats how we should approach it, we can discuss that in another issue in my opinion.

[ashmit-coder]

Hey @Mayaleeeee I did not notice the dropdown icon, the bg color are same, so i thought it should be in the center like the picture. Also "justify-center" that create confusion this to be in center.

Hey @Mayaleeeee do you think we should do this?

[Mayaleeeee]

Hey @Mayaleeeee I did not notice the dropdown icon, the bg color are same, so i thought it should be in the center like the picture. Also "justify-center" that create confusion this to be in center.

Hey @Mayaleeeee do you think we should do this?

Hello @ashmit-coder , the screenshot below was the response I got when I tried viewing the image you attached to this message.

[ashmit-coder]

Hey @Mayaleeeee I did not notice the dropdown icon, the bg color are same, so i thought it should be in the center like the picture. Also "justify-center" that create confusion this to be in center.

Hey @Mayaleeeee do you think we should do this?

Hello @ashmit-coder , the screenshot below was the response I got when I tried viewing the image you attached to this message.

Is this visible?
[

[Mayaleeeee]

Hey @Mayaleeeee I did not notice the dropdown icon, the bg color are same, so i thought it should be in the center like the picture. Also "justify-center" that create confusion this to be in center.

Hey @Mayaleeeee do you think we should do this?

Hello @ashmit-coder , the screenshot below was the response I got when I tried viewing the image you attached to this message.

Is this visible? [

Do you mean the icon? @ashmit-coder

[ashmit-coder]

Hey @Mayaleeeee I did not notice the dropdown icon, the bg color are same, so i thought it should be in the center like the picture. Also "justify-center" that create confusion this to be in center.

Hey @Mayaleeeee do you think we should do this?

Hello @ashmit-coder , the screenshot below was the response I got when I tried viewing the image you attached to this message.

Is this visible? [

Do you mean the icon? @ashmit-coder

No the text in the buttons. Shall we make it center aligned rather than the existing left aligned

[Mayaleeeee]

Hey @Mayaleeeee I did not notice the dropdown icon, the bg color are same, so i thought it should be in the center like the picture. Also "justify-center" that create confusion this to be in center.

Hey @Mayaleeeee do you think we should do this?

Hello @ashmit-coder , the screenshot below was the response I got when I tried viewing the image you attached to this message.

Is this visible? [

Do you mean the icon? @ashmit-coder

No the text in the buttons. Shall we make it center aligned rather than the existing left aligned

Yes, please.

The centre looks good. @ashmit-coder

[souvikjs01]

@ashmit-coder @Mayaleeeee
Can I work on it?? If so, please assign it to me.

[ashmit-coder]

@ashmit-coder @Mayaleeeee
Can I work on it?? If so, please assign it to me.

You can start working no need to be assigned!