purchasing/fuse-angular
3
0
Fork 0
mirror of https://github.com/richard-loafle/fuse-angular.git synced 2025-01-10 04:25:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

Angular and Angular Material 6 compatibility

Browse Source 
+ Small adjustments and polishing up in various apps and pages
This commit is contained in:
Sercan Yemen 2018-05-06 13:29:08 +03:00
parent 5fd146b8da
commit ebf865e2c7
35 changed files with 121 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/fuse-fake-db/mail.ts
View File

@ -442,13 +442,15 @@ export class MailFakeDb
'id' : 0, 'id' : 0,
'handle': 'starred', 'handle': 'starred',
'title' : 'Starred', 'title' : 'Starred',
'icon' : 'star' 'icon' : 'star',
'color' : 'amber-fg'
}, },
{ {
'id' : 1, 'id' : 1,
'handle': 'important', 'handle': 'important',
'title' : 'Important', 'title' : 'Important',
'icon' : 'label' 'icon' : 'label',
'color' : 'red-fg'
} }
]; ];

2
src/app/main/content/apps/academy/course/course.component.html
View File

@ -38,7 +38,7 @@
<mat-icon>menu</mat-icon> <mat-icon>menu</mat-icon>
</button> </button>
<button mat--iconbutton class="mr-16" [routerLink]="'/apps/academy/courses'"> <button mat-icon-button class="mr-16" [routerLink]="'/apps/academy/courses'">
<mat-icon>arrow_back</mat-icon> <mat-icon>arrow_back</mat-icon>
</button> </button>

10
src/app/main/content/apps/chat/chat-view/chat-view.component.html
View File

@ -9,11 +9,11 @@
<div fxLayout="row" fxLayoutAlign="start center"> <div fxLayout="row" fxLayoutAlign="start center">
<!-- RESPONSIVE CHATS BUTTON--> <!-- RESPONSIVE CHATS BUTTON-->
<div mat-icon-button fxHide.gt-md class="responsive-chats-button mr-16" <button mat-icon-button fxHide.gt-md class="responsive-chats-button mr-16"
fuseMatSidenavToggler="chat-left-sidenav" fuseMatSidenavToggler="chat-left-sidenav"
aria-label="chats button"> aria-label="chats button">
<mat-icon class="s-36">chat</mat-icon> <mat-icon>chat</mat-icon>
</div> </button>
<!-- / RESPONSIVE CHATS BUTTON--> <!-- / RESPONSIVE CHATS BUTTON-->
<!-- CHAT CONTACT--> <!-- CHAT CONTACT-->

6
src/app/main/content/apps/contacts/contact-list/contact-list.component.html
View File

@ -73,13 +73,13 @@
<mat-cell *cdkCellDef="let contact"> <mat-cell *cdkCellDef="let contact">
<div fxFlex="row" fxLayoutAlign="end center"> <div fxFlex="row" fxLayoutAlign="end center">
<button mat-icon-button (click)="$event.stopPropagation();toggleStar(contact.id)" aria-label="Toggle star"> <button mat-icon-button (click)="$event.stopPropagation();toggleStar(contact.id)" aria-label="Toggle star">
<mat-icon *ngIf="user.starred.includes(contact.id)">star</mat-icon> <mat-icon class="amber-fg" *ngIf="user.starred.includes(contact.id)">star</mat-icon>
<mat-icon *ngIf="!user.starred.includes(contact.id)">star_outline</mat-icon> <mat-icon class="secondary-text" *ngIf="!user.starred.includes(contact.id)">star_outline</mat-icon>
</button> </button>
<button mat-icon-button [matMenuTriggerFor]="moreMenu" aria-label="More" <button mat-icon-button [matMenuTriggerFor]="moreMenu" aria-label="More"
(click)="$event.stopPropagation();"> (click)="$event.stopPropagation();">
<mat-icon>more_vert</mat-icon> <mat-icon class="secondary-text">more_vert</mat-icon>
</button> </button>
<mat-menu #moreMenu="matMenu"> <mat-menu #moreMenu="matMenu">

6
src/app/main/content/apps/contacts/contact-list/contact-list.component.ts
View File

