overflow_cloud/member_webapp
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

design

Browse Source
This commit is contained in:
sunny 2018-04-25 21:08:19 +09:00
parent f73d4c3c14
commit 8e6dbe9bc3
3 changed files with 28 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/app/commons/component/layout/notification/app.notification.component.html
View File

@ -1,11 +1,11 @@
<div class="ui-g-12 ui-bottom-border-1">
Notifications
</div>
<li role="menuitem" *ngFor="let noti of notifications | slice:0:5; let i = index" class="ui-bottom-border-1 ui-app-noti">
<div class="ui-g ui-g-nopad ui-app-noti">
<h4>Notifications</h4>
<li role="menuitem" *ngFor="let noti of notifications | slice:0:5; let i = index">
<a href="javascript:void(0)" class="topbar-message" (click)="onNotiClick(noti)" [ngStyle]="noti.confirmDate ? '' : {'background-color': 'lightblue'}">
<div class="ui-app-noti-date">{{noti.createDate | date: 'short'}}</div>
<div class="ui-app-noti-title">{{noti.title}}</div>
<div class="ui-app-noti-content">{{noti.message}}</div>
<div class="ui-app-noti-date">{{noti.createDate | date: 'short'}}</div>
</a>
</li>
<li role="menuitem">
@ -13,3 +13,4 @@
<span>View All</span>
</a>
</li>
</div>

2
src/app/commons/component/layout/topbar/app.topbar.component.html
View File

@ -132,7 +132,7 @@
<span class="topbar-badge animated rubberBand" *ngIf="notificationCount > 0">
{{notificationCount}}
</span>
<span class="topbar-item-name">Messages</span>
<span class="topbar-item-name">Notifications</span>
</a>
<ul class="ultima-menu animated fadeInDown">
<of-notification-menu (notificationLoaded)="onNotiLoaded($event)"></of-notification-menu>

14
src/styles.scss
View File

@ -189,17 +189,27 @@ img.ui-img-profile-responsive {
.ui-bottom-border-1 {
border-bottom: #bdbdbd 1px solid;
}
/*.layout-container .ultima-menu{
width: 100% ;
}*/
.layout-container .ultima-menu .ui-app-noti{
h4 {
line-height: 1.2em;
border-top : 1px solid #bdbdbd;
border-bottom : 1px solid #bdbdbd;
margin: 0;
width: 100%;
border-bottom: #bdbdbd 1px solid;
padding: 7px 10px;
color: #bdbdbd;
}
@media (max-width: 1024px){
h4 {
display: none;
}
li{
border-top: #bdbdbd 1px solid;
}
}
li{
padding: 0 ;
width: 100%;