new repo ui

- copy link button: #1396, #1168, #1668,
- synxtax highlight: #1712, #1549, #1315, #670
- z-index: #1942

README.md

@@ -5,7 +5,7 @@ Gogs - Go Git Service [![Build Status](https://travis-ci.org/gogits/gogs.svg?bra
 
 ![](public/img/gogs-large-resize.png)
 
-##### Current version: 0.7.8 Beta
+##### Current version: 0.7.9 Beta
 
 <table>
     <tr>

conf/locale/locale_en-US.ini

@@ -387,7 +387,7 @@ repo_is_empty = This repository is empty, please come back later!
 
 branch = Branch
 tree = Tree
-branch_and_tags = Branches & Tags
+filter_branch_and_tag = Filter branch or tag
 branches = Branches
 tags = Tags
 issues = Issues

gogs.go

@@ -17,7 +17,7 @@ import (
 	"github.com/gogits/gogs/modules/setting"
 )
 
-const APP_VER = "0.7.8.1113 Beta"
+const APP_VER = "0.7.9.1114 Beta"
 
 func init() {
 	runtime.GOMAXPROCS(runtime.NumCPU())

public/config.codekit

@@ -56,6 +56,15 @@
 		"outputPathIsOutsideProject": 0,
 		"outputPathIsSetByUser": 0
 		},
+	"\/css\/highlight-8.7\/github.css": {
+		"fileType": 16,
+		"ignore": 0,
+		"ignoreWasSetByUser": 0,
+		"inputAbbreviatedPath": "\/css\/highlight-8.7\/github.css",
+		"outputAbbreviatedPath": "No Output Path",
+		"outputPathIsOutsideProject": 0,
+		"outputPathIsSetByUser": 0
+		},
 	"\/css\/jquery.datetimepicker-2.4.5.css": {
 		"fileType": 16,
 		"ignore": 0,
@@ -191,7 +200,7 @@
 		"outputPathIsOutsideProject": 0,
 		"outputPathIsSetByUser": 0,
 		"outputStyle": 1,
-		"syntaxCheckerStyle": 1
+		"syntaxCheckerStyle": 0
 		},
 	"\/js\/jquery-1.11.3.min.js": {
 		"fileType": 64,

public/css/gogs.css

@@ -1,6 +1,6 @@
 @font-face {
   font-family: 'octicons';
-  src: url('../fonts/octicons.eot?#iefix&v=396334ee3da78f4302d25c758ae3e3ce5dc3c97d') format('embedded-opentype'), url('../fonts/octicons.woff?v=396334ee3da78f4302d25c758ae3e3ce5dc3c97d') format('woff'), url('../fonts/octicons.ttf?v=396334ee3da78f4302d25c758ae3e3ce5dc3c97d') format('truetype'), url('../fonts/octicons.svg?v=396334ee3da78f4302d25c758ae3e3ce5dc3c97d#octicons') format('svg');
+  src: url('../fonts/octicons.eot?#iefix&v=30e752e9a0821a0a098947055eeece0b0f46bc34') format('embedded-opentype'), url('../fonts/octicons.woff?v=30e752e9a0821a0a098947055eeece0b0f46bc34') format('woff'), url('../fonts/octicons.ttf?v=30e752e9a0821a0a098947055eeece0b0f46bc34') format('truetype'), url('../fonts/octicons.svg?v=30e752e9a0821a0a098947055eeece0b0f46bc34#octicons') format('svg');
   font-weight: normal;
   font-style: normal;
 }
@@ -65,6 +65,10 @@
   content: '\f0de';
 }
 /*  */
+.octicon-bold:before {
+  content: '\f0e2';
+}
+/*  */
 .octicon-book:before {
   content: '\f007';
 }
@@ -364,6 +368,10 @@
   content: '\f027';
 }
 /*  */
+.octicon-italic:before {
+  content: '\f0e4';
+}
+/*  */
 .octicon-jersey:before {
   content: '\f019';
 }
@@ -411,6 +419,10 @@
   content: '\f06a';
 }
 /*  */
+.octicon-logo-gist:before {
+  content: '\f0ad';
+}
+/*  */
 .octicon-logo-github:before {
   content: '\f092';
 }
@@ -568,14 +580,6 @@
   content: '\f047';
 }
 /*  */
-.octicon-screen-full:before {
-  content: '\f066';
-}
-/*  */
-.octicon-screen-normal:before {
-  content: '\f067';
-}
-/*  */
 .octicon-search-save:before,
 .octicon-search:before {
   content: '\f02e';
@@ -628,6 +632,10 @@
   content: '\f015';
 }
 /*  */
+.octicon-tasklist:before {
+  content: '\f0e5';
+}
+/*  */
 .octicon-telescope:before {
   content: '\f088';
 }
@@ -636,6 +644,10 @@
   content: '\f0c8';
 }
 /*  */
+.octicon-text-size:before {
+  content: '\f0e3';
+}
+/*  */
 .octicon-three-bars:before {
   content: '\f05e';
 }