@ -30,6 +30,7 @@ export class FuseContactsContactListComponent implements OnInit, OnDestroy
checkboxes: {}; checkboxes: {};
onContactsChangedSubscription: Subscription; onContactsChangedSubscription: Subscription;
onFilterChangedSubscription: Subscription;
onSelectedContactsChangedSubscription: Subscription; onSelectedContactsChangedSubscription: Subscription;
onUserDataChangedSubscription: Subscription; onUserDataChangedSubscription: Subscription;
@ -72,6 +73,10 @@ export class FuseContactsContactListComponent implements OnInit, OnDestroy
this.user = user; this.user = user;
}); });
this.onFilterChangedSubscription =
this.contactsService.onFilterChanged.subscribe(() => {
this.contactsService.deselectContacts();
});
} }
ngOnInit() ngOnInit()
@ -82,6 +87,7 @@ export class FuseContactsContactListComponent implements OnInit, OnDestroy
ngOnDestroy() ngOnDestroy()
{ {
this.onContactsChangedSubscription.unsubscribe(); this.onContactsChangedSubscription.unsubscribe();
this.onFilterChangedSubscription.unsubscribe();
this.onSelectedContactsChangedSubscription.unsubscribe(); this.onSelectedContactsChangedSubscription.unsubscribe();
this.onUserDataChangedSubscription.unsubscribe(); this.onUserDataChangedSubscription.unsubscribe();
} }

2
src/app/main/content/apps/contacts/contacts.service.ts
View File

