I figured this UI issue while adding my first Contribution at Utopian.io. I believe that the drop-down box of Reward selection does not come aligned with the control and comes at the top stuck to the main header of the Utopian.io website where the user is not expecting it. So, it seems there is a UI alignment bug here.
What Happened As User Experience
-- 1. When you search for Github project in autosuggest textbox the suggestions box is aligned with the textbox and comes below so that user can choose among one of the options he/she is searching. This is what user expects.
-- 2. However, when you select the project, fill your contribution title, provide all the details and add all the required tags then you as a user has an option to choose your Reward option. When you click on it, you will see instead of options coming below the control as user expects in any dropdown or autosuggestion box, the options comes hanging at the top with main black header of the site. Does not give a good UI experience to the user.
Expected Output
The options to choose Reward as "100% Steem Power" or "50% SBD and 50% SP" should come below the Reward textbox, not aligned to the black header at the top.
Secondly, I believe that the language should be consistent in the options. One options says "Steem Power" but the other options says "SP". So, either use SP at both places as most user understand it or use Steem Power as the dropdown is wide enough already to have all this text.
Steps to Reproduce the Bug
-- 1. Open Google Chrome on any Macbook using macOS.
-- 2. Login to your Utopian.io account
-- 3. Click on (+ Contribution) button, that is , Add Contribution
-- 4. Select Bug Hunting option, read the instructions and click on "I Understand and Proceed" Button at the bottom of the page.
-- 5. You will see an form to post the bug details. Fill in Github project, Contribution title, details of the bug in markdown editor and enter all the required tags.
-- 6. Now click on the textbox of Reward to select/change or view other available options that default selected in it.
-- 7. Notice the options are not coming below the textbox while at the top hanging below the black main header of the website.
To further help, I created a screen recording as well which can be found at the link: Screen Recording Link
Environment Details
Browser: Google Chrome Version 63.0.3239.84 (Official Build) (64-bit) , Normal Mode (No Incongnito Mode)
Operating System: macOS High Sierra 10.13
Posted on Utopian.io - Rewarding Open Source Contributors
Your contribution cannot be approved because it is a duplicate. It is very similar to a contribution that was already accepted here.
You should look first if the issue has been reported already.
You can contact us on Discord.
[utopian-moderator]
Hmm, I see. Thank you.
It is hard for a newcommer to find already reported bugs. Can you please guide how can we find already reported bugs easily if we spot one. Also, should I delete it now? Not sure.
There is no need to delete the post. It is on the blockchain and it is visible in other apps as Steemit or Busy too. Utopian has a search bar where you could type the query and try to search. It needs to be much improved, though. You could also try to use Google or another search engine and you should also see the GitHub repository of the project if the issue was not submitted there.
Alright, thank you. Will take care in future but with tons of issue, will be pretty hard but will do my best.
Congratulations @devilonwheels! You have completed some achievement on Steemit and have been rewarded with new badge(s) :
Click on any badge to view your own Board of Honor on SteemitBoard.
For more information about SteemitBoard, click here
If you no longer want to receive notifications, reply to this comment with the word
STOP