Second Contribution To Bitshares

So yesterday I got my second contribution added to the bitshares code base. You should be seeing it soon. So basically I took a style guide and updates the scss to reflect it.

The pages I redid was the Help pages. The old style looked like:

But the new design looks like:

I added some changes to the theme_template file. Including new styles for multiple HTML elements such as links and list items, and the table of contents.

Some trouble I had was the custom list item icons. At first I was trying the list item image property in css. But the image was too large and I couldn't resize it. So I used a background image. Weirdly enough it worked. I sized the image to 7 by 10 pixels. Then I added the padding left to the content, which moved over the text to make it look like a normal list item image.

Another thing was the table of contents ul. I wanted every ul to have that custom image, except the table of contents. So I couldn't just put it under the help-content class. So I added a class around the toc ul called help-toc. Then added custom styling.

The last thing was adding styles to a ul that's inside another ul. Basically moving the assets over, under the market pegged assets, was confusing at first. But luckily with scss this was fastly done. I just used nesting to target a ul inside a li inside a ul inside the help-toc class.

I am planning on continuing to contribute to bitshares-ui and I invite you too.

Thanks, and ttyl8r, Kenny.

---

Posted on Utopian.io - Rewarding Open Source Contributors

---