working on updated style

cmd/drone-server/static/images/logo.svg

@@ -20,7 +20,7 @@
   <sodipodi:namedview
      id="base"
      pagecolor="#ffffff"
-     bordercolor="#666666"
+     bordercolor="#2f2f2f"
      borderopacity="1.0"
      inkscape:pageopacity="0.0"
      inkscape:pageshadow="2"
@@ -69,7 +69,7 @@
      transform="translate(-21.720779,-25.639593)">
     <path
        sodipodi:type="arc"
-       style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
+       style="fill:#2f2f2f;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:0;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
        id="path2998"
        sodipodi:cx="172.10474"
        sodipodi:cy="458.39249"
@@ -78,13 +78,13 @@
        d="m 177.53431,458.39249 c 0,2.78946 -2.43091,5.05076 -5.42957,5.05076 -2.99867,0 -5.42957,-2.2613 -5.42957,-5.05076 0,-2.78946 2.4309,-5.05077 5.42957,-5.05077 2.99866,0 5.42957,2.26131 5.42957,5.05077 z"
        transform="matrix(1.0129716,0,0,1.0889445,-131.11643,-452.42373)" />
     <path
-       style="fill:#ffffff;fill-opacity:1;stroke-width:0;stroke-miterlimit:4"
+       style="fill:#2f2f2f;fill-opacity:1;stroke-width:0;stroke-miterlimit:4"
        d="m 43.220779,25.640247 c 9.60163,0.0752 20.51786,6.8438 21.5,19.6 l -13,0 c 0,0 -1.67472,-7.04733 -8.5,-7 -6.82528,0.0473 -8.5,7 -8.5,7 l -13,0 c 0.63161,-12.53073 11.36576,-19.67935 21.5,-19.6 z"
        id="rect3810"
        inkscape:connector-curvature="0"
        sodipodi:nodetypes="scczccs" />
     <path
-       style="fill:#ffffff;fill-opacity:1;stroke-width:0;stroke-miterlimit:4"
+       style="fill:#2f2f2f;fill-opacity:1;stroke-width:0;stroke-miterlimit:4"
        d="m 43.310069,61.990247 c -7.159395,0.01905 -13.847588,-5.383347 -16.58929,-13.75 l 8,0 c 0,0 1.72575,6.96782 8.55103,6.92049 6.82528,-0.0473 8.44897,-6.92049 8.44897,-6.92049 l 8,0 c -1.783351,8.850973 -9.251314,13.730946 -16.41071,13.75 z"
        id="rect3810-1"
        inkscape:connector-curvature="0"

cmd/drone-server/static/scripts/filters/filter.js