@ -120,7 +120,7 @@ export class ContactsService implements Resolve<any>
*/ */
toggleSelectedContact(id) toggleSelectedContact(id)
{ {
// First, check if we already have that todo as selected... // First, check if we already have that contact as selected...
if ( this.selectedContacts.length > 0 ) if ( this.selectedContacts.length > 0 )
{ {
const index = this.selectedContacts.indexOf(id); const index = this.selectedContacts.indexOf(id);

2
src/app/main/content/apps/dashboards/analytics/analytics.component.html
View File

@ -41,7 +41,7 @@
<div class="content"> <div class="content">
<div class="left mr-32"> <div class="left mr-lg-32">
<div class="pb-24 font-size-18 font-weight-300"> <div class="pb-24 font-size-18 font-weight-300">
How are your active users trending over time? How are your active users trending over time?

2
src/app/main/content/apps/e-commerce/orders/orders.component.html
View File

@ -21,7 +21,7 @@
<!-- / APP TITLE --> <!-- / APP TITLE -->
<!-- SEARCH --> <!-- SEARCH -->
<div class="search-input-wrapper ml-8 m-sm-0" <div class="search-input-wrapper ml-sm-16"
fxFlex="1 0 auto" fxLayout="row" fxLayoutAlign="start center"> fxFlex="1 0 auto" fxLayout="row" fxLayoutAlign="start center">
<label for="search" class="mr-8"> <label for="search" class="mr-8">
<mat-icon class="secondary-text">search</mat-icon> <mat-icon class="secondary-text">search</mat-icon>

9
src/app/main/content/apps/e-commerce/orders/orders.component.scss
View File

@ -1,3 +1,5 @@
@import "src/@fuse/scss/fuse";
:host { :host {
.header { .header {
@ -5,6 +7,13 @@
.search-input-wrapper { .search-input-wrapper {
max-width: 480px; max-width: 480px;
} }
@include media-breakpoint-down(xs) {
margin: 24px 0;
height: 128px !important;
min-height: 128px !important;
max-height: 128px !important;
}
} }
.mat-tab-group, .mat-tab-group,

4
src/app/main/content/apps/e-commerce/product/product.component.html
View File

@ -39,14 +39,14 @@
<!-- / APP TITLE --> <!-- / APP TITLE -->
<button mat-raised-button <button mat-raised-button
class="save-product-button mat-white-bg mt-16 mt-sm-0" class="save-product-button mat-white-bg"
[disabled]="productForm.invalid" [disabled]="productForm.invalid"
*ngIf="pageType ==='new'" (click)="addProduct()"> *ngIf="pageType ==='new'" (click)="addProduct()">
<span>ADD</span> <span>ADD</span>
</button> </button>
<button mat-raised-button <button mat-raised-button
class="save-product-button mat-white-bg mt-16 mt-sm-0" class="save-product-button mat-white-bg"
[disabled]="productForm.invalid || productForm.pristine" [disabled]="productForm.invalid || productForm.pristine"
*ngIf="pageType ==='edit'" (click)="saveProduct()"> *ngIf="pageType ==='edit'" (click)="saveProduct()">
<span>SAVE</span> <span>SAVE</span>

11
src/app/main/content/apps/e-commerce/products/products.component.html
View File

@ -15,13 +15,18 @@
<!-- APP TITLE --> <!-- APP TITLE -->
<div class="logo my-12 m-sm-0" <div class="logo my-12 m-sm-0"
fxLayout="row" fxLayoutAlign="start center"> fxLayout="row" fxLayoutAlign="start center">
<mat-icon class="logo-icon mr-16" *fuseIfOnDom [@animate]="{value:'*',params:{delay:'50ms',scale:'0.2'}}">shopping_basket</mat-icon> <mat-icon class="logo-icon mr-16" *fuseIfOnDom
<span class="logo-text h1" *fuseIfOnDom [@animate]="{value:'*',params:{delay:'100ms',x:'-25px'}}">Products</span> [@animate]="{value:'*',params:{delay:'50ms',scale:'0.2'}}">
shopping_basket
</mat-icon>
<span class="logo-text h1" *fuseIfOnDom [@animate]="{value:'*',params:{delay:'100ms',x:'-25px'}}">
Products
</span>
</div> </div>
<!-- / APP TITLE --> <!-- / APP TITLE -->
<!-- SEARCH --> <!-- SEARCH -->
<div class="search-input-wrapper mx-12 m-md-0" <div class="search-input-wrapper mx-24 m-md-0"
fxFlex="1 0 auto" fxLayout="row" fxLayoutAlign="start center"> fxFlex="1 0 auto" fxLayout="row" fxLayoutAlign="start center">
<label for="search" class="mr-8"> <label for="search" class="mr-8">
<mat-icon class="secondary-text">search</mat-icon> <mat-icon class="secondary-text">search</mat-icon>

7
src/app/main/content/apps/e-commerce/products/products.component.scss
View File

@ -9,9 +9,10 @@
} }
@include media-breakpoint-down(xs) { @include media-breakpoint-down(xs) {
height: 176px !important; margin: 8px 0;
min-height: 176px !important; height: 192px !important;
max-height: 176px !important; min-height: 192px !important;
max-height: 192px !important;
} }
} }

2
src/app/main/content/apps/file-manager/file-list/file-list.component.html
View File

@ -44,7 +44,7 @@
<mat-cell *cdkCellDef="let row" fxFlex="48px" fxHide.gt-md> <mat-cell *cdkCellDef="let row" fxFlex="48px" fxHide.gt-md>
<button mat-icon-button class="sidenav-toggle" <button mat-icon-button class="sidenav-toggle"
fuseMatSidenavToggler="file-manager-right-sidenav"> fuseMatSidenavToggler="file-manager-right-sidenav">
<mat-icon>info</mat-icon> <mat-icon class="secondary-text">info</mat-icon>
</button> </button>
</mat-cell> </mat-cell>
</ng-container> </ng-container>

8
src/app/main/content/apps/mail-ngrx/mail-details/mail-details.component.html
View File

@ -25,13 +25,13 @@
<div class="actions" fxLayout="row" fxLayoutAlign="start center"> <div class="actions" fxLayout="row" fxLayoutAlign="start center">
<button mat-icon-button (click)="toggleStar($event)" aria-label="Toggle star"> <button mat-icon-button (click)="toggleStar($event)" aria-label="Toggle star">
<mat-icon *ngIf="mail.starred">star</mat-icon> <mat-icon class="amber-fg" *ngIf="mail.starred">star</mat-icon>
<mat-icon *ngIf="!mail.starred">star_outline</mat-icon> <mat-icon class="secondary-text" *ngIf="!mail.starred">star_outline</mat-icon>
</button> </button>
<button mat-icon-button (click)="toggleImportant($event)" aria-label="Toggle important"> <button mat-icon-button (click)="toggleImportant($event)" aria-label="Toggle important">
<mat-icon *ngIf="mail.important">label</mat-icon> <mat-icon class="red-fg" *ngIf="mail.important">label</mat-icon>
<mat-icon *ngIf="!mail.important">label_outline</mat-icon> <mat-icon class="secondary-text" *ngIf="!mail.important">label_outline</mat-icon>
</button> </button>
</div> </div>
</div> </div>

2
src/app/main/content/apps/mail-ngrx/sidenavs/main/main-sidenav.component.html
View File

@ -50,7 +50,7 @@
<div class="nav-item" *ngFor="let filter of (filters$ | async)"> <div class="nav-item" *ngFor="let filter of (filters$ | async)">
<a class="nav-link" matRipple [routerLink]="'/apps/mail-ngrx/filter/' + filter.handle" <a class="nav-link" matRipple [routerLink]="'/apps/mail-ngrx/filter/' + filter.handle"
routerLinkActive="active"> routerLinkActive="active">
<mat-icon class="nav-link-icon" *ngIf="filter.icon">{{filter.icon}}</mat-icon> <mat-icon class="nav-link-icon" [ngClass]="filter.color" *ngIf="filter.icon">{{filter.icon}}</mat-icon>
<span>{{filter.title}}</span> <span>{{filter.title}}</span>
</a> </a>
</div> </div>

8
src/app/main/content/apps/mail/mail-details/mail-details.component.html
View File

@ -27,13 +27,13 @@
<div class="actions" fxLayout="row" fxLayoutAlign="start center"> <div class="actions" fxLayout="row" fxLayoutAlign="start center">
<button mat-icon-button (click)="toggleStar($event)" aria-label="Toggle star"> <button mat-icon-button (click)="toggleStar($event)" aria-label="Toggle star">
<mat-icon *ngIf="mail.starred">star</mat-icon> <mat-icon class="amber-fg" *ngIf="mail.starred">star</mat-icon>
<mat-icon *ngIf="!mail.starred">star_outline</mat-icon> <mat-icon class="secondary-text" *ngIf="!mail.starred">star_outline</mat-icon>
</button> </button>
<button mat-icon-button (click)="toggleImportant($event)" aria-label="Toggle important"> <button mat-icon-button (click)="toggleImportant($event)" aria-label="Toggle important">
<mat-icon *ngIf="mail.important">label</mat-icon> <mat-icon class="red-fg" *ngIf="mail.important">label</mat-icon>
<mat-icon *ngIf="!mail.important">label_outline</mat-icon> <mat-icon class="secondary-text" *ngIf="!mail.important">label_outline</mat-icon>
</button> </button>
</div> </div>
</div> </div>

2
src/app/main/content/apps/mail/sidenavs/main/main-sidenav.component.html
View File

@ -49,7 +49,7 @@
<div class="nav-item" *ngFor="let filter of filters"> <div class="nav-item" *ngFor="let filter of filters">
<a class="nav-link" matRipple [routerLink]="'/apps/mail/filter/' + filter.handle" routerLinkActive="active"> <a class="nav-link" matRipple [routerLink]="'/apps/mail/filter/' + filter.handle" routerLinkActive="active">
<mat-icon class="nav-link-icon" *ngIf="filter.icon">{{filter.icon}}</mat-icon> <mat-icon class="nav-link-icon" [ngClass]="filter.color" *ngIf="filter.icon">{{filter.icon}}</mat-icon>
<span>{{filter.title}}</span> <span>{{filter.title}}</span>
</a> </a>
</div> </div>

6
src/app/main/content/apps/scrumboard/board/dialogs/card/card.component.html
View File

@ -326,18 +326,20 @@
<span fxFlex class="section-title">{{checklist.name}}</span> <span fxFlex class="section-title">{{checklist.name}}</span>
<div> <div>
<button mat-icon-button class="checklist-actions-button" <button mat-icon-button class="checklist-actions-button"
[matMenuTriggerFor]="checklistActionsMenu"> [matMenuTriggerFor]="checklistActionsMenu">
<mat-icon class="s-20">more_vert</mat-icon> <mat-icon class="s-20">more_vert</mat-icon>
</button> </button>
<mat-menu #checklistActionsMenu="matMenu"> <mat-menu #checklistActionsMenu="matMenu">
<button mat-menu-item (click)="removeChecklist(checklist)"> <button mat-menu-item (click)="removeChecklist(checklist)">
<mat-icon>delete</mat-icon> <mat-icon>delete</mat-icon>
<span>Remove Checklist</span> <span>Remove Checklist</span>
</button> </button>
</mat-menu> </mat-menu>
</div> </div>
</div> </div>
@ -372,7 +374,7 @@
<button mat-icon-button class="checklist-actions-button" <button mat-icon-button class="checklist-actions-button"
(click)="removeChecklistItem(checkItem, checklist)"> (click)="removeChecklistItem(checkItem, checklist)">
<mat-icon class="s-20">delete</mat-icon> <mat-icon class="secondary-text s-20">delete</mat-icon>
</button> </button>
</div> </div>

24
src/app/main/content/apps/todo/todo-details/todo-details.component.html
View File

@ -20,32 +20,34 @@
<div class="actions" fxLayout="row" fxLayoutAlign="start center"> <div class="actions" fxLayout="row" fxLayoutAlign="start center">
<button mat-icon-button (click)="toggleDeleted($event)" aria-label="Toggle delete">
<mat-icon *ngIf="todo.deleted">delete_forever</mat-icon>
<mat-icon *ngIf="!todo.deleted">delete</mat-icon>
</button>
<button mat-icon-button (click)="toggleImportant($event)" aria-label="Toggle important"> <button mat-icon-button (click)="toggleImportant($event)" aria-label="Toggle important">
<mat-icon *ngIf="todo.important">error</mat-icon> <mat-icon class="red-fg" *ngIf="todo.important">error</mat-icon>
<mat-icon *ngIf="!todo.important">error_outline</mat-icon> <mat-icon class="secondary-text" *ngIf="!todo.important">error_outline</mat-icon>
</button> </button>
<button mat-icon-button (click)="toggleStar($event)" aria-label="Toggle star"> <button mat-icon-button (click)="toggleStar($event)" aria-label="Toggle star">
<mat-icon *ngIf="todo.starred">star</mat-icon> <mat-icon class="amber-fg" *ngIf="todo.starred">star</mat-icon>
<mat-icon *ngIf="!todo.starred">star_outline</mat-icon> <mat-icon class="secondary-text" *ngIf="!todo.starred">star_outline</mat-icon>
</button> </button>
<button mat-icon-button [matMenuTriggerFor]="labelMenu" fxFlex="0 1 auto"> <button mat-icon-button [matMenuTriggerFor]="labelMenu" fxFlex="0 1 auto">
<mat-icon>label</mat-icon> <mat-icon class="secondary-text">label</mat-icon>
</button> </button>
<mat-menu #labelMenu="matMenu"> <mat-menu #labelMenu="matMenu">
<button mat-menu-item *ngFor="let tag of tags" <button mat-menu-item *ngFor="let tag of tags"
(click)="toggleTagOnTodo(tag.id)"> (click)="toggleTagOnTodo(tag.id)">
{{tag.title}} <mat-icon *ngIf="hasTag(tag.id)">check</mat-icon>
<mat-icon *ngIf="!hasTag(tag.id)"></mat-icon>
<span>{{tag.title}}</span>
</button> </button>
</mat-menu> </mat-menu>
<button mat-icon-button (click)="toggleDeleted($event)" aria-label="Toggle delete">
<mat-icon class="secondary-text" *ngIf="todo.deleted">delete_forever</mat-icon>
<mat-icon class="secondary-text" *ngIf="!todo.deleted">delete</mat-icon>
</button>
</div> </div>
</div> </div>

7
src/app/main/content/apps/todo/todo-details/todo-details.component.ts
View File

@ -92,7 +92,7 @@ export class FuseTodoDetailsComponent implements OnInit, OnDestroy
this.onCurrentTodoChanged.unsubscribe(); this.onCurrentTodoChanged.unsubscribe();
this.onNewTodoClicked.unsubscribe(); this.onNewTodoClicked.unsubscribe();
} }
focusTitleField() focusTitleField()
{ {
setTimeout(() => { setTimeout(() => {
@ -157,6 +157,11 @@ export class FuseTodoDetailsComponent implements OnInit, OnDestroy
this.todoService.toggleTagOnTodo(tagId, this.todo); this.todoService.toggleTagOnTodo(tagId, this.todo);
} }
hasTag(tagId)
{
return this.todoService.hasTag(tagId, this.todo);
}
addTodo() addTodo()
{ {
this.todoService.updateTodo(this.todoForm.getRawValue()); this.todoService.updateTodo(this.todoForm.getRawValue());

10
src/app/main/content/apps/todo/todo-list/todo-list-item/todo-list-item.component.html
View File

@ -35,19 +35,19 @@
<button mat-icon-button (click)="toggleImportant($event)" <button mat-icon-button (click)="toggleImportant($event)"
aria-label="Toggle important" fxHide.xs> aria-label="Toggle important" fxHide.xs>
<mat-icon *ngIf="todo.important">error</mat-icon> <mat-icon class="red-fg" *ngIf="todo.important">error</mat-icon>
<mat-icon *ngIf="!todo.important">error_outline</mat-icon> <mat-icon class="secondary-text" *ngIf="!todo.important">error_outline</mat-icon>
</button> </button>
<button mat-icon-button (click)="toggleStar($event)" <button mat-icon-button (click)="toggleStar($event)"
aria-label="Toggle star" fxHide.xs> aria-label="Toggle star" fxHide.xs>
<mat-icon *ngIf="todo.starred">star</mat-icon> <mat-icon class="amber-fg" *ngIf="todo.starred">star</mat-icon>
<mat-icon *ngIf="!todo.starred">star_outline</mat-icon> <mat-icon class="secondary-text" *ngIf="!todo.starred">star_outline</mat-icon>
</button> </button>
<button mat-icon-button [matMenuTriggerFor]="moreMenu" aria-label="More" (click)="$event.stopPropagation()" <button mat-icon-button [matMenuTriggerFor]="moreMenu" aria-label="More" (click)="$event.stopPropagation()"
fxHide.xs> fxHide.xs>
<mat-icon>more_vert</mat-icon> <mat-icon class="secondary-text">more_vert</mat-icon>
</button> </button>
<mat-menu #moreMenu="matMenu"> <mat-menu #moreMenu="matMenu">

2
src/app/main/content/apps/todo/todo.model.ts
View File

@ -30,7 +30,7 @@ export class Todo
this.starred = todo.starred; this.starred = todo.starred;
this.important = todo.important; this.important = todo.important;
this.deleted = todo.deleted; this.deleted = todo.deleted;
this.tags = todo.tags; this.tags = todo.tags || [];
} }
} }

12
src/app/main/content/apps/todo/todo.service.ts
View File

@ -364,10 +364,20 @@ export class TodoService implements Resolve<any>
{ {
todo.tags.push(tagId); todo.tags.push(tagId);
} }
this.updateTodo(todo); this.updateTodo(todo);
} }
hasTag(tagId, todo)
{
if ( !todo.tags )
{
return false;
}
return todo.tags.indexOf(tagId) !== -1;
}
/** /**
* Update the todo * Update the todo
* @param todo * @param todo

2
src/app/main/content/components-third-party/datatable/ngx-datatable.component.html vendored
View File

@ -14,7 +14,7 @@
<a mat-raised-button class="reference-button mat-white-bg mt-16 mt-sm-0" <a mat-raised-button class="reference-button mat-white-bg mt-16 mt-sm-0"
href="https://github.com/swimlane/ngx-datatable" href="https://github.com/swimlane/ngx-datatable"
target="_blank"> target="_blank">
<mat-icon>link</mat-icon> <mat-icon class="mr-8">link</mat-icon>
<span>Reference</span> <span>Reference</span>
</a> </a>
</div> </div>

2
src/app/main/content/components-third-party/google-maps/google-maps.component.html vendored
View File

@ -14,7 +14,7 @@
<a mat-raised-button class="reference-button mat-white-bg mt-16 mt-sm-0" <a mat-raised-button class="reference-button mat-white-bg mt-16 mt-sm-0"
href="https://angular-maps.com" href="https://angular-maps.com"
target="_blank"> target="_blank">
<mat-icon>link</mat-icon> <mat-icon class="mr-8">link</mat-icon>
<span>Reference</span> <span>Reference</span>
</a> </a>
</div> </div>

2
src/app/main/content/pages/authentication/mail-confirm/mail-confirm.component.html
View File

@ -5,7 +5,7 @@
<div id="mail-confirm-form" *fuseIfOnDom [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}"> <div id="mail-confirm-form" *fuseIfOnDom [@animate]="{value:'*',params:{duration:'300ms',y:'100px'}}">
<div class="logo"> <div class="logo">
<mat-icon class="s-96">email</mat-icon> <mat-icon class="blue-fg s-96">email</mat-icon>
</div> </div>
<div class="title">Confirm your email address!</div> <div class="title">Confirm your email address!</div>

4
src/app/main/content/pages/faq/faq.component.scss
View File

@ -23,7 +23,7 @@
h1 { h1 {
color: white; color: white;
font-size: 48px; font-size: 48px;
font-weight: 300; font-weight: 400;
letter-spacing: 0.01em; letter-spacing: 0.01em;
text-align: center; text-align: center;
margin-top: 0; margin-top: 0;
@ -39,7 +39,7 @@
max-width: 480px; max-width: 480px;
text-align: center; text-align: center;
font-weight: 300; font-weight: 300;
letter-spacing: 0.03em; letter-spacing: 0.075em;
margin: 0; margin: 0;
@include media-breakpoint-down('xs') { @include media-breakpoint-down('xs') {

2
src/app/main/content/pages/knowledge-base/knowledge-base.component.html
View File

@ -22,7 +22,7 @@
<a mat-list-item *ngFor="let article of category.featuredArticles" <a mat-list-item *ngFor="let article of category.featuredArticles"
(click)="readArticle(article)"> (click)="readArticle(article)">
<mat-icon class="mr-8">note</mat-icon> <mat-icon class="secondary-text mr-8">note</mat-icon>
{{ article.title }} {{ article.title }}
</a> </a>

4
src/app/main/content/pages/knowledge-base/knowledge-base.component.scss
View File

@ -19,7 +19,7 @@
h1 { h1 {
color: white; color: white;
font-size: 48px; font-size: 48px;
font-weight: 300; font-weight: 400;
letter-spacing: 0.01em; letter-spacing: 0.01em;
text-align: center; text-align: center;
margin-top: 0; margin-top: 0;
@ -35,7 +35,7 @@
max-width: 480px; max-width: 480px;
text-align: center; text-align: center;
font-weight: 300; font-weight: 300;
letter-spacing: 0.03em; letter-spacing: 0.075em;
margin: 0; margin: 0;
@include media-breakpoint-down('xs') { @include media-breakpoint-down('xs') {

4
src/app/main/content/pages/pricing/style-1/style-1.component.scss
View File

@ -26,7 +26,7 @@
.h1 { .h1 {
color: white; color: white;
font-size: 48px; font-size: 48px;
font-weight: 300; font-weight: 400;
letter-spacing: 0.01em; letter-spacing: 0.01em;
text-align: center; text-align: center;
@ -41,7 +41,7 @@
text-align: center; text-align: center;
margin-top: 16px; margin-top: 16px;
font-weight: 300; font-weight: 300;
letter-spacing: 0.03em; letter-spacing: 0.05em;
@include media-breakpoint-down('xs') { @include media-breakpoint-down('xs') {
font-size: 14px; font-size: 14px;

4
src/app/main/content/pages/pricing/style-2/style-2.component.scss
View File

@ -26,7 +26,7 @@
.h1 { .h1 {
color: white; color: white;
font-size: 48px; font-size: 48px;
font-weight: 300; font-weight: 400;
letter-spacing: 0.01em; letter-spacing: 0.01em;
text-align: center; text-align: center;
@ -41,7 +41,7 @@
text-align: center; text-align: center;
margin-top: 16px; margin-top: 16px;
font-weight: 300; font-weight: 300;
letter-spacing: 0.03em; letter-spacing: 0.05em;
@include media-breakpoint-down('xs') { @include media-breakpoint-down('xs') {
font-size: 14px; font-size: 14px;

4
src/app/main/content/pages/pricing/style-3/style-3.component.scss
View File

@ -26,7 +26,7 @@
.h1 { .h1 {
color: white; color: white;
font-size: 48px; font-size: 48px;
font-weight: 300; font-weight: 400;
letter-spacing: 0.01em; letter-spacing: 0.01em;
text-align: center; text-align: center;
@ -41,7 +41,7 @@
text-align: center; text-align: center;
margin-top: 16px; margin-top: 16px;
font-weight: 300; font-weight: 300;
letter-spacing: 0.03em; letter-spacing: 0.05em;
@include media-breakpoint-down('xs') { @include media-breakpoint-down('xs') {
font-size: 14px; font-size: 14px;

10
src/app/main/content/pages/search/tabs/classic/classic.component.html
View File

@ -5,19 +5,17 @@
<span class="result-count h3 secondary-text"> <span class="result-count h3 secondary-text">
<span>54</span> <span>54</span>
<span>Results</span> <span class="ml-4">Results</span>
</span> </span>
<div class="pager" fxLayout="row" fxLayoutAlign="start center"> <div class="pager" fxLayout="row" fxLayoutAlign="start center">
<span class="secondary-text"> <span class="mr-4 secondary-text">Results:</span>
<span>Results:&nbsp;</span>
</span>
<span class="page-info"> <span class="page-info">
<span>1</span> <span>1</span>
<span>-</span> <span class="mx-4">-</span>
<span>10</span> <span>10</span>
<span>of</span> <span class="mx-4">of</span>
<span>54</span> <span>54</span>
</span> </span>

2
src/app/main/content/ui/colors/colors.component.html
View File

@ -15,7 +15,7 @@
<a mat-raised-button class="reference-button mat-white-bg mt-16 mt-sm-0" <a mat-raised-button class="reference-button mat-white-bg mt-16 mt-sm-0"
href="https://www.google.com/design/spec/style/color.html#color-color-palette" href="https://www.google.com/design/spec/style/color.html#color-color-palette"
target="_blank"> target="_blank">
<mat-icon>link</mat-icon> <mat-icon class="mr-8">link</mat-icon>
<span>Reference</span> <span>Reference</span>
</a> </a>

10
src/app/main/content/ui/icons/icons.component.html
View File

@ -1,7 +1,8 @@
<div id="helper-classes" class="page-layout simple tabbed" fxLayout="column" fusePerfectScrollbar> <div id="helper-classes" class="page-layout simple tabbed" fxLayout="column" fusePerfectScrollbar>
<!-- HEADER --> <!-- HEADER -->
<div class="header mat-accent-bg p-24 h-160" fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="row" fxLayoutAlign.gt-xs="space-between center"> <div class="header mat-accent-bg p-24 h-160" fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="row"
fxLayoutAlign.gt-xs="space-between center">
<div fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="column" fxLayoutAlign.gt-xs="center start"> <div fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="column" fxLayoutAlign.gt-xs="center start">
<div class="black-fg" fxLayout="row" fxLayoutAlign="start center"> <div class="black-fg" fxLayout="row" fxLayoutAlign="start center">
@ -12,8 +13,9 @@
<div class="h1 mt-16">Icons</div> <div class="h1 mt-16">Icons</div>
</div> </div>
<a mat-raised-button class="reference-button mat-white-bg mt-16 mt-sm-0" href="https://material.angular.io" target="_blank"> <a mat-raised-button class="reference-button mat-white-bg mt-16 mt-sm-0" href="https://material.angular.io"
<mat-icon>link</mat-icon> target="_blank">
<mat-icon class="mr-8">link</mat-icon>
<span>Reference</span> <span>Reference</span>
</a> </a>
@ -41,7 +43,7 @@
<div class="icon-holder m-16" fxLayout="column" fxLayoutAlign="center center" <div class="icon-holder m-16" fxLayout="column" fxLayoutAlign="center center"
*ngFor="let icon of filteredIcons"> *ngFor="let icon of filteredIcons">
<mat-icon class="s-48">{{icon}}</mat-icon> <mat-icon class="secondary-text s-48">{{icon}}</mat-icon>
<div class="icon-name secondary-text mt-8">{{icon}}</div> <div class="icon-name secondary-text mt-8">{{icon}}</div>
</div> </div>