Colors & Icons Power Management Tool    |    View Github

Colors

The primary colors codes utilized by the Power Management Tool.


Core Blue
#009FDB


Blue
#0574AC


Orange
#EA7400


Light Background
#F2F2F2


Green
#4CA947


Yellow
#FCB71C


Red
#CF292A


Dark Gray
#666666


Gray
#959595


Light Gray
#DDDDDD


Icons

The icons are using FontAwesome.io, an open-source scalable vector icon CSS toolkit.
Right-click and inspect the icons to grab the stylings from the browser's developer tools.

Status Icons


Valid 

<div class="pmt-status-icon pmt-valid">
    <i class="fa fa-check" aria-hidden="true"></i>
</div>

Caution - at full capacity 

<div class="pmt-status-icon pmt-caution">
    <i class="fa fa-warning" aria-hidden="true"></i>
</div>

Invalid - requires adjustment 

<div class="pmt-status-icon pmt-invalid">
    <i class="fa fa-exclamation" aria-hidden="true"></i>
</div>

Over-engineered 

<div class="pmt-status-icon pmt-over-engineered">
    <i class="fa fa-times" aria-hidden="true"></i>
</div>

Sidebar Icons


Complete 

<div class="pmt-sidebar-icon pmt-text-green">
    <i class="fa fa-check" aria-hidden="true"></i>
</div>

Incomplete 

<div class="pmt-sidebar-icon pmt-text-red">
    <i class="fa fa-warning" aria-hidden="true"></i>
</div>

Disabled 

<div class="pmt-sidebar-icon pmt-text-gray">
    <i class="fa fa-ban" aria-hidden="true"></i>
</div>

Action Icons


Edit 

<a class="pmt-action-icon">
    <i class="fa fa-pencil" aria-hidden="true"></i>
</a>

Remove 

<a class="pmt-action-icon pmt-text-red">
    <i class="fa fa-times" aria-hidden="true"></i>
</a>