sagi/se-hub
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Merge pull request #49 from sagidayan/UI

Browse source 
Ui
This commit is contained in:
Sagi Dayan 2015-06-18 23:25:59 +03:00
commit c281a5963d
5 changed files with 130 additions and 88 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

116
templates/css/theme.css
View file

@ -76,28 +76,21 @@ body.noscroll
margin-top: 1em;
margin-right: 1em;
position: center;
-webkit-border-radius: 30%;
-moz-border-radius: 30%;
border-radius: 30%;
}
/*.avatar {
background: rgba(0, 0, 0, 0.2);
}*/
.avatar img {
border-radius: 40px;
position:center;
width: 80px;
height: 80px;
margin: 6px; /*centers the image in the parent element */
-webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
}
.avatar img {
border-radius: 40px;
position:center;
width: 80px;
height: 80px;
margin: 6px;
-webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.75);
}
/* Added BY devMatan */
@ -111,14 +104,8 @@ body.noscroll
}*/
.campusAvatar img
{
/*
margin-top: 1em;
margin-right: 1em;
position: center;
*/
.campusAvatar img
{
border-radius: 40px;
position:center;
width: 80px;
@ -157,9 +144,24 @@ body.noscroll
margin-bottom: 10px;
}
.md-avatar img
.feed
{
/*TODO*/
overflow-y: scroll;
height: 300px;
/*width: 100%;*/
}
/*.feedMessages
{
overflow: scroll;
height: 300px;
width: 100%;
}
.feedTasks
{
overflow: scroll;
height: 300px;
width: 100%;
}
.feedContent
@ -167,7 +169,7 @@ body.noscroll
padding-left: 6%;
font-size: 15px;
display:table;
}
}*/
.md-no-sticky
{
@ -181,7 +183,6 @@ body.noscroll
border-radius: 150px;
-webkit-border-radius: 150px;
-moz-border-radius: 150px;
/*background: url(http://i61.tinypic.com/v86f7.png) no-repeat;*/
box-shadow: 0 0 8px rgba(0, 0, 0, .8);
-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
-moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
@ -256,7 +257,6 @@ body.noscroll
-moz-border-radius: 100px;
border-radius: 50px;
width: 30%;
/*top: -40px;*/
position: relative;
z-index: 50;
}
@ -302,7 +302,6 @@ body.noscroll
.user-box img{
width: 100%;
border: 4px #7f7f7f solid;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
@ -350,17 +349,66 @@ body.noscroll
box-sizing: content-box;
}
/*gridList Effects*/
/* md-list-item .md-no-style.md-button, md-list-item.md-no-proxy.md-button {
md-grid-list
{
margin: 8px;
}
.gray
{
background:#f5f5f5;
}
.aliceblue {
background: aliceblue;
}
.green {
background: #b9f6ca;
}
.yellow {
background: #ffff8d;
}
.blue {
background: #84ffff;
}
.purple {
background: #b388ff;
}
.red {
background: #ff8a80;
}
.whiteframedemoBasicUsage md-whiteframe {
background: #fff;
margin: 20px;
padding: 20px;
}
/* md-grid-tile {
transition: all 400ms ease-out 50ms;
}*/
/*END gridList Effects*/
.tasksContent
{
/*float:left;*/
}
md-list-item .md-no-style.md-button, md-list-item.md-no-proxy.md-button {
font-size: inherit;
height: inherit;
text-align: left;
text-transform: none;
width: 100%;
width: 300px;
white-space: normal;
}
md-list-item, md-list-item .md-list-item-inner {
/*md-list-item, md-list-item .md-list-item-inner {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;

5
templates/js/app.js
View file

@ -41,8 +41,11 @@ app.config(['$routeProvider', '$locationProvider',
.when('/Settings', {
templateUrl: 'templates/views/settings.html',
controller: 'settingsController'
})
.when('/tasks', {
templateUrl: 'templates/views/tasks.html',
controller: 'tasksController'
});
}
]);

14
templates/js/controllers/homeController.js
View file

@ -8,20 +8,6 @@ angular.module('SeHub')
];
$scope.messages = [
{
face : imagePath,
what: 'I need to go to luna-park',
who: 'Matan Bar Yosef',
when: '3:08PM',
notes: " Lets do something"
},
{
face : imagePath,
what: 'Lets Lets Lets',
who: 'Matan Bar Yosef',
when: '4:33PM',
notes: " Lets go drink something"
},
{
face : imagePath,
what: 'Let me tell you a secret',

2
templates/js/controllers/mainController.js
View file

@ -53,7 +53,7 @@ angular.module('SeHub')
"title": "Tasks",
"icon": "fa fa-clipboard",
"style": "",
"route": "/campuses"
"route": "/tasks"
}, {
"title": "Settings",
"icon": "fa fa-cogs",

81
templates/views/home.html
View file

@ -22,47 +22,52 @@
</div>
</md-card>
</md-content>
<md-content layout-padding>
<md-card>
<div class = "feed" ><!-- layout-align="center center"> -->
<div>
<md-subheader class="md-no-sticky" style = "background-color:aliceblue; margin-right:0;">Messages</md-subheader>
<md-list-item class="md-3-line" ng-repeat="item in messages">
<div class="md-list-item-text" style="border: 1px solid black;">
<img ng-src="{{user.avatar_url}}" class="roundUserAvatar" alt="{{item.who}}" style="margin:8px"/>
<!-- Instead of "user.avatar.url" suppose to be "postedUserAvatarUrl" -->
<div class="spacer"></div>
<br></br>
<md-divider class = "feedContent">
<h4>{{ item.who }}</h4>
<h5>{{ item.what }}</h5>
<h5><b>{{ item.notes }}</b></h5>
<h6>{{ item.when }}</h6>
</md-divider>
</div>
</md-list-item>
<div class = "feed">
<md-grid-list
md-cols-sm="1" md-cols-md="2" md-cols-gt-md="6"
md-row-height-gt-md="1:1" md-row-height="2:2"
md-gutter="12px" md-gutter-gt-sm="8px" >
<md-grid-tile class="aliceblue"
md-rowspan="2" md-colspan="3" md-colspan-sm="1">
<md-grid-tile-header>
<h3>Messages</h3>
</md-grid-tile-header>
In The Future Will Enter Wanted MESSAGES Text Here
</md-grid-tile>
<md-grid-tile class="gray"
md-rowspan="2" md-colspan="3" md-colspan-sm="1">
<md-grid-tile-header>
<h3>Tasks</h3>
</md-grid-tile-header>
<!-- In The Future Will Enter Wanted TASKS Text Here -->
<div class = "tasksContent" style:"text-align= left;">
For Task 3 Press: <a href="http://localhost:8080/home#/tasks">Task #3</a>
<br>=====================</br>
For Task 4 Press: <a href="http://localhost:8080/home#/home">Task #4</a>
</div>
</md-grid-tile>
</md-grid-list>
</div>
</md-card>
</md-content>
<div class="port_spacer"></div>
<div>
<md-content>
<md-card style="margin:0">
<!-- <md-list> -->
<md-subheader class="md-no-sticky" style = "background-color:aliceblue; margin-right:0;">Tasks</md-subheader>
<md-list-item class="md-3-line" ng-repeat="item in tasks">
<!-- <img ng-src="{{item.face}}?{{$index}}" class="md-avatar" alt="{{item.who}}" /> -->
<div class="md-list-item-text" style="border: 1px solid black;">
<md-divider class = "feedContent">
<h6><u><em>Ex: {{ item.ExNum }}</em></u></h6>
<h5>Task Title: {{ item.notes }}</h5>
<h6>Due Date: {{ item.dueDate }}</h6>
</md-divider>
</div>
</md-list-item>
</md-card>
</md-content>
</div>
<!-- </md-card> -->
<!-- <div layout="row" layout-fill style="padding-right: 320px;">
<md-whiteframe class="md-whiteframe-z4" layout layout-align="center center">
<span>.md-whiteframe-z4</span>
</md-whiteframe>
<md-whiteframe class="md-whiteframe-z5" layout layout-align="center center">
<span>.md-whiteframe-z5</span>
</md-whiteframe>
</div> -->
</div>