@@ -809,6 +821,12 @@ pre.raw {
 .ui .text.blue a:hover {
   color: #428bca !important;
 }
+.ui .text.black {
+  color: #444;
+}
+.ui .text.black:hover {
+  color: #000;
+}
 .ui .text.grey {
   color: #767676 !important;
 }
@@ -839,6 +857,9 @@ pre.raw {
 .ui .text.small {
   font-size: 0.75em;
 }
+.ui .text.normal {
+  font-weight: normal;
+}
 .ui .text.bold {
   font-weight: bold;
 }
@@ -1049,8 +1070,9 @@ footer .container .links > *:first-child {
   overflow: hidden;
   font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif;
   font-size: 16px;
-  line-height: 1.6;
+  line-height: 1.6 !important;
   word-wrap: break-word;
+  padding: 5px 2em 2em !important;
 }
 .markdown > *:first-child {
   margin-top: 0 !important;
@@ -1185,6 +1207,9 @@ footer .container .links > *:first-child {
   margin-top: 0;
   margin-bottom: 16px;
 }
+.markdown blockquote {
+  margin-left: 0;
+}
 .markdown hr {
   height: 4px;
   padding: 0;
@@ -1449,115 +1474,6 @@ footer .container .links > *:first-child {
   background: #f8f8f8;
   border-top: 0;
 }
-/* Author: jmblog */
-/* Project: https://github.com/jmblog/color-themes-for-google-code-prettify */
-/* GitHub Theme */
-/* Pretty printing styles. Used with prettify.js. */
-/* SPAN elements with the classes below are added by prettyprint. */
-/* plain text */
-.pln {
-  color: #333333;
-}
-@media screen {
-  /* string content */
-  .str {
-    color: #dd1144;
-  }
-  /* a keyword */
-  .kwd {
-    color: #333333;
-  }
-  /* a comment */
-  .com {
-    color: #999988;
-    font-style: italic;
-  }
-  /* a type name */
-  .typ {
-    color: #445588;
-  }
-  /* a literal value */
-  .lit {
-    color: #445588;
-  }
-  /* punctuation */
-  .pun {
-    color: #333333;
-  }
-  /* lisp open bracket */
-  .opn {
-    color: #333333;
-  }
-  /* lisp close bracket */
-  .clo {
-    color: #333333;
-  }
-  /* a markup tag name */
-  .tag {
-    color: navy;
-  }
-  /* a markup attribute name */
-  .atn {
-    color: teal;
-  }
-  /* a markup attribute value */
-  .atv {
-    color: #dd1144;
-  }
-  /* a declaration */
-  .dec {
-    color: #333333;
-  }
-  /* a variable name */
-  .var {
-    color: teal;
-  }
-  /* a function name */
-  .fun {
-    color: #990000;
-  }
-}
-/* Use higher contrast and text-weight for printable form. */
-@media print, projection {
-  .str {
-    color: #006600;
-  }
-  .kwd {
-    color: #006;
-    font-weight: bold;
-  }
-  .com {
-    color: #600;
-    font-style: italic;
-  }
-  .typ {
-    color: #404;
-    font-weight: bold;
-  }
-  .lit {
-    color: #004444;
-  }
-  .pun,
-  .opn,
-  .clo {
-    color: #444400;
-  }
-  .tag {
-    color: #006;
-    font-weight: bold;
-  }
-  .atn {
-    color: #440044;
-  }
-  .atv {
-    color: #006600;
-  }
-}
-/* Specify class=linenums on a pre to get line numbering */
-ol.linenums {
-  margin-top: 0;
-  margin-bottom: 0;
-}
 .home {
   padding-bottom: 80px;
 }
@@ -1877,6 +1793,158 @@ ol.linenums {
   margin: 1px;
   padding-right: 0;
 }
+.repository.file.list #repo-desc {
+  font-size: 1.2em;
+}
+.repository.file.list .choose.reference .header .icon {
+  font-size: 1.4em;
+}
+.repository.file.list .head.meta {
+  padding: 0;
+}
+.repository.file.list .head.meta li {
+  list-style: none;
+  display: inline-block;
+}
+.repository.file.list .head.meta li .ui.breadcrumb {
+  margin-top: -5px;
+}
+.repository.file.list .head.meta li .ui.breadcrumb span,
+.repository.file.list .head.meta li .ui.breadcrumb a {
+  font-size: 16px;
+}
+.repository.file.list .clone.input {
+  margin-top: -8px;
+  width: 100%;
+}
+.repository.file.list .clone.input input {
+  border-radius: 0;
+  padding: 5px 10px;
+}
+.repository.file.list .clone.input .clone.button {
+  font-size: 13px;
+  padding: 0 5px;
+}
+.repository.file.list .clone.input .clone.button:first-child {
+  border-radius: .28571429rem 0 0 .28571429rem;
+}
+.repository.file.list .clone.input .icon.button {
+  padding: 0 10px;
+}
+.repository.file.list .clone.input .dropdown .menu {
+  right: 0!important;
+  left: auto!important;
+}
+.repository.file.list #repo-files-table .table.list {
+  width: 80% !important;
+}
+.repository.file.list #repo-files-table thead th {
+  padding-top: 8px;
+  padding-bottom: 5px;
+  font-weight: normal;
+}
+.repository.file.list #repo-files-table thead th #last-commit-message {
+  margin-left: 5px;
+  margin-bottom: -4px;
+  width: 400px;
+}
+.repository.file.list #repo-files-table thead th .age {
+  margin-top: 2px;
+}
+.repository.file.list #repo-files-table thead .ui.avatar {
+  margin-bottom: 5px;
+}
+.repository.file.list #repo-files-table tbody .icon {
+  margin-left: 5px;
+}
+.repository.file.list #repo-files-table tbody .name {
+  max-width: 120px;
+}
+.repository.file.list #repo-files-table tbody .message {
+  max-width: 300px;
+}
+.repository.file.list #repo-files-table tbody .age {
+  min-width: 150px;
+}
+.repository.file.list #repo-files-table tbody .text.truncate {
+  margin-bottom: -5px;
+  max-width: 100%;
+}
+.repository.file.list #repo-files-table td {
+  padding-top: 8px;
+  padding-bottom: 8px;
+}
+.repository.file.list #repo-files-table tr:hover {
+  background-color: #ffffEE;
+}
+.repository.file.list #file-content .header .icon {
+  font-size: 1em;
+  margin-top: -2px;
+}
+.repository.file.list #file-content .view-raw * {
+  width: 100%;
+}
+.repository.file.list #file-content .view-raw img {
+  padding: 5px 5px 0 5px;
+}
+.repository.file.list #file-content .code-view * {
+  font-size: 13px;
+  font-family: monospace;
+  line-height: 20px;
+}
+.repository.file.list #file-content .code-view table {
+  width: 100%;
+}
+.repository.file.list #file-content .code-view .lines-num {
+  vertical-align: top;
+  text-align: right;
+  color: #999;
+  background: #f5f5f5;
+  width: 1%;
+}
+.repository.file.list #file-content .code-view .lines-num span {
+  font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
+  line-height: 20px;
+  padding: 0 10px;
+  cursor: pointer;
+  display: block;
+}
+.repository.file.list #file-content .code-view .lines-num,
+.repository.file.list #file-content .code-view .lines-code {
+  padding: 0;
+}
+.repository.file.list #file-content .code-view .lines-num pre,
+.repository.file.list #file-content .code-view .lines-code pre,
+.repository.file.list #file-content .code-view .lines-num ol,
+.repository.file.list #file-content .code-view .lines-code ol,
+.repository.file.list #file-content .code-view .lines-num .hljs,
+.repository.file.list #file-content .code-view .lines-code .hljs {
+  background-color: white;
+  margin: 0;
+  padding: 0 !important;
+}
+.repository.file.list #file-content .code-view .lines-num pre li,
+.repository.file.list #file-content .code-view .lines-code pre li,
+.repository.file.list #file-content .code-view .lines-num ol li,
+.repository.file.list #file-content .code-view .lines-code ol li,
+.repository.file.list #file-content .code-view .lines-num .hljs li,
+.repository.file.list #file-content .code-view .lines-code .hljs li {
+  padding-left: 5px;
+}
+.repository.file.list #file-content .code-view .lines-num pre li.active,
+.repository.file.list #file-content .code-view .lines-code pre li.active,
+.repository.file.list #file-content .code-view .lines-num ol li.active,
+.repository.file.list #file-content .code-view .lines-code ol li.active,
+.repository.file.list #file-content .code-view .lines-num .hljs li.active,
+.repository.file.list #file-content .code-view .lines-code .hljs li.active {
+  background: #ffffdd;
+}
+.repository.file.list .sidebar {
+  padding-left: 0;
+}
+.repository.file.list .sidebar .octicon {
+  width: 16px;
+}
 .repository.options #interval {
   width: 100px!important;
   min-width: 100px;

public/css/highlight-8.7/github.css

@@ -0,0 +1,98 @@
+/*
+
+github.com style (c) Vasily Polovnyov <vast@whiteants.net>
+
+*/
+
+.hljs {
+  display: block;
+  overflow-x: auto;
+  padding: 0.5em;
+  color: #333;
+  background: #f8f8f8;
+}
+
+.hljs-comment,
+.hljs-quote {
+  color: #998;
+  font-style: italic;
+}
+
+.hljs-keyword,
+.hljs-selector-tag,
+.hljs-subst {
+  color: #333;
+  font-weight: bold;
+}
+
+.hljs-number,
+.hljs-literal,
+.hljs-variable,
+.hljs-template-variable,
+.hljs-tag .hljs-attr {
+  color: #008080;
+}
+
+.hljs-string,
+.hljs-doctag {
+  color: #d14;
+}
+
+.hljs-title,
+.hljs-section,
+.hljs-selector-id {
+  color: #900;
+  font-weight: bold;
+}
+
+.hljs-subst {
+  font-weight: normal;
+}
+
+.hljs-type,
+.hljs-class .hljs-title {
+  color: #458;
+  font-weight: bold;
+}
+
+.hljs-tag,
+.hljs-name,
+.hljs-attribute {
+  color: #000080;
+  font-weight: normal;
+}
+
+.hljs-regexp,
+.hljs-link {
+  color: #009926;
+}
+
+.hljs-symbol,
+.hljs-bullet {
+  color: #990073;
+}
+
+.hljs-built_in {
+  color: #0086b3;
+}
+
+.hljs-meta {
+  color: #999;
+  font-weight: bold;
+}
+
+.hljs-deletion {
+  background: #fdd;
+}
+
+.hljs-addition {
+  background: #dfd;
+}
+
+.hljs-emphasis {
+  font-style: italic;
+}
+
+.hljs-strong {
+  font-weight: bold;
+}

public/js/gogs.js

@@ -206,6 +206,31 @@ function initRepository() {
         return;
     }
 
