atom/plugins/project/project.html

<style>
  #project {
    min-width: 200px;
    height: 100%;
    background-color: #DDE3EA;
    color: #000;
    border-right: 1px solid #B4B4B4;
    cursor: default;
    -webkit-user-select: none;
    overflow: auto;
  }

  #project .cwd {
    padding-top: 5px;
    padding-left: 5px;
    font-weight: bold;
    color: #708193;
    text-transform: uppercase;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  }

  #project ul {
    margin: 0;
    padding-top: 2px;
    list-style-type: none;
  }

  #project li {
    padding: 0;
    padding-left: 20px;
    line-height: 20px;
  }

  #project li ul li {
    padding-left: 110px;
    margin-left: -100px;
  }

  #project li.file {
    font-weight: normal;
  }

  #project li.dir {
    font-weight: bold;
  }

  #project li.dir {
    background: url('plugins/project/images/dir-toggle.png') 9px 6px no-repeat;
  }

  #project li.dir.open {
    background-position: 9px -16px;
  }

  #project li ul li.dir {
    background-position: 100px 6px;
  }

  #project li ul li.dir.open {
    background-position: 100px -16px;
  }

  #project li.active {
    background-image: -webkit-gradient(linear,0% 0,0% 100%,from(#BCCBEB),to(#8094BB));
    border-top: 1px solid #A0AFCD;
    color: #fff;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
  }
</style>

<div id='project'>
  <div class='cwd'></div>
  <ul class='files'></ul>
</div>