Updated GitHub design. Still work in progress.

app/app/styles/section/github.scss

@@ -40,6 +40,56 @@
 }
 
 .section-github-render {
+
+	h3 {
+		margin: 40px 0;
+	}
+
+	table {
+		margin: 0px!important;
+	}
+
+	thead.github th {
+		background-color: #f8f8f8;
+		text-align: left;
+		padding: 4px 30px;
+		font-family: "open_sanssemibold";
+		border-bottom: 1px solid #e1e1e1 !important;
+	}
+
+	tbody.github td {
+		border: none !important;
+		border-bottom: 1px solid #e1e1e1 !important;
+    	padding: 15px 30px !important;
+	}
+
+	table.milestone-table {
+		td a.link {
+			font-size: 18px;
+		}
+
+		td span.milestone {
+			color: #3c3c3c;
+			font-size: 18px;
+		}
+
+		progress[value] {
+			background-color: #eeeeee;
+			border-radius: 3px;
+			height: 10px;
+			width: 50%;
+		}
+	}
+
+	.github-avatar {
+		float: left;
+		margin-right: 20px;
+	}
+
+	.github-avatar img {
+		border-radius: 4px;
+	}
+
 	.github-issue-label {
 		font-size: 11px;
 		color: white;
@@ -49,8 +99,80 @@
 		box-shadow: inset 0 -1px 0 rgba(0,0,0,0.12);
 		display: inline-block;
 		line-height: 22px;
+		}
+
+	table.issue-table {
+		td a.link {
+			font-size: 18px;
+		}
+
+		td span.milestone {
+			color: #3c3c3c;
+			font-size: 18px;
+		}
+
+		li.github-commit-item {
+			display: block;
+			width: 95%;
+			font-size: 12px;
+			color: #999;
+
+			> .link {
+				color: #999;
+
+				> .github-avatar {
+					float: left;
+					margin-right: 15px;
+					margin-top: 2px;
+				}
+
+					> .issue-avatar {
+						float: left;
+						margin-right: 15px;
+						margin-top: 10px;
+					}
+
+				> .github-commit-body {
+					margin: 0px;
+					padding: 0px;
+
+					> .github-commit-title {
+						color: #4e575b;
+						text-decoration: none;
+						font-size: 13px;
+						font-weight: 600;
+						line-height: 22px;
+						margin: 0;
+						padding: 0px;
+						overflow: hidden;
+						text-overflow: ellipsis;
+						width: 90%;
+
+						.label-name {
+							font-size: 16px;
+							margin: 0 10px 0 0;
+						}
+					}
+
+					> .github-commit-meta {
+						font-weight: normal;
+						color: #767676;
+						font-size: 14px;
+						margin: 0px;
+						padding: 0px;
+						width: 90%;
+					}
+				}
+
+		}
+	}
 	}
 
+
+
+
+
+/*
     .github-board {
         width: 100%;
         white-space: nowrap;
@@ -144,5 +266,5 @@
                 }
             }
         }
-    }
+    } */
 }

core/section/github/commits_template.go

@@ -18,7 +18,7 @@ const commitsTemplate = `
 
 	<h3>Contributor activity since {{.Config.Since}}{{.Config.DateMessage}}</h3>
 	<table class="contributor-table" style="width: 100%;">
-		<thead>
+		<thead class="github">
 			<tr>
 				<th class="title">Contributor</th>
 				<th class="title">Assigned/Closed</th>
@@ -27,7 +27,7 @@ const commitsTemplate = `
 			</tr>
 		</thead>
 
-		<tbody>
+		<tbody class="github">
 		{{range $stats := .AuthorStats}}
 			<tr>
 				<td style="width: 20%;">