+    function initFilterSearchDropdown(selector) {
+        var $dropdown = $(selector);
+        $dropdown.dropdown({
+            fullTextSearch: true,
+            onChange: function (text, value, $choice) {
+                window.location.href = $choice.data('url');
+                console.log($choice.data('url'))
+            },
+            message: {noResults: $dropdown.data('no-results')}
+        });
+    }
+
+    // File list
+    if ($('.repository.file.list').length > 0) {
+        initFilterSearchDropdown('.choose.reference .dropdown');
+
+        $('.reference.column').click(function () {
+            $('.choose.reference .scrolling.menu').css('display', 'none');
+            $('.choose.reference .text').removeClass('black');
+            $($(this).data('target')).css('display', 'block');
+            $(this).find('.text').addClass('black');
+            return false;
+        });
+    }
+
     // Options
     if ($('.repository.settings.options').length > 0) {
         $('#repo_name').keyup(function () {
@@ -289,23 +314,23 @@ function initRepository() {
         $('#edit-title').click(editTitleToggle);
         $('#cancel-edit-title').click(editTitleToggle);
         $('#save-edit-title').click(editTitleToggle).
-            click(function () {
-                if ($edit_input.val().length == 0 ||
-                    $edit_input.val() == $issue_title.text()) {
-                    $edit_input.val($issue_title.text());
-                    return false;
-                }
-
-                $.post($(this).data('update-url'), {
-                        "_csrf": csrf,
-                        "title": $edit_input.val()
-                    },
-                    function (data) {
-                        $edit_input.val(data.title);
-                        $issue_title.text(data.title);
-                    });
+        click(function () {
+            if ($edit_input.val().length == 0 ||
+                $edit_input.val() == $issue_title.text()) {
+                $edit_input.val($issue_title.text());
                 return false;
-            });
+            }
+
+            $.post($(this).data('update-url'), {
+                    "_csrf": csrf,
+                    "title": $edit_input.val()
+                },
+                function (data) {
+                    $edit_input.val(data.title);
+                    $issue_title.text(data.title);
+                });
+            return false;
+        });
 
         // Edit issue or comment content
         $('.edit-content').click(function () {
@@ -397,33 +422,26 @@ function initRepository() {
         }
     }
 
-    // Quick start
-    if ($('.repository.quickstart').length > 0) {
-        $('#repo-clone-ssh').click(function () {
-            $('.clone-url').text($(this).data('link'));
-            $('#repo-clone-url').val($(this).data('link'));
-            $(this).addClass('blue');
-            $('#repo-clone-https').removeClass('blue');
-        });
-        $('#repo-clone-https').click(function () {
-            $('.clone-url').text($(this).data('link'));
-            $('#repo-clone-url').val($(this).data('link'));
-            $(this).addClass('blue');
-            $('#repo-clone-ssh').removeClass('blue');
-        });
-    }
+    // Quick start and repository home
+    $('#repo-clone-ssh').click(function () {
+        $('.clone-url').text($(this).data('link'));
+        $('#repo-clone-url').val($(this).data('link'));
+        $(this).addClass('blue');
+        $('#repo-clone-https').removeClass('blue');
+    });
+    $('#repo-clone-https').click(function () {
+        $('.clone-url').text($(this).data('link'));
+        $('#repo-clone-url').val($(this).data('link'));
+        $(this).addClass('blue');
+        $('#repo-clone-ssh').removeClass('blue');
+    });
+    $('#repo-clone-url').click(function () {
+        $(this).select();
+    });
 
     // Pull request
     if ($('.repository.compare.pull').length > 0) {
-        var $branch_dropdown = $('.choose.branch .dropdown');
-        $branch_dropdown.dropdown({
-            fullTextSearch: true,
-            onChange: function (text, value, $choice) {
-                window.location.href = $choice.data('url');
-                console.log($choice.data('url'))
-            },
-            message: {noResults: $branch_dropdown.data('no-results')}
-        });
+        initFilterSearchDropdown('.choose.branch .dropdown');
     }
 }
 
@@ -540,7 +558,7 @@ function initAdmin() {
 }
 
 function buttonsClickOnEnter() {
-    $('.ui.button').keypress(function(e){
+    $('.ui.button').keypress(function (e) {
         if (e.keyCode == 13 || e.keyCode == 32) // enter key or space bar
             $(this).click();
     });
@@ -553,9 +571,9 @@ $(document).ready(function () {
     // Show exact time
     $('.time-since').each(function () {
         $(this).addClass('poping up').
-            attr('data-content', $(this).attr('title')).
-            attr('data-variation', 'inverted tiny').
-            attr('title', '');
+        attr('data-content', $(this).attr('title')).
+        attr('data-variation', 'inverted tiny').
+        attr('title', '');
     });
 
     // Semantic UI modules.
@@ -678,6 +696,26 @@ $(document).ready(function () {
         $($(this).data('modal')).modal('show');
     });
 
+    // Set anchor.
+    $('.markdown').each(function () {
+        var headers = {};
+        $(this).find('h1, h2, h3, h4, h5, h6').each(function () {
+            var node = $(this);
+            var val = encodeURIComponent(node.text().toLowerCase().replace(/[^\w\- ]/g, '').replace(/[ ]/g, '-'));
+            var name = val;
+            if (headers[val] > 0) {
+                name = val + '-' + headers[val];
+            }
+            if (headers[val] == undefined) {
+                headers[val] = 1;
+            } else {
+                headers[val] += 1;
+            }
+            node = node.wrap('<div id="' + name + '" class="anchor-wrap" ></div>');
+            node.append('<a class="anchor" href="#' + name + '"><span class="octicon octicon-link"></span></a>');
+        });
+    });
+
     buttonsClickOnEnter();
 
     initCommentForm();
@@ -687,4 +725,88 @@ $(document).ready(function () {
     initUser();
     initWebhook();
     initAdmin();
+});
+
+$(window).load(function () {
+    function changeHash(hash) {
+        if (history.pushState) {
+            history.pushState(null, null, hash);
+        }
+        else {
+            location.hash = hash;
+        }
+    }
+
+    function deSelect() {
+        if (window.getSelection) {
+            window.getSelection().removeAllRanges();
+        } else {
+            document.selection.empty();
+        }
+    }
+
+    function selectRange($list, $select, $from) {
+        $list.removeClass('active');
+        if ($from) {
+            var a = parseInt($select.attr('rel').substr(1));
+            var b = parseInt($from.attr('rel').substr(1));
+            var c;
+            if (a != b) {
+                if (a > b) {
+                    c = a;
+                    a = b;
+                    b = c;
+                }
+                var classes = [];
+                for (i = a; i <= b; i++) {
+                    classes.push('.L' + i);
+                }
+                $list.filter(classes.join(',')).addClass('active');
+                changeHash('#L' + a + '-' + 'L' + b);
+                return
+            }
+        }
+        $select.addClass('active');
+        changeHash('#' + $select.attr('rel'));
+    }
+
+    // Code view.
+    if ($('.code-view').length > 0) {
+        var $block = $('.code-view .linenums');
+        var lines = $block.html().split("\n");
+        $block.html('');
+
+        var $num_list = $('.code-view .lines-num');
+
+        // Building blocks.
+        for (var i = 0; i < lines.length; i++) {
+            $block.append('<li class="L' + (i + 1) + '" rel="L' + (i + 1) + '">' + lines[i] + '</li>');
+            $num_list.append('<span id="L' + (i + 1) + '">' + (i + 1) + '</span>');
+        }
+
+        $(document).on('click', '.lines-num span', function (e) {
+            var $select = $(this);
+            var $list = $select.parent().siblings('.lines-code').find('ol.linenums > li');
+            selectRange($list, $list.filter('[rel=' + $select.attr('id') + ']'), (e.shiftKey ? $list.filter('.active').eq(0) : null));
+            deSelect();
+        });
+
+        $(window).on('hashchange', function (e) {
+            var m = window.location.hash.match(/^#(L\d+)\-(L\d+)$/);
+            var $list = $('.code-view ol.linenums > li');
+            var $first;
+            if (m) {
+                $first = $list.filter('.' + m[1]);
+                selectRange($list, $first, $list.filter('.' + m[2]));
+                $("html, body").scrollTop($first.offset().top - 200);
+                return;
+            }
+            m = window.location.hash.match(/^#(L\d+)$/);
+            if (m) {
+                $first = $list.filter('.' + m[1]);
+                selectRange($list, $first);
+                $("html, body").scrollTop($first.offset().top - 200);
+            }
+        }).trigger('hashchange');
+    }
 });

public/less/_base.less

@@ -112,6 +112,12 @@ pre {
 	    	}
 	    }
 		}
+		&.black {
+			color: #444;
+			&:hover {
+				color: #000;
+			}
+		}
 		&.grey {
 	    color: #767676 !important;
 	    a {
@@ -143,6 +149,9 @@ pre {
 		&.small {
 			font-size: 0.75em;
 		}
+		&.normal {
+			font-weight: normal;
+		}
 		&.bold {
 			font-weight: bold;
 		}

public/less/_markdown.less

@@ -1,39 +1,40 @@
 .markdown {
-  overflow:hidden;
-  font-family:"Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif;
-  font-size:16px;
-  line-height:1.6;
-  word-wrap:break-word;
+  overflow: hidden;
+  font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif;
+  font-size: 16px;
+  line-height: 1.6 !important;
+  word-wrap: break-word;
+  padding: 5px 2em 2em !important;
 
   >*:first-child {
-    margin-top:0 !important;
+    margin-top: 0 !important;
   }
 
   >*:last-child {
-    margin-bottom:0 !important;
+    margin-bottom: 0 !important;
   }
 
   a:not([href]) {
-    color:inherit;
-    text-decoration:none;
+    color: inherit;
+    text-decoration: none;
   }
 
   .absent {
-    color:#c00;
+    color: #c00;
   }
 
   .anchor {
-    position:absolute;
-    top:0;
-    left:0;
-    display:block;
-    padding-right:6px;
-    padding-left:30px;
-    margin-left:-30px;
+    position: absolute;
+    top: 0;
+    left: 0;
+    display: block;
+    padding-right: 6px;
+    padding-left: 30px;
+    margin-left: -30px;
   }
 
   .anchor:focus {
-    outline:none;
+    outline: none;
   }
 
   h1,
@@ -42,11 +43,11 @@
   h4,
   h5,
   h6 {
-    position:relative;
-    margin-top:1em;
-    margin-bottom:16px;
-    font-weight:bold;
-    line-height:1.4;
+    position: relative;
+    margin-top: 1em;
+    margin-bottom: 16px;
+    font-weight: bold;
+    line-height: 1.4;
   }
 
   h1 .octicon-link,
@@ -157,8 +158,11 @@
   dl,
   table,
   pre {
-    margin-top:0;
-    margin-bottom:16px;
+    margin-top: 0;
+    margin-bottom: 16px;
+  }
+  blockquote {
+    margin-left: 0;
   }
 
   hr {
@@ -471,124 +475,4 @@
     font-weight:bold;
     background:#f8f8f8;border-top:0;
   }
-
-}
-
-/* Author: jmblog */
-
-/* Project: https://github.com/jmblog/color-themes-for-google-code-prettify */
-
-/* GitHub Theme */
-
-/* Pretty printing styles. Used with prettify.js. */
-
-/* SPAN elements with the classes below are added by prettyprint. */
-
-/* plain text */
-
-.pln {
-    color: #333333;
-}
-@media screen {
-    /* string content */
-    .str {
-        color: #dd1144;
-    }
-    /* a keyword */
-    .kwd {
-        color: #333333;
-    }
-    /* a comment */
-    .com {
-        color: #999988;
-        font-style: italic;
-    }
-    /* a type name */
-    .typ {
-        color: #445588;
-    }
-    /* a literal value */
-    .lit {
-        color: #445588;
-    }
-    /* punctuation */
-    .pun {
-        color: #333333;
-    }
-    /* lisp open bracket */
-    .opn {
-        color: #333333;
-    }
-    /* lisp close bracket */
-    .clo {
-        color: #333333;
-    }
-    /* a markup tag name */
-    .tag {
-        color: navy;
-    }
-    /* a markup attribute name */
-    .atn {
-        color: teal;
-    }
-    /* a markup attribute value */
-    .atv {
-        color: #dd1144;
-    }
-    /* a declaration */
-    .dec {
-        color: #333333;
-    }
-    /* a variable name */
-    .var {
-        color: teal;
-    }
-    /* a function name */
-    .fun {
-        color: #990000;
-    }
-}
-/* Use higher contrast and text-weight for printable form. */
-
-@media print,
-projection {
-    .str {
-        color: #006600;
-    }
-    .kwd {
-        color: #006;
-        font-weight: bold;
-    }
-    .com {
-        color: #600;
-        font-style: italic;
-    }
-    .typ {
-        color: #404;
-        font-weight: bold;
-    }
-    .lit {
-        color: #004444;
-    }
-    .pun,
-    .opn,
-    .clo {
-        color: #444400;
-    }
-    .tag {
-        color: #006;
-        font-weight: bold;
-    }
-    .atn {
-        color: #440044;
-    }
-    .atv {
-        color: #006600;
-    }
-}
-/* Specify class=linenums on a pre to get line numbering */
-
-ol.linenums {
-    margin-top: 0;
-    margin-bottom: 0;
 }

public/less/_octicons.less

@@ -1,6 +1,6 @@
-// v3.1.0
+// v3.3.0
 @octicons-font-path: "../fonts";
-@octicons-version:   "396334ee3da78f4302d25c758ae3e3ce5dc3c97d";
+@octicons-version:   "30e752e9a0821a0a098947055eeece0b0f46bc34";
 
 @font-face {
   font-family: 'octicons';
@@ -40,6 +40,7 @@
 .octicon-microscope:before,
 .octicon-beaker:before { content: '\f0dd'} /*  */
 .octicon-bell:before { content: '\f0de'} /*  */
+.octicon-bold:before { content: '\f0e2'} /*  */
 .octicon-book:before { content: '\f007'} /*  */
 .octicon-bookmark:before { content: '\f07b'} /*  */
 .octicon-briefcase:before { content: '\f0d3'} /*  */
@@ -120,6 +121,7 @@
 .octicon-issue-closed:before { content: '\f028'} /*  */
 .octicon-issue-opened:before { content: '\f026'} /*  */
 .octicon-issue-reopened:before { content: '\f027'} /*  */
+.octicon-italic:before { content: '\f0e4'} /*  */
 .octicon-jersey:before { content: '\f019'} /*  */
 .octicon-key:before { content: '\f049'} /*  */
 .octicon-keyboard:before { content: '\f00d'} /*  */
@@ -134,6 +136,7 @@
 .octicon-mirror-private:before,
 .octicon-git-fork-private:before,
 .octicon-lock:before { content: '\f06a'} /*  */
+.octicon-logo-gist:before { content: '\f0ad'} /*  */
 .octicon-logo-github:before { content: '\f092'} /*  */
 .octicon-mail:before { content: '\f03b'} /*  */
 .octicon-mail-read:before { content: '\f03c'} /*  */
@@ -180,8 +183,6 @@
 .octicon-rocket:before { content: '\f033'} /*  */
 .octicon-rss:before { content: '\f034'} /*  */
 .octicon-ruby:before { content: '\f047'} /*  */
-.octicon-screen-full:before { content: '\f066'} /*  */
-.octicon-screen-normal:before { content: '\f067'} /*  */
 .octicon-search-save:before,
 .octicon-search:before { content: '\f02e'} /*  */
 .octicon-server:before { content: '\f097'} /*  */
@@ -201,8 +202,10 @@
 .octicon-tag-remove:before,
 .octicon-tag-add:before,
 .octicon-tag:before { content: '\f015'} /*  */
+.octicon-tasklist:before { content: '\f0e5'} /*  */
 .octicon-telescope:before { content: '\f088'} /*  */
 .octicon-terminal:before { content: '\f0c8'} /*  */
+.octicon-text-size:before { content: '\f0e3'} /*  */
 .octicon-three-bars:before { content: '\f05e'} /*  */
 .octicon-thumbsdown:before { content: '\f0db'} /*  */
 .octicon-thumbsup:before { content: '\f0da'} /*  */

public/less/_repository.less

@@ -78,6 +78,181 @@
 	 		padding-right: 0;
 	 	}
 	}
+
+	&.file.list {
+		#repo-desc {
+			font-size: 1.2em;
+		}
+		.choose.reference {
+			.header .icon {
+				font-size: 1.4em;
+			}
+		}
+		.head.meta {
+			padding: 0;
+			li {
+				list-style: none;
+				display: inline-block;
+
+				.ui.breadcrumb {
+					margin-top: -5px;
+
+					span,
+					a {
+						font-size: 16px;
+					}
+				}
+			}
+		}
+
+		.clone.input {
+			margin-top: -8px;
+			width: 100%;
+
+			input {
+		    border-radius: 0;
+		    padding: 5px 10px;
+			}
+
+			.clone.button {
+				font-size: 13px;
+				padding: 0 5px;
+				&:first-child {
+			    border-radius: .28571429rem 0 0 .28571429rem;
+				}
+			}
+			.icon.button {
+				padding: 0 10px;
+			}
+			.dropdown .menu {
+				right: 0!important;
+				left: auto!important;
+			}
+		}
+
+		#repo-files-table {
+			.table.list {
+				width: 80% !important;
+			}
+
+			thead {
+				th {
+					padding-top: 8px;
+					padding-bottom: 5px;
+					font-weight: normal;
+
+					#last-commit-message {
+						margin-left: 5px;
+						margin-bottom: -4px;
+						width: 400px;
+					}
+					.age {
+						margin-top: 2px;
+					}
+				}
+				.ui.avatar {
+					margin-bottom: 5px;
+				}
+			}
+			tbody {
+				.icon {
+					margin-left: 5px;
+				}
+				.name {
+					max-width: 120px;
+				}
+				.message {
+			    max-width: 300px;
+				}
+				.age {
+					min-width: 150px;
+				}
+
+				.text.truncate {
+					margin-bottom: -5px;
+					max-width: 100%;
+				}
+			}
+			td {
+				padding-top: 8px;
+				padding-bottom: 8px;
+			}
+			tr:hover {
+		    background-color: #ffffEE;
+			}
+		}
+
+		#file-content {
+			.header {
+				.icon {
+					font-size: 1em;
+			    margin-top: -2px;
+				}
+			}
+			.view-raw {
+				* {
+					width: 100%;
+				}
+				img {
+					padding: 5px 5px 0 5px;
+				}
+			}
+
+			.code-view {
+				* {
+					font-size: 13px;
+					font-family: monospace;
+					line-height: 20px;
+				}
+
+				table {
+					width: 100%;
+				}
+				.lines-num {
+			    vertical-align: top;
+			    text-align: right;
+			    color: #999;
+			    background: #f5f5f5;
+			    width: 1%;
+
+			    span {
+		        font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
+		        line-height: 20px;
+		        padding: 0 10px;
+		        cursor: pointer;
+		        display: block;
+			    }
+				}
+				.lines-num,
+				.lines-code {
+					padding: 0;
+
+
+					pre, 
+					ol,
+					.hljs {
+						background-color: white;
+						margin: 0;
+						padding: 0 !important;
+						li {
+							padding-left: 5px;
+							&.active {
+						    background: #ffffdd;
+							}
+						}
+					}
+				}
+			}
+		}
+
+		.sidebar {
+			padding-left: 0;
+
+			.octicon {
+				width: 16px;
+			}
+		}
+	}
 	
 	&.options {
 		#interval {

routers/repo/view.go

@@ -25,6 +25,7 @@ const (
 
 func Home(ctx *middleware.Context) {
 	ctx.Data["Title"] = ctx.Repo.Repository.Name
+	ctx.Data["RequireHighlightJS"] = true
 
 	branchName := ctx.Repo.BranchName
 	userName := ctx.Repo.Owner.Name

templates/.VERSION

@@ -1 +1 @@
-0.7.8.1113 Beta
+0.7.9.1114 Beta

templates/base/footer.tmpl

@@ -28,7 +28,7 @@
 
 	<!-- Third-party libraries -->
 	{{if .RequireHighlightJS}}
-	<link rel="stylesheet" href="{{AppSubUrl}}/css/highlight-8.7/default.css">
+	<link rel="stylesheet" href="{{AppSubUrl}}/css/highlight-8.7/github.css">
 	<script src="{{AppSubUrl}}/js/libs/highlight-8.7.pack.js"></script>
 	{{end}}
 	{{if .RequireMinicolors}}

templates/repo/home.tmpl

@@ -1,81 +1,117 @@
-{{template "ng/base/head" .}}
-{{template "ng/base/header" .}}
-<div id="repo-wrapper">
-    {{template "repo/header_old" .}}
-    <div id="repo-content" class="clear container">
-        <div id="repo-main" class="left grid-5-6">
-            <p id="repo-desc">
-                {{if .Repository.DescriptionHtml}}<span class="description">{{.Repository.DescriptionHtml}}</span>{{else}}<span class="no-description text-italic">{{.i18n.Tr "repo.no_desc"}}</span>{{end}}
-                <a class="link" href="{{.Repository.Website}}">{{.Repository.Website}}</a>
-            </p>
-            <ul id="repo-file-nav" class="clear menu menu-line">
-                {{if and .IsRepositoryAdmin .Repository.BaseRepo}}
-                {{ $baseRepo := .Repository.BaseRepo}}
-                <li>
-                    <a href="{{AppSubUrl}}/{{$baseRepo.Owner.Name}}/{{$baseRepo.Name}}/compare/{{$.BaseDefaultBranch}}...{{$.Owner.Name}}:{{$.BranchName}}">
-                        <button class="btn btn-green btn-small btn-radius" id="repo-compare-btn"><i class="octicon octicon-git-compare"></i></button>
-                    </a>
-                </li>
-                {{end}}
-                <li id="repo-branch-switch" class="down drop">
-                    <a>
-                        <button class="btn btn-gray btn-medium btn-radius">
-                            <i class="octicon octicon-git-branch"></i> {{if .IsViewBranch}}{{.i18n.Tr "repo.branch"}}{{else}}{{.i18n.Tr "repo.tree"}}{{end}}:
-                            <strong id="repo-branch-current">{{if .IsViewBranch}}{{.BranchName}}{{else}}{{ShortSha .BranchName}}{{end}}</strong>
-                        </button>
-                    </a>
-                    <div class="drop-down panel">
-                        <p class="panel-header text-bold">{{.i18n.Tr "repo.branch_and_tags"}}</p>
-                        <!-- <input id="repo-branch-filter-ipt" class="ipt ipt-large" type="text" placeholder="find branches / tags"/> -->
-                        <div id="repo-branch-tag">
-                            <ul class="menu menu-line tab-nav clear" id="repo-branch-tab-nav">
-                                <li class="js-tab-nav {{if not .IsTag}}js-tab-nav-show{{end}} left" data-tab-target="#repo-branch-list"><a>{{.i18n.Tr "repo.branches"}}</a></li>
-                                <li class="js-tab-nav {{if .IsTag}}js-tab-nav-show{{end}} left" data-tab-target="#repo-tag-list"><a>{{.i18n.Tr "repo.tags"}}</a></li>
-                            </ul>
-                            <ul class="menu menu-vertical switching-list {{if .IsTag}}hide{{end}}" id="repo-branch-list">
-                                {{range .Branches}}
-                                <li {{if eq . $.BranchName}}class="checked"{{end}}><a href="{{$.RepoLink}}/src/{{EscapePound .}}"><i class="octicon octicon-check"></i>{{.}}</a></li>
-                                {{end}}
-                            </ul>
-                            <ul class="menu menu-vertical switching-list {{if not .IsTag}}hide{{end}}" id="repo-tag-list">
-                                {{range .Tags}}
-                                <li {{if eq . $.BranchName}}class="checked"{{end}}><a href="{{$.RepoLink}}/src/{{EscapePound .}}"><i class="octicon octicon-check"></i>{{.}}</a></li>
-                                {{end}}
-                            </ul>
-                        </div>
-                    </div>
-                </li>
-                <li id="repo-bread" class="breads">
-                    <a class="title bread" href="{{.RepoLink}}/src/{{EscapePound .BranchName}}">{{.Repository.Name}}</a>
-                    {{ $n := len .Treenames}}
-                    {{ $l := Subtract $n 1}}
-                    {{range $i, $v := .Treenames}}
-                        {{if eq $i $l}}
-                        <span class="bread">{{$v}}</span>
-                        {{else}}
-                        {{ $p := index $.Paths $i}}
-                        <span class="bread"><a href="{{EscapePound $.BranchLink}}/{{EscapePound $p}}">{{$v}}</a></span>
-                        {{end}}
-                    {{end}}
-                </li>
-                <!-- <li id="repo-commits-jump" class="repo-jump right">
-                    <a href="#">
-                        <button class="btn btn-small btn-gray btn-right-radius"><i class="octicon octicon-git-commit"></i></button>
+{{template "base/head" .}}
+<div class="repository file list">
+  {{template "repo/header" .}}
+  <div class="ui container">
+    {{template "repo/sidebar" .}}
+    <div class="ui grid">
+      <div class="ui ten wide column">
+        <p id="repo-desc">
+          {{if .Repository.DescriptionHtml}}<span class="description">{{.Repository.DescriptionHtml}}</span>{{else}}<span class="no-description text-italic">{{.i18n.Tr "repo.no_desc"}}</span>{{end}}
+          <a class="link" href="{{.Repository.Website}}">{{.Repository.Website}}</a>
+        </p>
+      </div>
+      <div class="ui six wide column">
+        <div class="ui action small clone input">
+          {{if not $.DisableSSH}}
+          <button class="ui blue basic clone button" id="repo-clone-ssh" data-link="{{.CloneLink.SSH}}">
+            SSH
+          </button>
+          {{end}}
+          <button class="ui {{if $.DisableSSH}}blue{{end}} basic clone button" id="repo-clone-https" data-link="{{.CloneLink.HTTPS}}">
+            HTTPS
+          </button>
+          <input id="repo-clone-url" value="{{if $.DisableSSH}}{{$.CloneLink.HTTPS}}{{else}}{{$.CloneLink.SSH}}{{end}}" readonly>
+          <button class="ui basic icon button poping up clipboard" id="clipboard-btn" data-original="{{.i18n.Tr "repo.copy_link"}}" data-success="{{.i18n.Tr "repo.copy_link_success"}}" data-error="{{.i18n.Tr "repo.copy_link_error"}}" data-content="{{.i18n.Tr "repo.copy_link"}}" data-variation="inverted tiny" data-clipboard-target="#repo-clone-url">
+            <i class="octicon octicon-clippy"></i>
+          </button>
+          <div class="ui basic jump dropdown icon button">
+            <i class="download icon"></i>
+            <div class="menu">
+              <a class="item" href="{{$.RepoLink}}/archive/{{EscapePound $.BranchName}}.zip"><i class="icon octicon octicon-file-zip"></i> ZIP</a>
+              <a class="item" href="{{$.RepoLink}}/archive/{{EscapePound $.BranchName}}.tar.gz"><i class="icon octicon octicon-file-zip"></i> TAR.GZ</a>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <ul class="head meta">
+      {{if and .IsRepositoryAdmin .Repository.BaseRepo}}
+      <li>
+        {{ $baseRepo := .Repository.BaseRepo}}
+        <a href="{{AppSubUrl}}/{{$baseRepo.Owner.Name}}/{{$baseRepo.Name}}/compare/{{$.BaseDefaultBranch}}...{{$.Owner.Name}}:{{$.BranchName}}">
+          <button class="ui green small button"><i class="octicon octicon-git-compare"></i></button>
+        </a>
+      </li>
+      {{end}}
+      <li>
+        <div class="choose reference">
+          <div class="ui floating filter dropdown" data-no-results="{{.i18n.Tr "repo.pulls.no_results"}}">
+            <div class="ui basic small button">
+              <span class="text">
+                <i class="octicon octicon-git-branch"></i> 
+                {{if .IsViewBranch}}{{.i18n.Tr "repo.branch"}}{{else}}{{.i18n.Tr "repo.tree"}}{{end}}:
+                <strong>{{if .IsViewBranch}}{{.BranchName}}{{else}}{{ShortSha .BranchName}}{{end}}</strong>
+              </span>
+              <i class="dropdown icon"></i>
+            </div>
+            <div class="menu">
+              <div class="ui icon search input">
+                <i class="filter icon"></i>
+                <input name="search" placeholder="{{.i18n.Tr "repo.filter_branch_and_tag"}}...">
+              </div>
+              <div class="header">
+                <div class="ui grid">
+                  <div class="two column row">
+                    <a class="reference column" href="#" data-target="#branch-list">
+                      <span class="text {{if .IsViewBranch}}black{{end}}">
+                        <i class="icon octicon octicon-git-branch"></i> {{.i18n.Tr "repo.branches"}}
+                      </span>
                     </a>
-                </li>
-                <li id="repo-find-jump" class="repo-jump right">
-                    <a href="#">
-                        <button class="btn btn-small btn-gray btn-left-radius"><i class="octicon octicon-list-unordered"></i></button>
+                    <a class="reference column" href="#" data-target="#tag-list">
+                      <span class="text {{if .IsTag}}black{{end}}">
+                        <i class="reference tags icon"></i> {{.i18n.Tr "repo.tags"}}
+                      </span>
                     </a>
-                </li> -->
-            </ul>
-            {{if .IsFile}}
-                {{template "repo/view_file" .}}
+                  </div>
+                </div>
+              </div>
+              <div id="branch-list" class="scrolling menu" {{if .IsTag}}style="display: none"{{end}}>
+                {{range .Branches}}
+                <div class="item {{if eq $.BranchName .}}selected{{end}}" data-url="{{$.RepoLink}}/src/{{EscapePound .}}">{{.}}</div>
+                {{end}}
+              </div>
+              <div id="tag-list" class="scrolling menu" {{if .IsViewBranch}}style="display: none"{{end}}>
+                {{range .Tags}}
+                <div class="item {{if eq $.BranchName .}}selected{{end}}" data-url="{{$.RepoLink}}/src/{{EscapePound .}}">{{.}}</div>
+                {{end}}
+              </div>
+            </div>
+          </div>
+        </div>
+      </li>
+      <li>
+        <div class="ui breadcrumb">
+          <a class="section" href="{{.RepoLink}}/src/{{EscapePound .BranchName}}">{{.Repository.Name}}</a>
+          {{ $n := len .Treenames}}
+          {{ $l := Subtract $n 1}}
+          {{range $i, $v := .Treenames}}
+            <div class="divider"> / </div>
+            {{if eq $i $l}}
+            <span class="active section">{{$v}}</span>
             {{else}}
-                {{template "repo/view_list" .}}
+            {{ $p := index $.Paths $i}}
+            <span class="section"><a href="{{EscapePound $.BranchLink}}/{{EscapePound $p}}">{{$v}}</a></span>
             {{end}}
+          {{end}}
         </div>
-        {{template "repo/sidebar" .}}
-    </div>
+      </li>
+    </ul>
+    {{if .IsFile}}
+      {{template "repo/view_file" .}}
+    {{else}}
+      {{template "repo/view_list" .}}
+    {{end}}
+  </div>
 </div>
-{{template "ng/base/footer" .}}
+{{template "base/footer" .}}

templates/repo/sidebar.tmpl

@@ -1,30 +1,19 @@
-<div id="repo-sidebar" class="right grid-1-6">
-    <ul class="menu menu-vertical" id="repo-sidebar-nav">
-        <li>
-            <a class="radius" href="{{.RepoLink}}/issues"><i class="octicon octicon-issue-opened"></i>{{.i18n.Tr "repo.issues"}}<span class="num right label label-blue label-radius">{{.Repository.NumOpenIssues}}</span></a>
-        </li>
-        <li>
-            <a class="radius" href="{{.RepoLink}}/pulls"><i class="octicon octicon-git-pull-request"></i>{{.i18n.Tr "repo.pulls"}}<span class="num right label label-blue label-radius">{{.Repository.NumOpenPulls}}</span></a>
-        </li>
-        <li class="border-bottom"></li>
-        <li class="head">{{if .IsViewBranch}}{{.BranchName}}{{else}}{{ShortSha .BranchName}}{{end}}</li>
-        <li>
-            <a class="radius" href="{{.RepoLink}}/commits/{{EscapePound .BranchName}}"><i class="octicon octicon-history"></i>{{.i18n.Tr "repo.commits"}} <span class="num right label label-gray label-radius">{{.CommitsCount}}</span></a>
-        </li>
-        <!-- <li>
-            <a class="radius" href="{{.RepoLink}}/branches"><i class="octicon octicon-git-branch"></i>Branches<span class="num right label label-gray label-radius">{{.BrancheCount}}</span></a>
-        </li> -->
-        <li>
-            <a class="radius" href="{{.RepoLink}}/releases"><i class="octicon octicon-tag"></i>{{.i18n.Tr "repo.releases"}} <span class="num right label label-gray label-radius">{{.Repository.NumTags}}</span></a>
-        </li>
-        <!-- <li>
-            <a class="radius" href="#"><i class="octicon octicon-organization"></i>contributors <span class="num right label label-gray label-radius">43</span></a>
-        </li> -->
-        {{if .IsRepositoryAdmin}}
-        <li class="border-bottom"></li>
-        <li>
-            <a class="radius" href="{{.RepoLink}}/settings"><i class="octicon octicon-tools"></i>{{.i18n.Tr "repo.settings"}}</a>
-        </li>
-        {{end}}
-    </ul>
+<div class="ui five item menu">
+    <a class="item" href="{{.RepoLink}}/issues">
+      <i class="icon octicon octicon-issue-opened"></i> {{.i18n.Tr "repo.issues"}} <span class="ui blue label">{{.Repository.NumOpenIssues}}</span>
+    </a>
+    <a class="item" href="{{.RepoLink}}/pulls">
+      <i class="icon octicon octicon-git-pull-request"></i> {{.i18n.Tr "repo.pulls"}} <span class="ui blue label">{{.Repository.NumOpenPulls}}</span>
+    </a>
+    <a class="item" href="{{.RepoLink}}/commits/{{EscapePound .BranchName}}">
+      <i class="icon octicon octicon-history"></i> {{.i18n.Tr "repo.commits"}} <span class="ui blue label">{{.CommitsCount}}</span>
+    </a>
+    <a class="item" href="{{.RepoLink}}/releases">
+      <i class="icon octicon octicon-tag"></i> {{.i18n.Tr "repo.releases"}} <span class="ui blue label">{{.Repository.NumTags}}</span>
+    </a>
+    {{if .IsRepositoryAdmin}}
+    <a class="item" href="{{.RepoLink}}/settings">
+      <i class="icon octicon octicon-tools"></i> {{.i18n.Tr "repo.settings"}}
+    </a>
+    {{end}}
 </div>

templates/repo/sidebar_mini.tmpl

@@ -1,12 +0,0 @@
-<ul class="menu menu-vertical" id="repo-sidebar-mini">
-    <li><a href="#" class="btn-right-radius"><i class="octicon octicon-code"></i></a></li>
-    <li class="border-bottom"></li>
-    <li><a href="#" class="btn-right-radius"><i class="octicon octicon-issue-opened"></i>
-        <span class="num label label-blue">999</span>
-    </a></li>
-    <li class="current"><a href="#" class="btn-right-radius"><i class="octicon octicon-git-pull-request"></i>
-        <span class="num label label-black">12</span>
-    </a></li>
-    <li class="border-bottom"></li>
-    <li><a href="#" class="btn-right-radius"><i class="octicon octicon-tools"></i></a></li>
-</ul>

templates/repo/view_file.tmpl

@@ -1,50 +1,50 @@
-<div class="panel panel-radius" id="{{if .ReadmeExist}}repo-readme{{else}}repo-read-file{{end}}">
-    <p class="panel-header">
-        {{if .ReadmeExist}}
-            <i class="icon fa fa-book fa-lg"></i>
-	        {{if .ReadmeInList}}
-	        <strong class="file-name">{{.FileName}}</strong>
-	        {{else}}
-	        <strong>{{.FileName}}</strong><span class="file-size">{{FileSize .FileSize}}</span>
-	        {{end}}
-	    {{else}}
-            <i class="icon fa fa-file-text-o"></i>
-            <strong class="file-name">{{.FileName}}</strong><span class="file-size">{{FileSize .FileSize}}</span>
-	    {{end}}
-        {{if not .ReadmeInList}}
-            {{if not .IsCommit}}
-                <a class="right" href="{{.RepoLink}}/src/{{.CommitID}}/{{EscapePound .TreeName}}">
-                    <button class="btn btn-medium btn-gray btn-right-radius btn-comb">{{.i18n.Tr "repo.file_permalink"}}</button>
-                </a>
-            {{end}}
-            <a class="right" href="{{.RepoLink}}/commits/{{EscapePound .BranchName}}/{{EscapePound .TreeName}}">
-                <button class="btn btn-medium btn-gray btn-right-radius btn-comb">{{.i18n.Tr "repo.file_history"}}</button>
-            </a>
-            <a class="right" href="{{EscapePound .FileLink}}">
-                <button class="btn btn-medium btn-gray btn-left-radius btn-comb">{{.i18n.Tr "repo.file_raw"}}</button>
-            </a>
+<div id="file-content">
+  <h4 class="ui top attached header" id="{{if .ReadmeExist}}repo-readme{{else}}repo-read-file{{end}}">
+    {{if .ReadmeExist}}
+      <i class="book icon ui left"></i>
+      {{if .ReadmeInList}}
+      <strong>{{.FileName}}</strong>
+      {{else}}
+      <strong>{{.FileName}}</strong> <span class="text grey normal">{{FileSize .FileSize}}</span>
+      {{end}}
+    {{else}}
+      <i class="file text outline icon ui left"></i>
+      <strong>{{.FileName}}</strong> <span class="text grey normal">{{FileSize .FileSize}}</span>
+    {{end}}
+    {{if not .ReadmeInList}}
+    <div class="ui right">
+      <div class="ui small grey basic buttons">
+        {{if not .IsCommit}}
+          <a class="ui button" href="{{.RepoLink}}/src/{{.CommitID}}/{{EscapePound .TreeName}}">{{.i18n.Tr "repo.file_permalink"}}</a>
         {{end}}
-    </p>
-    <div class="{{if .ReadmeExist}}panel-content markdown{{end}} code-view" id="repo-code-view">
-    	{{if .ReadmeExist}}
-    	{{if .FileContent}}{{.FileContent | Str2html}}{{end}}
+        <a class="ui button" href="{{.RepoLink}}/commits/{{EscapePound .BranchName}}/{{EscapePound .TreeName}}">{{.i18n.Tr "repo.file_history"}}</a>
+        <a class="ui button" href="{{EscapePound .FileLink}}">{{.i18n.Tr "repo.file_raw"}}</a>
+      </div>
+    </div>
+    {{end}}
+  </h4>
+  <div class="ui attached table segment">
+    <div class="{{if .ReadmeExist}}markdown{{else if .IsFileText}}code-view{{end}}">
+      {{if .ReadmeExist}}
+      {{if .FileContent}}{{.FileContent | Str2html}}{{end}}
         {{else if not .IsFileText}}
         <div class="view-raw">
-            {{if .IsImageFile}}
-            <img src="{{EscapePound .FileLink}}">
-            {{else}}
-            <a href="{{EscapePound .FileLink}}" rel="nofollow" class="btn btn-gray btn-radius">{{.i18n.Tr "repo.file_view_raw"}}</a>
-            {{end}}
+          {{if .IsImageFile}}
+          <img src="{{EscapePound .FileLink}}">
+          {{else}}
+          <a href="{{EscapePound .FileLink}}" rel="nofollow" class="btn btn-gray btn-radius">{{.i18n.Tr "repo.file_view_raw"}}</a>
+          {{end}}
         </div>
-    	{{else if .FileSize}}
+      {{else if .FileSize}}
         <table>
-            <tbody>
-                <tr>
-                    <td class="lines-num"></td>
-                    <td class="lines-code"><pre class="prettyprint linenums {{if .FileExt}}lang-{{.FileExt}}{{end}}"><code>{{.FileContent}}</code></pre></td>
-                </tr>
-            </tbody>
+          <tbody>
+            <tr>
+              <td class="lines-num"></td>
+              <td class="lines-code"><pre class="{{if .FileExt}}lang-{{.FileExt}}{{end}}"><code><ol class="linenums">{{.FileContent}}</ol></code></pre></td>
+            </tr>
+          </tbody>
         </table>
-    	{{end}}
+      {{end}}
     </div>
-</div>
+  </div>
+</div>

templates/repo/view_list.tmpl

@@ -1,69 +1,64 @@
-<table id="repo-files-table" class="table-border table-block table-radius">
-    <thead>
+<table id="repo-files-table" class="ui table">
+  <thead>
     <tr>
-        <th colspan="5" class="clear">
-            <span class="author left">
-                {{if .LastCommitUser}}
-                <img class="avatar-24 radius" src="{{.LastCommitUser.AvatarLink}}" />
-                <a href="{{AppSubUrl}}/{{.LastCommitUser.Name}}"><strong>{{.LastCommit.Author.Name}}</strong></a>:
-                {{else}}
-                <img class="avatar-24 radius" src="{{AvatarLink .LastCommit.Author.Email}}" />
-                <strong>{{.LastCommit.Author.Name}}</strong>:
-                {{end}}
-                &nbsp;
-            </span>
-            <span class="last-commit"><a href="{{.RepoLink}}/commit/{{.LastCommit.ID}}" rel="nofollow">
-                <strong>{{ShortSha .LastCommit.ID.String}}</strong></a>
-                <span class="text-truncate">{{RenderCommitMessage .LastCommit.Summary .RepoLink}}</span>
-            </span>
-            <span class="age right">{{TimeSince .LastCommit.Author.When $.Lang}}</span>
-        </th>
+      <th colspan="5" class="clear">
+        <span>
+          {{if .LastCommitUser}}
+          <img class="ui avatar image img-12" src="{{.LastCommitUser.AvatarLink}}" />
+          <a href="{{AppSubUrl}}/{{.LastCommitUser.Name}}"><strong>{{.LastCommit.Author.Name}}</strong></a>:
+          {{else}}
+          <img class="ui avatar image img-12" src="{{AvatarLink .LastCommit.Author.Email}}" />
+          <strong>{{.LastCommit.Author.Name}}</strong>:
+          {{end}}
+        </span>
+        <a class="text black" href="{{.RepoLink}}/commit/{{.LastCommit.ID}}" rel="nofollow">
+        <strong>{{ShortSha .LastCommit.ID.String}}</strong></a>
+        <span class="text truncate grey" id="last-commit-message">{{RenderCommitMessage .LastCommit.Summary .RepoLink}}</span>
+        <span class="ui right text grey age">{{TimeSince .LastCommit.Author.When $.Lang}}</span>
+      </th>
     </tr>
-    </thead>
-    <tbody>
-        {{if .HasParentPath}}
-        <tr class="has-parent">
-            <td class="icon"></td>
-            <td class="name"><a href="{{EscapePound .BranchLink}}{{.ParentPath}}">..</a></td>
-            <th class="sha">SHA1</th>
-            <td class="msg"></td>
-            <td class="age"></td>
-        </tr>
-        {{end}}
-        {{range $item := .Files}}
-            {{$entry := index $item 0}}
-            {{$commit := index $item 1}}
-            <tr>
-            {{if $entry.IsSubModule}}
-            <td class="icon">
-                    <span class="octicon octicon-file-submodule"></span>
-                </td>
-                <td class="name">
-                    {{if $commit.RefUrl}}
-                    <a href="{{$commit.RefUrl}}" class="text-truncate">{{$entry.Name}}</a> @ <a href="{{$commit.RefUrl}}/commit/{{$commit.RefId}}">{{ShortSha $commit.RefId}}</a>
-                    {{else}}
-                    {{$entry.Name}} @ {{ShortSha $commit.RefId}}
-                    {{end}}
-                </td>
-            {{else}}
-            <td class="icon">
-                    <span class="octicon octicon-file-{{if or $entry.IsDir}}directory{{else}}text{{end}}"></span>
-                </td>
-                <td class="name">
-                    <a href="{{EscapePound $.BranchLink}}/{{EscapePound $.TreePath}}{{EscapePound $entry.Name}}" class="text-truncate">{{$entry.Name}}</a>
-                </td>
-                {{end}}
-                <td class="sha">
-                  <a rel="nofollow" class="label label-green" href="{{AppSubUrl}}/{{$.Username}}/{{$.Reponame}}/commit/{{$commit.ID}} ">{{SubStr $commit.ID.String 0 10}} </a>
-                </td>
-                <td class="message">
-                  <span class="text-truncate">{{RenderCommitMessage $commit.Summary $.RepoLink}}</span>
-                </td>
-                <td class="age">{{TimeSince $commit.Committer.When $.Lang}}</td>
-            </tr>
+  </thead>
+  <tbody>
+    {{if .HasParentPath}}
+    <tr class="has-parent">
+      <td><span class="octicon octicon-mail-reply"></span></td>
+      <td><a href="{{EscapePound .BranchLink}}{{.ParentPath}}">..</a></td>
+    </tr>
+    {{end}}
+    {{range $item := .Files}}
+      {{$entry := index $item 0}}
+      {{$commit := index $item 1}}
+      <tr>
+        {{if $entry.IsSubModule}}
+        <td>
+          <span class="icon octicon octicon-file-submodule"></span>
+        </td>
+        <td>
+          {{if $commit.RefUrl}}
+          <a href="{{$commit.RefUrl}}" class="text truncate">{{$entry.Name}}</a> @ <a href="{{$commit.RefUrl}}/commit/{{$commit.RefId}}">{{ShortSha $commit.RefId}}</a>
+          {{else}}
+          {{$entry.Name}} @ {{ShortSha $commit.RefId}}
+          {{end}}
+        </td>
+        {{else}}
+        <td>
+          <span class="icon octicon octicon-file-{{if or $entry.IsDir}}directory{{else}}text{{end}}"></span>
+        </td>
+        <td class="name">
+          <a href="{{EscapePound $.BranchLink}}/{{EscapePound $.TreePath}}{{EscapePound $entry.Name}}" class="text truncate">{{$entry.Name}}</a>
+        </td>
         {{end}}
-    </tbody>
+        <td class="sha">
+          <a rel="nofollow" class="ui green sha label" href="{{AppSubUrl}}/{{$.Username}}/{{$.Reponame}}/commit/{{$commit.ID}} ">{{SubStr $commit.ID.String 0 10}} </a>
+        </td>
+        <td class="message">
+          <span class="text truncate">{{RenderCommitMessage $commit.Summary $.RepoLink}}</span>
+        </td>
+        <td class="text grey right age">{{TimeSince $commit.Committer.When $.Lang}}</td>
+      </tr>
+    {{end}}
+  </tbody>
 </table>
 {{if .ReadmeExist}}
-    {{template "repo/view_file" .}}
+  {{template "repo/view_file" .}}
 {{end}}