M screenshot2.png → screenshot2.png

M webapp/controllers.js → webapp/controllers.js

@@ -5,9 +5,10 @@ $scope,
         $interval
     ) {
         $scope.user={
-            username: "Arnau",
+            username: "idoctnef",
             avatar: "toucan",
-            github: "https://github.com/idoctnef",
+            github: ["github.com/idoctnef", "https://github.com/idoctnef"],
+            taiga: ["project page", "https://projects.primustech.io"],
             totalWorkedTime: 4520
         };
         //localStorage.clear();

M webapp/index.html → webapp/index.html

@@ -12,17 +12,17 @@ <link type="text/css" rel="stylesheet" href="own.css"/>
 
       <!--Let browser know website is optimized for mobile-->
       <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
-      <title>Open Work Time - local version</title>
+      <title>Open Work Time - online version</title>
 
 
 
     </head>
 
-    <body ng-controller="workController as work">
+    <body ng-controller="workController as work" class="grey lighten-2">
 
 
         <nav>
-          <div class="nav-wrapper blue-grey darken-1">
+          <div class="nav-wrapper blue-grey darken-4">
               <a href="#" class="brand-logo">Open Work Time <small>- v0.1</small></a>
               <ul id="nav-mobile" class="right">
                 <li>
@@ -45,33 +45,45 @@ </div>
         </nav>
 
         <div class="row">
-            <div class="col s12 m4 l3 blue-grey lighten-2">
+            <div class="col s12 m4 l2 blue-grey darken-3 white-text">
                 <!-- Grey navigation panel -->
-                <div class="o_user_title center-align">
-                        <img ng-src="img/avatars/{{user.avatar}}.png" alt="" class="circle responsive-img blue-grey lighten-4">
-                        <h3>{{user.username}}</h3>
+                <br>
+                <div class="row">
+                    <div class="col s4">
+                        <img ng-src="img/avatars/{{user.avatar}}.png" alt="" class="circle responsive-img blue-grey lighten-5">
+                    </div>
+                    <div class="col s8">
+                        <h5>{{user.username}}</h5>
+                    </div>
                 </div>
                 <p>
-                    Users's github: <a ng-href="{{user.github}}">{{user.github}}</a>
+                    <a ng-href="{{user.github[1]}}" target="_blank">{{user.github[0]}}</a>
+                </p>
+                <p>
+                    <a ng-href="{{user.taiga[1]}}" target="_blank">{{user.taiga[0]}}</a>
                 </p>
                 <p>
                     Total worked time: {{user.totalWorkedTime | secondsToDateTime | date:'HH:mm'}}h
                 </p>
-              </div>
+                <br/><br/><br/><br/><br/><br/><br/><br/>
+                <br/><br/><br/><br/><br/><br/><br/><br/>
+                <br/><br/><br/><br/><br/><br/><br/><br/>
+                <br/><br/><br/><br/><br/><br/><br/><br/>
+            </div>
 
 
-            <div class="col s12 m8 l9">
+            <div class="col s12 m8 l10">
                 <div class="row">
-                    <div class="card blue-grey lighten-4 col s12 m12 l5">
+                    <div class="card white col s12 m12 l5">
                         <div class="card-content">
                             <span class="card-title">Projects</span>
                             <div class="collection">
-                              <a href="#!" ng-click="projectSelect($index)" ng-repeat="project in projects" class="collection-item avatar blue-grey lighten-4">
+                              <a href="#!" ng-click="projectSelect($index)" ng-repeat="project in projects" class="collection-item avatar white">
                                     <div class="right">
-                                        <div class="waves-effect waves-light btn-floating blue-grey lighten-2" ng-click="editProject($index)">
+                                        <div class="waves-effect waves-light btn-floating indigo lighten-2" ng-click="editProject($index)">
                                             <i class="material-icons"><img src="img/edit.png" class="o_trash_icon" /></i>
                                         </div>
-                                        <div class="waves-effect waves-light btn-floating blue-grey lighten-2" ng-click="removeProject($index)">
+                                        <div class="waves-effect waves-light btn-floating deep-orange lighten-2" ng-click="removeProject($index)">
                                             <i class="material-icons"><img src="img/trash.png" class="o_trash_icon" /></i>
                                         </div>
                                     </div>
@@ -106,7 +118,7 @@ <a ng-click="updateProject()" class="waves-effect waves-light btn blue lighten-2 right">Update project</a>
                         </div>
                     </div>
 
-                    <div ng-show="currentproject.title" class="card blue-grey lighten-4 col s12 m12 l7">
+                    <div ng-show="currentproject.title" class="card white col s12 m12 l7">
                         <div class="card-content">
                             <span class="card-title">
                                 <img ng-src="img/{{currentproject.icon}}.png" class="o_project_title_img"/>
@@ -135,14 +147,14 @@ </canvas>
 
                         </div>
                     </div>
-                    <div ng-show="!currentproject.title" class="card blue-grey lighten-4 col s12 m12 l7" style="height: 200px;">
+                    <div ng-show="!currentproject.title" class="card white col s12 m12 l7" style="height: 200px;">
                         <span class="card-title">
                             Select a project
                         </span>
                     </div>
 
 
-                </div>
+                </div><!-- </row -->
             </div>
         </div>
 

M webapp/own.css → webapp/own.css

@@ -20,9 +20,16 @@ float: right;
 }
 
 .o_user_title{
-    width: 70%;
+    width: 60%;
     max-width: 150px;
     margin-top: 20px;
     margin-left: auto;
     margin-right: auto;
 }
+
+
+/*@media only screen and (min-width: 601px){
+    .o_sidenav{
+        height: 100%;
+    }
+}*/