@@ -2,6 +2,15 @@
 
 (function () {
 
+	function trunc() {
+		return function(str) {
+			if (str && str.length > 10) {
+				return str.substr(0, 10);
+			}
+			return str;
+		}
+	}
+
 	/**
 	 * author is a helper function that return the builds
 	 * commit or pull request author.
@@ -53,6 +62,7 @@
 
 	angular
 		.module('drone')
+		.filter('trunc', trunc)
 		.filter('author', author)
 		.filter('message', message)
 		.filter('sha', sha)

cmd/drone-server/static/scripts/views/build.html

@@ -1,14 +1,26 @@
 <header>
-	<a href="/" class="logo"></a>
+	<a class="logo float-left" href="/"></a>
-	<div class="title"></div>
+	<a class="menu-item settings float-right" href="/profile"></a>
-	<div class="user">
+	<a class="menu-item users float-right" href="/users" ng-if="user.admin"></a>
-		<span>{{ user.login }}</span>
+	<a class="menu-item help float-right" href="http://readme.drone.io" target="_blank"></a>
-		<img ng-src="{{ user.gravatar_id | gravatar }}" />
+	<a class="menu-item user-name float-right" href="/profile">{{ "+"+user.login }}</a>
-	</div>
 </header>
-	<nav>
+
-		<h1>{{ repo.owner }}<span>{{ repo.name }}</span><span>{{ build.sequence}}</span></h1>
+<header show-nav distance="160" class="dockable transition-fade flex-parent"></header>
-	</nav>
+<section class="central-container">
+	<div class="flex-item pane restrict-center contains-cardset">
+		<div class="breadcrumb flex-item truncate">
+					<a ng-href="/{{ repo.full_name }}" class="backarrow"></a>
+					<a ng-href="/{{ repo.full_name }}" class="level">{{ repo.owner }} / {{ repo.name }}</a>
+					<span class="spacer"></span>
+					<a ng-href="/{{ repo.full_name }}" class="level">{{ build.sequence }}</span>
+					<span class="spacer"></span>
+					<span class="level">{{ task.sequence }}</span>
+		</div>
+	</div>
+</section>
+
+
 	<main>
 
 			<section class="commit-section">

cmd/drone-server/static/scripts/views/builds.html

@@ -1,36 +1,44 @@
-<h1>{{ repo.full_name }}</h1>
+<header>
+	<a class="logo float-left" href="/"></a>
+	<a class="menu-item settings float-right" href="/profile"></a>
+	<a class="menu-item users float-right" href="/users" ng-if="user.admin"></a>
+	<a class="menu-item help float-right" href="http://readme.drone.io" target="_blank"></a>
+	<a class="menu-item user-name float-right" href="/profile">{{ "+"+user.login }}</a>
+</header>
 
-<a href="/">Back</a>
+<header show-nav distance="160" class="dockable transition-fade flex-parent"></header>
-<a ng-href="/{{ repo.full_name }}/edit">Settings</a>
+<section class="central-container">
+	<div class="flex-item pane restrict-center contains-cardset">
+		<div class="breadcrumb flex-item truncate">
+					<a href="/" class="backarrow"></a>
+					<a href="#" class="level">{{ repo.owner }} / {{ repo.name }}</a>
+		</div>
+	</div>
 
-<button ng-click="watch(repo)" ng-if="!repo.starred">Watch</button>
+	<nav>
-<button ng-click="unwatch(repo)" ng-if="repo.starred">Unwatch</button>
+		<a ng-href="/{{ repo.full_name }}/edit" class="nav-item settings float-right"></a>
+		<button ng-click="watch(repo)"   ng-if="!repo.starred" class="nav-item star float-right"></button>
+		<button ng-click="unwatch(repo)" ng-if="repo.starred"  class="nav-item unstar float-right"></button>
+	</nav>
 
-<table border="1">
+	<ul class="cardset list">
-	<thead>
+		<li ng-repeat="build in builds | orderBy:'-sequence'">
-		<tr>
+			<div ng-class="[ 'card', build.state ]">
-			<th>Number</th>
+				<div class="dataset">
-			<th>Status</th>
+					<a ng-href="/{{ repo.full_name }}/{{ build.sequence }}"></a>
-			<th>Started</th>
+					<div class="info-1">
-			<th>Duration</th>
+						<p class="number">{{ build.sequence }}</p>
-			<th>Type</th>
+					</div>
-			<th>Ref</th>
+					<div class="info-2">
-			<th>Commit</th>
+						<p class="branch-sha truncate">{{ build.branch }} ({{build.sha | trunc }})</p>
-			<th>Author</th>
+						<p class="author-time truncate">{{ build.author }} &middot {{ build.started_at | fromNow }}</p>
-			<th>Message</th>
+					</div>
-		</tr>
+					<div class="info-3">
-	</thead>
+						<p class="commit-message truncate">{{ build.message }}</p>
-	<tbody>
+					</div>
-		<tr ng-repeat="build in builds | orderBy:'-sequence'">
+				</div>
-			<td><a ng-href="/{{ repo.full_name }}/{{ build.sequence }}">{{ build.sequence }}</a></td>
+			</div>
-			<td>{{ build.state }}</td>
+		</li>
-			<td>{{ build.started_at | fromNow }}</td>
+	</ul>
-			<td>{{ build.duration | toDuration }}</td>
+
-			<td>{{ build.pull_request ? "pull request" : "push" }}</td>
+</section>
-			<td>{{ build.ref }}</td>
-			<td>{{ build.sha }}</td>
-			<td>{{ build.author }}</td>
-			<td>{{ build.message }}</td>
-		</tr>
-	</tbody>
-</table>

cmd/drone-server/static/scripts/views/repos.html

@@ -1,4 +1,19 @@
-<h1>Dashboard</h1>
+<header>
+	<a class="logo float-left" href="/"></a>
+	<a class="menu-item settings float-right" href="/profile"></a>
+	<a class="menu-item users float-right" href="/users" ng-if="user.admin"></a>
+	<a class="menu-item help float-right" href="http://readme.drone.io" target="_blank"></a>
+	<a class="menu-item user-name float-right" href="/profile">{{ "+"+user.login }}</a>
+</header>
+
+<header show-nav distance="160" class="dockable transition-fade flex-parent"></header>
+<section class="central-container">
+	<div class="flex-item pane restrict-center contains-cardset">
+		<div class="breadcrumb flex-item truncate">
+					<a href="#" class="level">Dashboard</a>
+		</div>
+	</div>
+</section>
 
 <a href="/new">New</a>
 <a href="/profile">Settings</a>

cmd/drone-server/static/scripts/views/user.html

@@ -1,6 +1,21 @@
-<h1>{{ user.login }}</h1>
+<header>
+	<a class="logo float-left" href="/"></a>
+	<a class="menu-item settings float-right" href="/profile"></a>
+	<a class="menu-item users float-right" href="/users" ng-if="user.admin"></a>
+	<a class="menu-item help float-right" href="http://readme.drone.io" target="_blank"></a>
+	<a class="menu-item user-name float-right" href="/profile">{{ "+"+user.login }}</a>
+</header>
+
+<header show-nav distance="160" class="dockable transition-fade flex-parent"></header>
+<section class="central-container">
+	<div class="flex-item pane restrict-center contains-cardset">
+		<div class="breadcrumb flex-item truncate">
+					<a href="/" class="backarrow"></a>
+					<a href="#" class="level">Profile</a>
+		</div>
+	</div>
+</section>
 
-<a href="/">Back</a>
 
 <dl>
 	<dt>Login</dt>

cmd/drone-server/static/scripts/views/users.html

@@ -1,6 +1,20 @@
-<h1>Users</h1>
+<header>
+	<a class="logo float-left" href="/"></a>
+	<a class="menu-item settings float-right" href="/profile"></a>
+	<a class="menu-item users float-right" href="/users" ng-if="user.admin"></a>
+	<a class="menu-item help float-right" href="http://readme.drone.io" target="_blank"></a>
+	<a class="menu-item user-name float-right" href="/profile">{{ "+"+user.login }}</a>
+</header>
 
-<a href="/">Back</a>
+<header show-nav distance="160" class="dockable transition-fade flex-parent"></header>
+<section class="central-container">
+	<div class="flex-item pane restrict-center contains-cardset">
+		<div class="breadcrumb flex-item truncate">
+					<a href="/" class="backarrow"></a>
+					<a href="#" class="level">User Management</a>
+		</div>
+	</div>
+</section>
 
 <table border="1">
 	<thead>