Hairlines / Borders

Since 1.x release all hairlines (borders) reworked to :after and :before pseudo elements instead of usual CSS borders. This method allows to have true 0.5px (for iOS Retina) and 0.33px (for iPhone 6 Plus) hairlines

The rule is simple:

• "bottom" and "right" hairlines are made using :after pseudo elements
• "left" and "top" hairlines are made using :before pseudo elements

So, for example, if you want to change navbar's bottom hairline color, you need to change background-color of :after element:

.navbar:after {
  background-color: red;
}

To remove bottom hairline on navbar and top hairline on toolbar:

.navbar:after {
  display:none;
}
 
.toolbar:before {
  display:none;
}

"no-border" class

There is also helper "no-border" class that can be used to remove hairlines. Currently it is supported on Navbar, Toolbar, Card and its elements (card header, footer).

To remove hairline from navbar:

<div class="navbar no-border">
    ...
</div>