@ -1,5 +1,40 @@ |
|||
.o_nav { |
|||
background: #ffffff!important; |
|||
color: #000000!important; |
|||
/*border-bottom: 2px solid #4DD0E1!important;*/ |
|||
background: #ffffff !important; |
|||
color: #000000 !important; |
|||
/*border-bottom: 2px solid #4DD0E1!important;*/ |
|||
} |
|||
|
|||
body { |
|||
background: #f5f8fa; |
|||
} |
|||
|
|||
.o_userProfileBackground { |
|||
min-height: 30% !important; |
|||
width: 100%; |
|||
height: 150px; |
|||
-webkit-background-size: cover; |
|||
-moz-background-size: cover; |
|||
background-size: cover; |
|||
-o-background-size: cover; |
|||
background-position: center; |
|||
background-image: url('../img/background01.png'); |
|||
text-align: center; |
|||
/*color: white;*/ |
|||
/* Create the parallax scrolling effect */ |
|||
/*background-attachment: fixed;*/ |
|||
background-position: center; |
|||
background-repeat: no-repeat; |
|||
background-size: cover; |
|||
color: #ffffff; |
|||
} |
|||
|
|||
.o_userImgCircular { |
|||
margin-top: -100px; |
|||
margin-left: 25%; |
|||
background: #ffffff; |
|||
width: 50%; |
|||
border: 4px #ffffff solid; |
|||
border-radius: 150px; |
|||
-webkit-border-radius: 150px; |
|||
-moz-border-radius: 150px; |
|||
} |
@ -1,31 +0,0 @@ |
|||
<div class="container"> |
|||
<div class="row"> |
|||
<div class="col-sm-4"> |
|||
<div ng-include="'views/user_template.html'"></div> |
|||
</div> |
|||
<div class="col-sm-8"> |
|||
<div class="card"> |
|||
<table class="table table-striped table-hover "> |
|||
<thead> |
|||
<tr> |
|||
<th>#</th> |
|||
<th>Title</th> |
|||
<th>Description</th> |
|||
<th>Accuracy</th> |
|||
<th>Rating</th> |
|||
</tr> |
|||
</thead> |
|||
<tbody> |
|||
<tr ng-repeat="model in user.models"> |
|||
<td>1</td> |
|||
<td>{{model.title}}</td> |
|||
<td>{{model.description}}</td> |
|||
<td>{{model.accuracy}}</td> |
|||
<td>{{model.rating}}</td> |
|||
</tr> |
|||
</tbody> |
|||
</table> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
@ -1,24 +0,0 @@ |
|||
'use strict'; |
|||
|
|||
angular.module('app.profile', ['ngRoute']) |
|||
|
|||
.config(['$routeProvider', function($routeProvider) { |
|||
$routeProvider.when('/profile', { |
|||
templateUrl: 'views/profile/profile.html', |
|||
controller: 'ProfileCtrl' |
|||
}); |
|||
}]) |
|||
|
|||
.controller('ProfileCtrl', function($scope, $rootScope, $http) { |
|||
|
|||
$http.get(clienturl + 'user') |
|||
.then(function(data) { |
|||
console.log('data success'); |
|||
console.log(data); |
|||
$scope.user = data.data; |
|||
localStorage.setItem("ai_user", JSON.stringify($scope.user)); |
|||
|
|||
}, function(data) { |
|||
console.log('no user'); |
|||
}); |
|||
}); |
@ -0,0 +1,85 @@ |
|||
<div class="container"> |
|||
<div class="row"> |
|||
<div class="col-sm-3"> |
|||
<div class="card"> |
|||
<div class="o_userProfileBackground"> |
|||
</div> |
|||
<div class="card-body"> |
|||
<img class="o_userImgCircular" ng-src="https://www.eyerys.com/sites/default/files/mark_zuckerberg.jpg" /> |
|||
<h4> |
|||
{{user.name}} {{user.lastname}} |
|||
</h4> |
|||
<p>{{user.description}}</p> |
|||
<p> |
|||
<a ng-href="#!/userLikes/{{user._id}}"> |
|||
14 followers |
|||
</a> | |
|||
<a ng-href="#!/userLikes/{{user._id}}"> |
|||
20 following |
|||
</a> |
|||
</p> |
|||
</div> |
|||
</div> |
|||
<br> |
|||
<div class="card"> |
|||
<div class="card-body"> |
|||
<b>About</b> |
|||
<p> |
|||
Twitter <a ng-href="https://twitter.com/{{user.twitter}}" target="_blank">{{user.twitter}}</a> |
|||
</p> |
|||
<p> |
|||
Github <a ng-href="https://github.com/{{user.github}}" target="_blank">{{user.github}}</a> |
|||
</p> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="col-sm-6"> |
|||
<div ng-repeat="post in user.posts"> |
|||
<div class="card"> |
|||
<div class="card-body"> |
|||
<h5 class="card-title">{{post.title}}</h5> |
|||
<h6 class="card-subtitle mb-2 text-muted">{{post.subtitle}}</h6> |
|||
<img ng-src="{{post.img}}" class="img-fluid" /> |
|||
<p class="card-text">{{post.content}}</p> |
|||
<div class="pull-right"> |
|||
<i title="Server" class="fa fa-heart ct_red300 fa-1x"></i> 37 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<br> |
|||
</div> |
|||
</div> |
|||
<div class="col-sm-3"> |
|||
<div class="card"> |
|||
<div class="card-body"> |
|||
<b>Discover</b> |
|||
<p> |
|||
bla bla bla bla bla |
|||
</p> |
|||
<p> |
|||
bla bla bla bla bla |
|||
</p> |
|||
</div> |
|||
</div> |
|||
<br> |
|||
<div class="card"> |
|||
<div class="card-body"> |
|||
<b>Featured posts</b> |
|||
</div> |
|||
<div ng-repeat="post in featured_posts"> |
|||
<div class="card-body"> |
|||
<h5 class="card-title">{{post.title}}</h5> |
|||
<h6 class="card-subtitle mb-2 text-muted">{{post.subtitle}}</h6> |
|||
<img ng-src="{{post.img}}" class="img-fluid" /> |
|||
<p class="card-text">{{post.content}}</p> |
|||
<div class="pull-right"> |
|||
<i title="Server" class="fa fa-heart ct_red300 fa-1x"></i> 37 |
|||
</div> |
|||
</div> |
|||
<hr> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
@ -0,0 +1,59 @@ |
|||
'use strict'; |
|||
|
|||
angular.module('app.user', ['ngRoute']) |
|||
|
|||
.config(['$routeProvider', function($routeProvider) { |
|||
$routeProvider.when('/user', { |
|||
templateUrl: 'views/user/user.html', |
|||
controller: 'UserCtrl' |
|||
}); |
|||
}]) |
|||
|
|||
.controller('UserCtrl', function($scope, $rootScope, $http) { |
|||
|
|||
/*$http.get(apiurl + 'user/' + ) |
|||
.then(function(data) { |
|||
console.log('data success'); |
|||
console.log(data); |
|||
$scope.user = data.data; |
|||
}, function(data) { |
|||
console.log('no user'); |
|||
});*/ |
|||
//fake data
|
|||
$scope.user = { |
|||
username: "mark_zuckerberg", |
|||
name: "Mark", |
|||
lastname: "Zuckerberg", |
|||
description: "Hi all, I'm here to write decentralized blog posts.", |
|||
twitter: "arnaucode", |
|||
github: "arnaucode", |
|||
posts: [ |
|||
{ |
|||
title: "This is the second post", |
|||
subtitle: "this is the subtitle of the second post", |
|||
img: "https://cdn-images-1.medium.com/fit/t/800/240/1*4_E6m7J0112DBi1Lmdniiw.png", |
|||
content: "Some quick example text to build on the card title and make up the bulk of the card's content." |
|||
}, |
|||
{ |
|||
title: "This is the first post", |
|||
subtitle: "this is the subtitle of the first post", |
|||
img: "https://bootstrap-themes.github.io/application/assets/img/unsplash_1.jpg", |
|||
content: "Some quick example text to build on the card title and make up the bulk of the card's content." |
|||
} |
|||
] |
|||
}; |
|||
$scope.featured_posts= [ |
|||
{ |
|||
title: "Thinking about python development", |
|||
subtitle: "this is the subtitle of the second post", |
|||
img: "https://cdn.static-economist.com/sites/default/files/images/2015/09/blogs/economist-explains/code2.png", |
|||
content: "Some quick example text to build on the card title and make up the bulk of the card's content." |
|||
}, |
|||
{ |
|||
title: "Thinking about G", |
|||
subtitle: "this is the subtitle of the first post", |
|||
img: "https://cdn-images-1.medium.com/max/1600/1*RNkyx-Zq7w61eR74nMYgnA.jpeg", |
|||
content: "Some quick example text to build on the card title and make up the bulk of the card's content." |
|||
} |
|||
] |
|||
}); |