Styling Lists

With some basic HTML and CSS in place for the article view, we're ready to dive deeper into the details.
Basic HTML and CSS for article-view - GitHub

Another Bitters component is responsible for styling all lists (which includes ul, ol, and dl). The default styles remove all margins and paddings and set the list-style-type to 'none'. Our design, however, intends for a special bullet point icon and some other specialities.

Instead of burying our style declarations in the general _layouts.scss, we'll adhere to Bitters' structure and put it in the right place, _lists.scss:

li:before {
  content:"›";
  color: $red;
}
li a {
  padding-left:7px;
  color:$base-font-color;
  font-size:$recommended-reading-font-size;
}

List styling - GitHub

Giveaways. Cheat Sheets. eBooks. Discounts.
And great content from our blog!

About Us

As the makers of Tower, the best Git client for Mac and Windows, we help over 100,000 users in companies like Apple, Google, Amazon, Twitter, and Ebay get the most out of Git.

Just like with Tower, our mission with this platform is to help people become better professionals.

That's why we provide our guides, videos, and cheat sheets (about version control with Git and lots of other topics) for free.

Your Download is in Progress…

Giveaways. Cheat Sheets. eBooks. Discounts. And great content from our blog!