diff --git a/progit/__init__.py b/progit/__init__.py
index 9cf226e..4958bfe 100644
--- a/progit/__init__.py
+++ b/progit/__init__.py
@@ -342,6 +342,12 @@ def avatar(packager, size=64):
     return output
 
 
+@APP.template_filter('short')
+def shorted_commit(cid):
+    """Gets short version of the commit id"""
+    return cid[:APP.config['SHORT_LENGTH']]
+
+
 @FAS.postlogin
 def set_user(return_url):
     ''' After login method. '''
diff --git a/progit/default_config.py b/progit/default_config.py
index 0acf266..ce2001d 100644
--- a/progit/default_config.py
+++ b/progit/default_config.py
@@ -118,3 +118,6 @@ APPLICATION_URL = None
 # under certain setup it might not work (for example is there are proxies
 # in front of the application).
 CHECK_SESSION_IP = True
+
+# Lenght for short commits ids or file hex
+SHORT_LENGTH = 6
diff --git a/progit/static/images/file.png b/progit/static/images/file.png
new file mode 100644
index 0000000..01b07e8
Binary files /dev/null and b/progit/static/images/file.png differ
diff --git a/progit/static/images/folder.png b/progit/static/images/folder.png
new file mode 100644
index 0000000..536da3d
Binary files /dev/null and b/progit/static/images/folder.png differ
diff --git a/progit/static/progit.css b/progit/static/progit.css
index 5848b00..ec9c60b 100644
--- a/progit/static/progit.css
+++ b/progit/static/progit.css
@@ -531,3 +531,43 @@ form.icon button {
 .list_groups form  {
     display: inline;
 }
+
+pre {
+    font-size: 1.3em;
+}
+
+.tree_list li.folder {
+    list-style-image: url(images/folder.png);
+}
+
+.tree_list li.file {
+    list-style-image: url(images/file.png);
+}
+
+.tree_list .view_commit,
+.tree_list .filehex
+{
+    float: right;
+}
+
+.tree_list li:nth-child(odd) {
+    background-color: #ededed;
+}
+
+.tree_list li:hover,
+.commit_list li:hover
+{
+    color: white;
+    background-color: #0066cc;
+}
+
+.tree_list li:hover a,
+.commit_list li:hover a
+{
+    color:white;
+}
+
+.commit_list li > a:first-child {
+    display: inline-block;
+    width: 5em;
+}
diff --git a/progit/templates/file.html b/progit/templates/file.html
index 4d1d1b4..09e6af0 100644
--- a/progit/templates/file.html
+++ b/progit/templates/file.html
@@ -24,32 +24,28 @@
   {% endfor %}
 </h2>
 
-<h3>Tree</h3>
 {% if content %}
-<section class="repos_list">
   {% if output_type=='file' %}
-  {% autoescape false %}
-  {{ content | format_loc}}
-  {% endautoescape %}
+    {% autoescape false %}
+      {{ content | format_loc}}
+    {% endautoescape %}
   {% else %}
+  <section class="tree_list">
+  <h3>Tree</h3>
   <ul>
     {% for entry in content %}
-    <li>
-      {% if entry.filemode == 16384 %}
-      [ ]
-      {% endif %}
+    <li class="{% if entry.filemode == 16384 %}folder{% else %}file{% endif %}">
       <a href="{{ url_for('view_file', username=username,
                 repo=repo.name, identifier=branchname,
                 filename=filename + '/' + entry.name if filename else entry.name) }}">
         {{ entry.name }}
-      </a>
-      {{ entry.hex }}
-      {{ entry.id }}
+        </a>
+        <span class="filehex">{{ entry.hex|short }}</span>
     </li>
     {% endfor %}
   </ul>
+  </section>
   {% endif %}
-</section>
 {% else %}
 No content found in this repository
 {% endif %}
diff --git a/progit/templates/repo_info.html b/progit/templates/repo_info.html
index ff54d2e..030cb3d 100644
--- a/progit/templates/repo_info.html
+++ b/progit/templates/repo_info.html
@@ -80,16 +80,12 @@
       <h3>Current tree</h3>
       <ul>
         {% for entry in tree %}
-        <li>
-          {% if entry.filemode == 16384 %}
-          [ ]
-          {% endif %}
+        <li class="{% if entry.filemode == 16384 %}folder{% else %}file{% endif %}">
             <a href="{{ url_for('view_file', username=username,
                       repo=repo.name, identifier=branchname, filename=entry.name) }}">
               {{ entry.name }}
             </a>
-          {{ entry.hex }}
-          {{ entry.id }}
+            <span class="filehex" >{{ entry.hex|short }}</span>
         </li>
         {% endfor %}
       </ul>
@@ -119,7 +115,7 @@
       <li>
         <a href="{{ url_for('view_commit', username=username,
                 repo=repo.name, commitid=commit.hex) }}">
-          {{ commit.hex[:6] }}
+          {{ commit.hex|short }}
         </a>
         {{ commit.message.split('\n')[0] }}
         {% if diff_commits and commit.oid.hex in diff_commits %}
diff --git a/progit/templates/repo_master.html b/progit/templates/repo_master.html
index fbe7c13..d04cb2e 100644
--- a/progit/templates/repo_master.html
+++ b/progit/templates/repo_master.html
@@ -5,12 +5,15 @@
 
 
 {% block content %}
-<h2>
-  <a href="{{ url_for('view_repo', username=username, repo=repo.name)}}">
-    {{ repo.fullname }}
-  </a>
-  {% if branchname %} ({{ branchname }}) {% endif %}
-</h2>
+<header>
+    <h2>
+        <a href="{{ url_for('view_repo', username=username, repo=repo.name)}}">
+            {{ repo.fullname }}
+        </a>
+        {% if branchname %} ({{ branchname }}) {% endif %}
+    </h2>
+    {{ repo.description | rst2html }}
+</header>
 
 {% if repo.is_fork %}
 <section id="parent">
@@ -88,9 +91,6 @@
       {% endif %}
     </ul>
   </div>
-
-  {{ repo.description | rst2html }}
-
 {% block repo %}
 {% endblock %}