@@ -51,29 +51,36 @@ const commitsTemplate = `
 
 {{if .HasCommits}}
 	<h3>Commits activity since {{.Config.Since}}{{.Config.DateMessage}}</h3>
-		<table>
+
+	<table class="contributor-table" style="width: 100%;">
+		<thead class="github">
+			<tr>
+				<th class="title">Repository:Branch</th>
+				<th class="title">Date</th>
+				<th class="title">Contributor</th>
+				<th class="title">Commits</th>
+			</tr>
+		</thead>
+
+		<tbody class="github">
 		{{range $commit := .BranchCommits}}
 			<tr>
-				<td>
-					{{if $commit.ShowRepo}}{{$commit.Repo}}{{end}}
-				</td>
-				<td>
-					{{if $commit.ShowBranch}}{{$commit.Branch}}{{end}}
-				</td>
-				<td>
-					{{if $commit.ShowDate}}{{$commit.Date}}{{end}}
-				</td>
-				<td>
+				<td style="width: 20%;">{{if $commit.ShowBranch}}{{$commit.Repo}}:{{$commit.Branch}}{{end}}</td>
+				<td style="width: 15%;">{{if $commit.ShowDate}}{{$commit.Date}}{{end}}</td>
+				<td style="width: 15%;">
 					{{if $commit.ShowUser}}
-						<img alt="@{{$commit.Name}}" src="{{$commit.Avatar}}" height="36" width="36"> {{$commit.Name}}
+					<div class="github-avatar">
+						<img alt="@{{$commit.Name}}" src="{{$commit.Avatar}}" height="36" width="36">
+					</div>
+					 {{$commit.Name}}
 					{{end}}
 				</td>
-				<td>
-					<a class="link" href="{{$commit.URL}}">{{$commit.Message}}</a>
-				</td>
+				<td style="width: 50%;"><a class="link" href="{{$commit.URL}}">{{$commit.Message}}</td>
 			</tr>
 		{{end}}
-		</table>
+		</tbody>
+	</table>
+
 {{end}}
 
 </div>

core/section/github/issues_template.go

@@ -41,7 +41,7 @@ const (
 
 
 	<table class="issue-table" style="width: 100%;">
-	    <thead>
+	    <thead class="github">
 	        <tr>
 	            <th class="title">Repository</th>
 	            <th class="title">Milestone</th>
@@ -49,11 +49,11 @@ const (
 	        </tr>
 	    </thead>
 
-	    <tbody>
+	    <tbody class="github">
 		{{range $data := .Issues}}
 	        <tr>
-	            <td style="width: 20%;">{{$data.Repo}}</td>
-	            <td style="width: 20%;">{{$data.Milestone}}</td>
+	            <td style="width: 20%;"><span><a class="link" href="{{$data.URL}}">{{$data.Repo}}</a></span> {{if $data.Private}}(Private){{end}}</td>
+	            <td style="width: 20%;"><span class="milestone">{{$data.Milestone}}</span></td>
 	            <td style="width: 60%;">
 				<li class="github-commit-item">
 				<a class="link" href="{{$data.URL}}">

core/section/github/milestones_template.go

@@ -34,22 +34,22 @@ const (
 		<h3>Milestones: {{.ClosedMS}} closed, {{.OpenMS}} open</h3>
 		<div class="github-board">
 		<table class="milestone-table" style="width: 100%;">
-		    <thead>
+		    <thead class="github">
 		        <tr>
 		            <th class="title">Repository</th>
 		            <th class="title">Milestone</th>
 		            <th class="title">Issue Progress</th>
-					<th class="title">X</th>
+					<th class="title"></th>
 		        </tr>
 		    </thead>
 
-		    <tbody>
+		    <tbody class="github">
 			{{range $data := .Milestones}}
 		        <tr>
-		            <td style="width: 25%;">{{$data.Repo}} </td>
-		            <td style="width: 20%;">{{$data.Name}} <br>
+		            <td style="width: 15%;"><span><a class="link" href="{{$data.URL}}">{{$data.Repo}}</a></span> {{if $data.Private}}(Private){{end}}</td>
+		            <td style="width: 30%;"><span class="milestone">{{$data.Name}}</span><br>
 						{{if $data.IsMilestone}}
-							{{$data.DueDate}} Last updated {{$data.UpdatedAt}}.
+							{{$data.DueDate}} <span><img src="assets/img/github/icon-last-updated.png" alt="Last Updated">Last updated {{$data.UpdatedAt}}</span>
 						{{end}}
 					</td>
 		            <td style="width: 45%;">

core/section/github/summary_template.go

@@ -31,7 +31,7 @@ const summaryTemplate = `
 		</h3>
 
 		<table class="label-table" style="width: 100%;">
-		    <thead>
+		    <thead class="github">
 		        <tr>
 		            <th class="title">Label</th>
 		            <th class="title">Count</th>
@@ -39,12 +39,12 @@ const summaryTemplate = `
 		        </tr>
 		    </thead>
 
-		    <tbody>
+		    <tbody class="github">
 			{{range $slabel := .SharedLabels}}
 		        <tr>
-		            <td style="width: 25%;">{{$slabel.Name}}</td>
-		            <td style="width: 25%;">{{$slabel.Count}}</td>
-		            <td style="width: 50%;">{{$slabel.Repos}}</td>
+		            <td style="width: 15%;">{{$slabel.Name}}</td>
+		            <td style="width: 15%;">{{$slabel.Count}}</td>
+		            <td style="width: 70%;">{{$slabel.Repos}}</td>
 		        </tr>
 			{{end}}
 		    </tbody>