Steemnova - Resource Images/Names clickable for more Information

flugschwein(61)

Published in

#utopian-io

Words

312

Reading

2 min

Listen

Play

New Features

What feature(s) did you add?

I added the possibility to click on the Images and/or names of the resources on the top of the page in order to get a popup showing more information about the clicked resource. This also works in the "Resources" page, where, prior to my pull request, neither the names of the resources nor the names of the buildings and ships(solar satellite) had this feature.

Recording:

How did you implement it/them?

The first step was that I changed the design of the top of the page, where the resources you have are listed.

I just added an a tag with an onclick showing the Infomation popup.

Then I added a description for every resource and rescaled the resource images, in order to have them display correctly.

And while I was on it I also fixed a small typo.

After this there would be an error showing, which was why I had to make a special if clause which only does the following for everything else but resources.
bonus exception.png
This was the error throwing part, so I went around it.

And because everything worked I also implemented this to the "Resources" page.

resource page.png

Pretty similar to what I did on the first screenshot.

I also translated the new strings I added to German, since it is my mother tongue. But I got some help from @k3lda for it. Thank you!
Then all of the above got merged and some people complained that the resource names on the top would be displayed white and not red I made another pull request turning the color back.

color red.png

I have a third pull request not yet merged which will make the size of the window popping up more appropriate.
base.js.png
This is the change in said pull request.